{"id":44460,"date":"2019-10-03T14:17:29","date_gmt":"2019-10-03T08:47:29","guid":{"rendered":"https:\/\/git-staging.wpastra.com\/?post_type=docs&#038;p=44460"},"modified":"2022-02-23T14:22:41","modified_gmt":"2022-02-23T08:52:41","slug":"naming-convention-astra-2-1","status":"publish","type":"docs","link":"https:\/\/git-staging.wpastra.com\/es\/docs\/naming-convention-astra-2-1\/","title":{"rendered":"Convenci\u00f3n para la asignaci\u00f3n de nombres a los archivos CSS de Astra 2.1.0"},"content":{"rendered":"<p><a href=\"https:\/\/git-staging.wpastra.com\/es\/updates\/astra-2-1\/\">Astra con la versi\u00f3n 2.1.0<\/a> ofrece una opci\u00f3n de generaci\u00f3n de archivos CSS. En este art\u00edculo, ver\u00e1 c\u00f3mo se nombran estos archivos CSS. <\/p>\n\n\n\n<p>La nueva nomenclatura es muy sencilla, para que no te confundas al consultar estos archivos.<\/p>\n\n\n\n<p>El archivo CSS se denomina en funci\u00f3n de la(s) entrada(s) o p\u00e1gina(s) de su sitio web. La direcci\u00f3n<strong> Post ID<\/strong> o el<strong> ID de p\u00e1gina <\/strong>se utilizar\u00e1 como sufijo al final del archivo CSS.<\/p>\n\n\n\n<p>Digamos que usted tiene un puesto y es ID it <strong>\"206<\/strong>\".<\/p>\n\n\n\n<p>Entonces el archivo CSS se auto-generar\u00e1 con este nombre:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li><strong>\"astra-theme-dynamic-css-post-206.css\"<\/strong>&nbsp; (para Astra Theme)<\/li><li><strong>\"astra-addon-dynamic-css-post-206.css\"<\/strong> (para Astro Pro)<\/li><\/ul>\n\n\n\n<figure class=\"wp-block-image\"><a href=\"https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2019\/09\/naming-conventions-astra-css-file-2.png\"><img fetchpriority=\"high\" decoding=\"async\" width=\"1692\" height=\"261\" src=\"https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2019\/09\/naming-conventions-astra-css-file-2.png\" alt=\"Naming Conventions Astra CSS File\" class=\"wp-image-42998\" srcset=\"https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2019\/09\/naming-conventions-astra-css-file-2.png 1692w, https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2019\/09\/naming-conventions-astra-css-file-2-300x46.png 300w, https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2019\/09\/naming-conventions-astra-css-file-2-768x118.png 768w, https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2019\/09\/naming-conventions-astra-css-file-2-1024x158.png 1024w\" sizes=\"(max-width: 1692px) 100vw, 1692px\" \/><\/a><\/figure>","protected":false},"excerpt":{"rendered":"<p>Astra con la versi\u00f3n 2.1.0 ofrece una opci\u00f3n de generaci\u00f3n de archivos CSS. En este art\u00edculo, ver\u00e1s c\u00f3mo se nombran estos archivos CSS. La nueva convenci\u00f3n de nomenclatura es realmente simple, para que no te confundas al mirar estos archivos. El archivo CSS se nombra en funci\u00f3n de la(s) entrada(s) o p\u00e1gina(s) de tu sitio web. El [...]<\/p>","protected":false},"author":20,"featured_media":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_uag_custom_page_level_css":"","site-sidebar-layout":"default","site-content-layout":"default","ast-site-content-layout":"","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","theme-transparent-header-meta":"default","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"docs_category":[108],"docs_tag":[],"class_list":{"0":"post-44460","1":"docs","2":"type-docs","3":"status-publish","5":"docs_category-general"},"spectra_custom_meta":{"_edit_lock":["1645606363:77"],"_edit_last":["77"],"onesignal_meta_box_present":["1"],"onesignal_send_notification":[""],"_yoast_wpseo_primary_docs_category":["108"],"wpil_sync_report3":["1"],"site-sidebar-layout":["default"],"site-content-layout":["default"],"theme-transparent-header-meta":["default"],"_yoast_wpseo_content_score":["60"],"_elementor_controls_usage":["a:0:{}"],"_wp_old_date":["2019-10-01"],"wpil_links_inbound_internal_count":["1"],"wpil_links_inbound_internal_count_data":["s:8428:\"s:8418:\"s:8408:\"s:8398:\"s:8388:\"a:1:{i:0;O:15:\"Wpil_Model_Link\":6:{s:3:\"url\";s:53:\"https:\/\/git-staging.wpastra.com\/docs\/naming-convention-astra-2-1\/\";s:4:\"host\";s:11:\"wpastra.com\";s:8:\"internal\";b:1;s:4:\"post\";O:15:\"Wpil_Model_Post\":5:{s:2:\"id\";s:5:\"42811\";s:5:\"title\";s:56:\"Astra 2.1 is Out with Cleaner HTML and Faster Load Time!\";s:4:\"type\";s:4:\"post\";s:7:\"content\";s:7495:\"<!-- wp:paragraph -->\n<p>A few weeks ago we launched our most ambitious update yet - <a href=\"https:\/\/git-staging.wpastra.com\/astra-2-0\/\">Astra 2.0<\/a>! <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>To be honest, we were a bit surprised by how customers really loved the new release.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Here are just a few responses from the community that made us happy ?<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:image {\"id\":42819,\"align\":\"center\",\"width\":1015,\"height\":258} -->\n<div class=\"wp-block-image\"><figure class=\"aligncenter is-resized\"><img src=\"https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2019\/09\/verdi-comment.png\" alt=\"\" class=\"wp-image-42819\" width=\"1015\" height=\"258\"\/><\/figure><\/div>\n<!-- \/wp:image -->\n\n<!-- wp:image {\"id\":42821,\"align\":\"center\",\"width\":1011,\"height\":150} -->\n<div class=\"wp-block-image\"><figure class=\"aligncenter is-resized\"><img src=\"https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2019\/09\/fajari-comment.png\" alt=\"\" class=\"wp-image-42821\" width=\"1011\" height=\"150\"\/><\/figure><\/div>\n<!-- \/wp:image -->\n\n<!-- wp:paragraph -->\n<p>I only shared a couple here - but there are plenty more reviews and feedback we have received - on our <a href=\"https:\/\/git-staging.wpastra.com\/astra-2-0\/\">blog<\/a>, email replies and also on social media.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>But, as you know we can\u2019t just stop there, right? :)&nbsp;<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>We made a promise to add more customizations, enhancements, and updates in the near future.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>And as you know by now -<strong> <\/strong>continuous and never-ending improvement is a core part of our cultural DNA!!<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>So, I am excited to announce our latest update Astra 2.1! <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>In version 2.1 we are launching a method to generate a CSS file for Astra - so that CSS will not show up inline in the Source Code. <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>This will make it relatively easy for the browsers to cache CSS (which means an improvement in load time and speed).<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Read on to learn what\u2019s changed, and how it will benefit you and your website.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:heading {\"level\":3} -->\n<h3 id=\"0-the-past-inline-css\">The Past... Inline CSS<\/h3>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph -->\n<p>Up until the recent update (Astra 2.0) -&nbsp; whenever you made any changes to your website using the Astra Customizer - the theme generates a dynamic CSS.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>This Dynamic CSS was added to every page of your website.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p><strong>Astra CSS Code:<\/strong><\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:image {\"id\":42863,\"linkDestination\":\"media\"} -->\n<figure class=\"wp-block-image\"><a href=\"https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2019\/09\/astra-inline-theme-css.png\"><img src=\"https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2019\/09\/astra-inline-theme-css.png\" alt=\"\" class=\"wp-image-42863\"\/><\/a><\/figure>\n<!-- \/wp:image -->\n\n<!-- wp:paragraph -->\n<p>Here\u2019s what we learned from the feedback our customers gave - <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>The inline CSS generated by the Astra theme - made the HTML look a little bulkier.&nbsp;<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Sophisticated users and developers always want a cleaner HTML.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Well - we have heard that! And here\u2019s what we have changed.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:heading {\"level\":3} -->\n<h3 id=\"1-the-path-forward\u2026-css-file-generation\">The Path Forward\u2026 CSS File Generation<\/h3>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph -->\n<p>With today\u2019s update - Astra 2.1 - we are further delivering on our promise to help you create faster websites.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Once you have updated your Astra theme and Astra Pro Addon Plugin to version 2.1, you will see a new option on the Astra Options page as below: <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:image {\"id\":44486} -->\n<figure class=\"wp-block-image\"><img src=\"https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2019\/10\/ast-2-1-css-generation-setting.png\" alt=\"\" class=\"wp-image-44486\"\/><\/figure>\n<!-- \/wp:image -->\n\n<!-- wp:paragraph -->\n<p>When you enable it - you will notice that the inline CSS will not show up in the Source Code anymore.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>The inline CSS will now be added as a separate file.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:image {\"id\":42876,\"linkDestination\":\"media\"} -->\n<figure class=\"wp-block-image\"><a href=\"https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2019\/09\/astra-theme-dynamic-css-file.png\"><img src=\"https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2019\/09\/astra-theme-dynamic-css-file.png\" alt=\"\" class=\"wp-image-42876\"\/><\/a><\/figure>\n<!-- \/wp:image -->\n\n<!-- wp:paragraph -->\n<p><strong>Note that this option is available with the Astra Pro<\/strong>. <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Based on your settings in the Astra Customizer - the CSS file will be generated for each of the pages and will be loaded along with the page. So instead of generating inline dynamic CSS every time, a separate file will serve required CSS from the addon.  Browsers can easily cache this file. <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>You can read how these CSS files are named <a href=\"https:\/\/git-staging.wpastra.com\/docs\/naming-convention-astra-2-1\/\">here<\/a>. <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:heading {\"level\":3} -->\n<h3 id=\"3-what-does-this-mean-for-you\">What Does This Mean for You?<\/h3>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph -->\n<p>There are a few benefits that you will notice with this update.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>This will make the browser caching faster.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>And this improves your website\u2019s response time, which means your users\/customers can retrieve your web pages and content faster.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>We are getting there folks !!&nbsp;<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>This update will improve your site loading speed with 8.47% :)<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:image {\"id\":44498} -->\n<figure class=\"wp-block-image\"><img src=\"https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2019\/10\/ast-2-1-css-generation-stats.png\" alt=\"\" class=\"wp-image-44498\"\/><\/figure>\n<!-- \/wp:image -->\n\n<!-- wp:paragraph -->\n<p>Our mission to make websites faster is a never-ending quest -&nbsp; and we will help you get there (one update like this at a time).<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p><a href=\"https:\/\/git-staging.wpastra.com\/docs\/enable-css-file-generation\/\">Here <\/a>is a detailed document that will show how to get started with this update?<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Stay tuned for more updates like this (coming soon). To get a preview of what\u2019s coming down the path - here\u2019s where you will find our <a href=\"https:\/\/trello.com\/b\/yEXMkrzZ\/astra-public-roadmap\">public roadmap<\/a>. In case of any query write to our awesome <a href=\"https:\/\/git-staging.wpastra.com\/contact\/\">support team<\/a>. <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>As usual - we always welcome your feedback.&nbsp; Please let us know your thoughts in the comments below! <\/p>\n<!-- \/wp:paragraph -->\";s:5:\"links\";O:8:\"stdClass\":4:{s:4:\"view\";s:30:\"https:\/\/git-staging.wpastra.com\/astra-2-1\/\";s:4:\"edit\";N;s:6:\"export\";s:68:\"https:\/\/git-staging.wpastra.com\/wp-admin\/post.php?area=wpil_export&post_id=42811\";s:7:\"refresh\";s:99:\"https:\/\/git-staging.wpastra.com\/wp-admin\/admin.php?page=link_whisper&type=post_links_count_update&post_id=42811\";}}s:6:\"anchor\";s:4:\"here\";s:15:\"added_by_plugin\";b:0;}}\";\";\";\";\";"],"wpil_links_outbound_internal_count":["1"],"wpil_links_outbound_internal_count_data":["s:8422:\"s:8412:\"s:8402:\"s:8392:\"s:8382:\"a:1:{i:0;O:15:\"Wpil_Model_Link\":6:{s:3:\"url\";s:30:\"https:\/\/git-staging.wpastra.com\/astra-2-1\/\";s:4:\"host\";s:11:\"wpastra.com\";s:8:\"internal\";b:1;s:4:\"post\";O:15:\"Wpil_Model_Post\":5:{s:2:\"id\";i:42811;s:5:\"title\";s:56:\"Astra 2.1 is Out with Cleaner HTML and Faster Load Time!\";s:4:\"type\";s:4:\"post\";s:7:\"content\";s:7495:\"<!-- wp:paragraph -->\n<p>A few weeks ago we launched our most ambitious update yet - <a href=\"https:\/\/git-staging.wpastra.com\/astra-2-0\/\">Astra 2.0<\/a>! <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>To be honest, we were a bit surprised by how customers really loved the new release.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Here are just a few responses from the community that made us happy ?<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:image {\"id\":42819,\"align\":\"center\",\"width\":1015,\"height\":258} -->\n<div class=\"wp-block-image\"><figure class=\"aligncenter is-resized\"><img src=\"https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2019\/09\/verdi-comment.png\" alt=\"\" class=\"wp-image-42819\" width=\"1015\" height=\"258\"\/><\/figure><\/div>\n<!-- \/wp:image -->\n\n<!-- wp:image {\"id\":42821,\"align\":\"center\",\"width\":1011,\"height\":150} -->\n<div class=\"wp-block-image\"><figure class=\"aligncenter is-resized\"><img src=\"https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2019\/09\/fajari-comment.png\" alt=\"\" class=\"wp-image-42821\" width=\"1011\" height=\"150\"\/><\/figure><\/div>\n<!-- \/wp:image -->\n\n<!-- wp:paragraph -->\n<p>I only shared a couple here - but there are plenty more reviews and feedback we have received - on our <a href=\"https:\/\/git-staging.wpastra.com\/astra-2-0\/\">blog<\/a>, email replies and also on social media.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>But, as you know we can\u2019t just stop there, right? :)&nbsp;<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>We made a promise to add more customizations, enhancements, and updates in the near future.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>And as you know by now -<strong> <\/strong>continuous and never-ending improvement is a core part of our cultural DNA!!<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>So, I am excited to announce our latest update Astra 2.1! <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>In version 2.1 we are launching a method to generate a CSS file for Astra - so that CSS will not show up inline in the Source Code. <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>This will make it relatively easy for the browsers to cache CSS (which means an improvement in load time and speed).<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Read on to learn what\u2019s changed, and how it will benefit you and your website.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:heading {\"level\":3} -->\n<h3 id=\"0-the-past-inline-css\">The Past... Inline CSS<\/h3>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph -->\n<p>Up until the recent update (Astra 2.0) -&nbsp; whenever you made any changes to your website using the Astra Customizer - the theme generates a dynamic CSS.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>This Dynamic CSS was added to every page of your website.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p><strong>Astra CSS Code:<\/strong><\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:image {\"id\":42863,\"linkDestination\":\"media\"} -->\n<figure class=\"wp-block-image\"><a href=\"https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2019\/09\/astra-inline-theme-css.png\"><img src=\"https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2019\/09\/astra-inline-theme-css.png\" alt=\"\" class=\"wp-image-42863\"\/><\/a><\/figure>\n<!-- \/wp:image -->\n\n<!-- wp:paragraph -->\n<p>Here\u2019s what we learned from the feedback our customers gave - <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>The inline CSS generated by the Astra theme - made the HTML look a little bulkier.&nbsp;<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Sophisticated users and developers always want a cleaner HTML.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Well - we have heard that! And here\u2019s what we have changed.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:heading {\"level\":3} -->\n<h3 id=\"1-the-path-forward\u2026-css-file-generation\">The Path Forward\u2026 CSS File Generation<\/h3>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph -->\n<p>With today\u2019s update - Astra 2.1 - we are further delivering on our promise to help you create faster websites.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Once you have updated your Astra theme and Astra Pro Addon Plugin to version 2.1, you will see a new option on the Astra Options page as below: <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:image {\"id\":44486} -->\n<figure class=\"wp-block-image\"><img src=\"https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2019\/10\/ast-2-1-css-generation-setting.png\" alt=\"\" class=\"wp-image-44486\"\/><\/figure>\n<!-- \/wp:image -->\n\n<!-- wp:paragraph -->\n<p>When you enable it - you will notice that the inline CSS will not show up in the Source Code anymore.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>The inline CSS will now be added as a separate file.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:image {\"id\":42876,\"linkDestination\":\"media\"} -->\n<figure class=\"wp-block-image\"><a href=\"https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2019\/09\/astra-theme-dynamic-css-file.png\"><img src=\"https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2019\/09\/astra-theme-dynamic-css-file.png\" alt=\"\" class=\"wp-image-42876\"\/><\/a><\/figure>\n<!-- \/wp:image -->\n\n<!-- wp:paragraph -->\n<p><strong>Note that this option is available with the Astra Pro<\/strong>. <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Based on your settings in the Astra Customizer - the CSS file will be generated for each of the pages and will be loaded along with the page. So instead of generating inline dynamic CSS every time, a separate file will serve required CSS from the addon.  Browsers can easily cache this file. <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>You can read how these CSS files are named <a href=\"https:\/\/git-staging.wpastra.com\/docs\/naming-convention-astra-2-1\/\">here<\/a>. <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:heading {\"level\":3} -->\n<h3 id=\"3-what-does-this-mean-for-you\">What Does This Mean for You?<\/h3>\n<!-- \/wp:heading -->\n\n<!-- wp:paragraph -->\n<p>There are a few benefits that you will notice with this update.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>This will make the browser caching faster.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>And this improves your website\u2019s response time, which means your users\/customers can retrieve your web pages and content faster.<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>We are getting there folks !!&nbsp;<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>This update will improve your site loading speed with 8.47% :)<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:image {\"id\":44498} -->\n<figure class=\"wp-block-image\"><img src=\"https:\/\/git-staging.wpastra.com\/wp-content\/uploads\/2019\/10\/ast-2-1-css-generation-stats.png\" alt=\"\" class=\"wp-image-44498\"\/><\/figure>\n<!-- \/wp:image -->\n\n<!-- wp:paragraph -->\n<p>Our mission to make websites faster is a never-ending quest -&nbsp; and we will help you get there (one update like this at a time).<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p><a href=\"https:\/\/git-staging.wpastra.com\/docs\/enable-css-file-generation\/\">Here <\/a>is a detailed document that will show how to get started with this update?<\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>Stay tuned for more updates like this (coming soon). To get a preview of what\u2019s coming down the path - here\u2019s where you will find our <a href=\"https:\/\/trello.com\/b\/yEXMkrzZ\/astra-public-roadmap\">public roadmap<\/a>. In case of any query write to our awesome <a href=\"https:\/\/git-staging.wpastra.com\/contact\/\">support team<\/a>. <\/p>\n<!-- \/wp:paragraph -->\n\n<!-- wp:paragraph -->\n<p>As usual - we always welcome your feedback.&nbsp; Please let us know your thoughts in the comments below! <\/p>\n<!-- \/wp:paragraph -->\";s:5:\"links\";O:8:\"stdClass\":4:{s:4:\"view\";s:30:\"https:\/\/git-staging.wpastra.com\/astra-2-1\/\";s:4:\"edit\";N;s:6:\"export\";s:68:\"https:\/\/git-staging.wpastra.com\/wp-admin\/post.php?area=wpil_export&post_id=42811\";s:7:\"refresh\";s:99:\"https:\/\/git-staging.wpastra.com\/wp-admin\/admin.php?page=link_whisper&type=post_links_count_update&post_id=42811\";}}s:6:\"anchor\";s:24:\"Astra with version 2.1.0\";s:15:\"added_by_plugin\";b:0;}}\";\";\";\";\";"],"wpil_links_outbound_external_count":["1"],"wpil_links_outbound_external_count_data":["a:1:{i:0;O:15:\"Wpil_Model_Link\":6:{s:3:\"url\";s:86:\"https:\/\/wpastra.com\/wp-content\/uploads\/2019\/09\/naming-conventions-astra-css-file-2.png\";s:4:\"host\";s:11:\"wpastra.com\";s:8:\"internal\";b:0;s:4:\"post\";N;s:6:\"anchor\";s:129:\"<img src=\"https:\/\/wpastra.com\/wp-content\/uploads\/2019\/09\/naming-conventions-astra-css-file-2.png\" alt=\"\" class=\"wp-image-42998\"\/>\";s:15:\"added_by_plugin\";b:0;}}"],"wpil_sync_report2_time":["2019-10-14T14:25:33+00:00"],"_ht_kb_post_views_count":["5"],"_ht_kb_usefulness":["0"],"_ht_article_order_108":["44460"],"wp_last_modified_info":["February 23, 2022 @ 2:22 PM"],"wplmi_shortcode":["[lmt-post-modified-info]"],"views":["3893"],"helpful":["4"],"unhelpful":["1"],"redirects":["0"],"rank_math_primary_docs_category":["108"],"rank_math_news_sitemap_robots":["index"],"rank_math_robots":["a:1:{i:0;s:5:\"index\";}"],"rank_math_analytic_object_id":["797"],"rank_math_seo_score":["16"],"pfd_related_docs":[""],"tap_disable_autolinker":["no"],"tap_autolink_inside_heading":["global"],"tap_autolink_random_placement":["global"],"tap_post_autolinker_limit":["0"],"rank_math_internal_links_processed":["1"],"rank_math_og_content_image":["a:2:{s:5:\"check\";s:32:\"f56f9454e261ecf752ee1d7712939971\";s:6:\"images\";a:1:{i:0;i:42998;}}"],"_trp_automatically_translated_slug_es_ES":["convencion-de-nomenclatura-astra-2-1"],"_uag_page_assets":["a:9:{s:3:\"css\";s:2495:\".wp-block-uagb-container.uagb-block-debf2792 .uagb-container__shape-top svg{width: calc( 100% + 1.3px );}.wp-block-uagb-container.uagb-block-debf2792 .uagb-container__shape.uagb-container__shape-top .uagb-container__shape-fill{fill: rgba(51,51,51,1);}.wp-block-uagb-container.uagb-block-debf2792 .uagb-container__shape-bottom svg{width: calc( 100% + 1.3px );}.wp-block-uagb-container.uagb-block-debf2792 .uagb-container__shape.uagb-container__shape-bottom .uagb-container__shape-fill{fill: rgba(51,51,51,1);}.wp-block-uagb-container.uagb-block-debf2792 .uagb-container__video-wrap video{opacity: 1;}.wp-block-uagb-container.uagb-is-root-container .uagb-block-debf2792{max-width: 100%;width: 100%;}.wp-block-uagb-container.uagb-is-root-container.alignfull.uagb-block-debf2792 > .uagb-container-inner-blocks-wrap{--inner-content-custom-width: min( 100%, 1200px);max-width: var(--inner-content-custom-width);width: 100%;flex-direction: column;align-items: center;justify-content: center;flex-wrap: nowrap;row-gap: 0px;column-gap: 0px;}.wp-block-uagb-container.uagb-block-debf2792{box-shadow: 0px 0px   #00000070 ;padding-top: 0px;padding-bottom: 0px;padding-left: 0px;padding-right: 0px;margin-top: 0px !important;margin-bottom: 0px !important;margin-left: 0px;margin-right: 0px;overflow: visible;border-color: inherit;row-gap: 0px;column-gap: 0px;}@media only screen and (max-width: 976px) {.wp-block-uagb-container.uagb-is-root-container .uagb-block-debf2792{width: 100%;}.wp-block-uagb-container.uagb-is-root-container.alignfull.uagb-block-debf2792 > .uagb-container-inner-blocks-wrap{--inner-content-custom-width: min( 100%, 1024px);max-width: var(--inner-content-custom-width);width: 100%;}.wp-block-uagb-container.uagb-block-debf2792{padding-top: 0px;padding-bottom: 0px;padding-left: 0px;padding-right: 0px;margin-top: 0px !important;margin-bottom: 0px !important;margin-left: 0px;margin-right: 0px;}}@media only screen and (max-width: 767px) {.wp-block-uagb-container.uagb-is-root-container .uagb-block-debf2792{max-width: 100%;width: 100%;}.wp-block-uagb-container.uagb-is-root-container.alignfull.uagb-block-debf2792 > .uagb-container-inner-blocks-wrap{--inner-content-custom-width: min( 100%, 767px);max-width: var(--inner-content-custom-width);width: 100%;flex-wrap: wrap;}.wp-block-uagb-container.uagb-block-debf2792{padding-top: 0px;padding-bottom: 0px;padding-left: 0px;padding-right: 0px;margin-top: 0px !important;margin-bottom: 0px !important;margin-left: 0px;margin-right: 0px;}}\";s:2:\"js\";s:0:\"\";s:18:\"current_block_list\";a:5:{i:0;s:14:\"core\/paragraph\";i:1;s:9:\"core\/list\";i:2;s:10:\"core\/image\";i:3;s:14:\"uagb\/container\";i:4;s:14:\"core\/shortcode\";}s:8:\"uag_flag\";b:1;s:11:\"uag_version\";s:10:\"1776549770\";s:6:\"gfonts\";a:0:{}s:10:\"gfonts_url\";s:0:\"\";s:12:\"gfonts_files\";a:0:{}s:14:\"uag_faq_layout\";b:0;}"]},"uagb_featured_image_src":{"full":false,"thumbnail":false,"medium":false,"medium_large":false,"large":false,"1536x1536":false,"2048x2048":false,"trp-custom-language-flag":false},"uagb_author_info":{"display_name":"Anjali","author_link":"https:\/\/git-staging.wpastra.com\/es\/author\/anjalic\/"},"uagb_comment_info":0,"uagb_excerpt":"Astra with version 2.1.0 offers an option of CSS file generation. In this article, you will see how these CSS files are named. The new naming convention is really simple, so you don\u2019t get confused when looking at these files. The CSS file is named based on the post(s) or page(s) on your website. The&hellip;","_links":{"self":[{"href":"https:\/\/git-staging.wpastra.com\/es\/wp-json\/wp\/v2\/docs\/44460"}],"collection":[{"href":"https:\/\/git-staging.wpastra.com\/es\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/git-staging.wpastra.com\/es\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/git-staging.wpastra.com\/es\/wp-json\/wp\/v2\/users\/20"}],"replies":[{"embeddable":true,"href":"https:\/\/git-staging.wpastra.com\/es\/wp-json\/wp\/v2\/comments?post=44460"}],"version-history":[{"count":0,"href":"https:\/\/git-staging.wpastra.com\/es\/wp-json\/wp\/v2\/docs\/44460\/revisions"}],"wp:attachment":[{"href":"https:\/\/git-staging.wpastra.com\/es\/wp-json\/wp\/v2\/media?parent=44460"}],"wp:term":[{"taxonomy":"docs_category","embeddable":true,"href":"https:\/\/git-staging.wpastra.com\/es\/wp-json\/wp\/v2\/docs_category?post=44460"},{"taxonomy":"docs_tag","embeddable":true,"href":"https:\/\/git-staging.wpastra.com\/es\/wp-json\/wp\/v2\/docs_tag?post=44460"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}