{"id":16690,"date":"2018-09-18T15:04:49","date_gmt":"2018-09-18T13:04:49","guid":{"rendered":"https:\/\/belvg.com\/blog\/?p=16690"},"modified":"2025-02-10T17:40:17","modified_gmt":"2025-02-10T15:40:17","slug":"configuring-site-design-in-magento-2-admin-panel","status":"publish","type":"post","link":"https:\/\/belvg.com\/blog\/configuring-site-design-in-magento-2-admin-panel.html","title":{"rendered":"Configuring Site Design in Magento 2 Admin Panel"},"content":{"rendered":"\n<p>Magento 2 offers a variety of tools for configuring site design. These tools let you customize the header and footer sections, add a favicon, customize transactional emails, product image watermarks and some other components of your webstore. Let&rsquo;s take a closer look at the design customization tools found under&nbsp;<strong>Content &gt; Design &gt; Configuration <\/strong>on Magento 2 Admin panel.<\/p>\n<p><!--more--><\/p>\n<p><span style=\"text-decoration: underline;\"><span style=\"color: #ff0000; text-decoration: underline;\"><a style=\"color: #ff0000; text-decoration: underline;\" href=\"#step_1\"><strong>How&nbsp;the configuration settings affect theme rendering in Magento 2<\/strong><\/a><\/span><\/span><\/p>\n<ul>\n<li><span style=\"text-decoration: underline;\"><span style=\"color: #ff0000; text-decoration: underline;\"><a style=\"color: #ff0000; text-decoration: underline;\" href=\"#step_2\"><strong>HTML head<\/strong><\/a><\/span><\/span><\/li>\n<li><span style=\"text-decoration: underline;\"><span style=\"color: #ff0000; text-decoration: underline;\"><a style=\"color: #ff0000; text-decoration: underline;\" href=\"#step_3\"><strong>Header settings<\/strong><\/a><\/span><\/span><\/li>\n<li><span style=\"text-decoration: underline;\"><span style=\"color: #ff0000; text-decoration: underline;\"><a style=\"color: #ff0000; text-decoration: underline;\" href=\"#step_4\"><strong>Footer settings<\/strong><\/a><\/span><\/span><\/li>\n<li><span style=\"text-decoration: underline;\"><span style=\"color: #ff0000; text-decoration: underline;\"><a style=\"color: #ff0000; text-decoration: underline;\" href=\"#step_5\"><strong>Search engine robots settings<\/strong><\/a><\/span><\/span><\/li>\n<li><span style=\"text-decoration: underline;\"><span style=\"color: #ff0000; text-decoration: underline;\"><a style=\"color: #ff0000; text-decoration: underline;\" href=\"#step_6\"><strong>Pagination settings<\/strong><\/a><\/span><\/span><\/li>\n<li><span style=\"text-decoration: underline;\"><span style=\"color: #ff0000; text-decoration: underline;\"><a style=\"color: #ff0000; text-decoration: underline;\" href=\"#step_7\"><strong>Product image watermarks<\/strong><\/a><\/span><\/span><\/li>\n<li><span style=\"text-decoration: underline;\"><span style=\"color: #ff0000; text-decoration: underline;\"><a style=\"color: #ff0000; text-decoration: underline;\" href=\"#step_8\"><strong>Transactional emails<\/strong><\/a><\/span><\/span><\/li>\n<\/ul>\n<p><span style=\"text-decoration: underline;\"><span style=\"color: #ff0000; text-decoration: underline;\"><a style=\"color: #ff0000; text-decoration: underline;\" href=\"#step_9\"><strong>What happens when a theme is added or removed<br>\n<\/strong><\/a><a style=\"color: #ff0000; text-decoration: underline;\" href=\"#step_10\"><strong>Common mistakes made in regard to these settings<\/strong><\/a><\/span><\/span><\/p>\n<h2><a id=\"step_1\"><\/a><span style=\"color: #000000;\"><strong>How&nbsp;the configuration settings affect theme rendering in Magento 2&nbsp;<\/strong><\/span><\/h2>\n<p>First, let&rsquo;s open the theme settings at <strong>Content &gt; Design &gt; Configuration<\/strong>.<\/p>\n<p>Next, choose the necessary store. Here is what you will see on the page:<\/p>\n<p><a href=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/09\/image71.png\"><img decoding=\"async\" loading=\"lazy\" class=\"lazy aligncenter size-full wp-image-16691\" src=\"https:\/\/belvg.com\/wp-content\/uploads\/2019\/06\/pixel.png\" data-src=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/09\/image71.png\" alt=\"Configuring site design using options found under Content &gt; Design &gt; Configuration\" width=\"1234\" height=\"518\" title=\"Configuring Site Design in Magento 2 Admin Panel\"><\/a><\/p>\n<p>The current theme is applied by default, you can change it to any of the installed ones.<\/p>\n<p>Click &ldquo;save&rdquo;, clean the cache, and a new theme&nbsp;will be displayed for the selected store.<\/p>\n<p>The next field of the menu are the user agent rules. Here you can set a theme for the necessary user agent. For example, let&rsquo;s apply a special theme with an animated favicon and css-grid for the Firefox browser:<\/p>\n<ul>\n<li>create a rule for the user agent;<\/li>\n<li>write <strong>\/^mozilla\/i<\/strong> for its definition;<\/li>\n<li>choose a special theme;<\/li>\n<li>save and clean the cache.<\/li>\n<\/ul>\n<p>Now the users with a Firefox browser will have their own theme.<\/p>\n<p><a href=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/09\/image41.png\"><img decoding=\"async\" loading=\"lazy\" class=\"lazy aligncenter size-full wp-image-16698\" src=\"https:\/\/belvg.com\/wp-content\/uploads\/2019\/06\/pixel.png\" data-src=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/09\/image41.png\" alt=\"Configuring the Design System under Content &gt; Design &gt; Configuration in Magento 2 Admin Panel\" width=\"1792\" height=\"561\" title=\"Configuring Site Design in Magento 2 Admin Panel\"><\/a><\/p>\n<p>Let&rsquo;s take a quick look at each of the fields under the HTML head section.<\/p>\n<p><a href=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/09\/image81.png\"><img decoding=\"async\" loading=\"lazy\" class=\"lazy aligncenter size-full wp-image-16699\" src=\"https:\/\/belvg.com\/wp-content\/uploads\/2019\/06\/pixel.png\" data-src=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/09\/image81.png\" alt=\"Configuring the Design System under Content &gt; Design &gt; Configuration in Magento 2 Admin Panel\" width=\"1544\" height=\"805\" title=\"Configuring Site Design in Magento 2 Admin Panel\"><\/a><\/p>\n<div class=\"module_in_content_container\"><a href=\"https:\/\/belvg.com\/magento-integration\" class=\"link_to_module\" target=\"_blank\" rel=\"noopener\"><\/a><div class=\"module_content\"><div class=\"module_content_part\"><h3 class=\"title\">Magento Integration<\/h3><p class=\"module_content_text\">Take your online store to the next level with BelVG Magento Integration<\/p><a href=\"https:\/\/belvg.com\/magento-integration\" class=\"link_2_to_module\" target=\"_blank\" style=\"display:inline-block\" rel=\"noopener\"><span class=\"read-more\">Visit the page<\/span><\/a><\/div><\/div><\/div>\n<h4><a id=\"step_2\"><\/a><strong><span style=\"color: #000000;\">HTML head<\/span><\/strong><\/h4>\n<ul>\n<li><strong>Favicon<\/strong> is an icon for quick identification of a site on a browser tab and in bookmarks. The supported formats are ICO, PNG, APNG, GIF, and JPG (JPEG). Not all browsers support all these types of favicons, so read the specification carefully!<\/li>\n<li><strong>Default page title<\/strong>, displayed on a browser tab is used for a variety of purposes, including SEO. A default title is applied to all pages of a webstore (which is not good) if no header is specified for each particular page.<\/li>\n<li><strong>Header prefix<\/strong>. It is used for 2 and 3-fragment headings. It is separated from the main header by a vertical dash or hyphen. It&rsquo;s also applied on all pages unless otherwise specified for a particular page.<\/li>\n<li><strong>Header suffix<\/strong>. It&rsquo;s similar to the prefix but goes after the main header.<\/li>\n<li><strong>Meta description<\/strong>. It&rsquo;s used for SEO of the site, carries a brief information about the visited page and cannot be longer than 160 characters. Similar to headings, it&rsquo;s applied to all pages unless otherwise specified for a particular page.<\/li>\n<li><strong>Meta keywords<\/strong>. A list of comma-separated tags for SEO of a page. Now it is considered to be obsolete, Google abandoned it a long time ago. Yandex keeps using it, but I don&rsquo;t see the point in it anymore.<\/li>\n<li><strong>Scripts and style sheets<\/strong>. Additional styles and scripts that will be placed before the closing <strong>&lt;\/head&gt;<\/strong> tag.<\/li>\n<li><strong>Display demo store notice<\/strong>. Enables\/disables the demo store message.<\/li>\n<\/ul>\n<p>Next come the settings for head, header, footer, search engine robots, pagination, product image watermarks and&nbsp;transactional emails. Let&rsquo;s consider them in more detail.<\/p>\n<h4><a id=\"step_3\"><\/a><strong><span style=\"color: #000000;\">Header settings<\/span><\/strong><\/h4>\n<p><a href=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/09\/image31.png\"><img decoding=\"async\" loading=\"lazy\" class=\"lazy aligncenter size-full wp-image-16700\" src=\"https:\/\/belvg.com\/wp-content\/uploads\/2019\/06\/pixel.png\" data-src=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/09\/image31.png\" alt=\"Configuring the Design System under Content &gt; Design &gt; Configuration in Magento 2 Admin Panel\" width=\"1440\" height=\"411\" title=\"Configuring Site Design in Magento 2 Admin Panel\"><\/a><\/p>\n<ul>\n<li>Logo image. The supported file types are PNG, GIF, JPG (JPEG).<\/li>\n<li>Logo attribute width in pixels.<\/li>\n<li>Logo attribute height in pixels.<\/li>\n<li>Welcome text, which also contains the name of a logged-in user.<\/li>\n<li>Logo image alt. Alt text for the logo.<\/li>\n<\/ul>\n<h4><a id=\"step_4\"><\/a><strong><span style=\"color: #000000;\">Footer settings<\/span><\/strong><\/h4>\n<p><a href=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/09\/image13.png\"><img decoding=\"async\" loading=\"lazy\" class=\"lazy aligncenter size-full wp-image-16701\" src=\"https:\/\/belvg.com\/wp-content\/uploads\/2019\/06\/pixel.png\" data-src=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/09\/image13.png\" alt=\"Configuring the Design System under Content &gt; Design &gt; Configuration in Magento 2 Admin Panel\" width=\"1446\" height=\"352\" title=\"Configuring Site Design in Magento 2 Admin Panel\"><\/a><\/p>\n<ul>\n<li>A field for scripts that run before the closing <strong>&lt;\/body&gt;<\/strong> tag.<\/li>\n<li>Copyright. Supports &amp;copy for the &ldquo;&copy;&rdquo; symbol.<\/li>\n<\/ul>\n<h4><a id=\"step_5\"><\/a><strong><span style=\"color: #000000;\">Search engine robots settings<\/span><\/strong><\/h4>\n<p><a href=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/09\/image91.png\"><img decoding=\"async\" loading=\"lazy\" class=\"lazy aligncenter size-full wp-image-16702\" src=\"https:\/\/belvg.com\/wp-content\/uploads\/2019\/06\/pixel.png\" data-src=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/09\/image91.png\" alt=\"Configuring the Design System under Content &gt; Design &gt; Configuration in Magento 2 Admin Panel\" width=\"1337\" height=\"363\" title=\"Configuring Site Design in Magento 2 Admin Panel\"><\/a><\/p>\n<p>Here it is written how robots should behave in terms of indexing and returning to the site on schedule and upon editing, as well as special rules, such as banning certain directories that should not be indexed.<\/p>\n<div class=\"module_in_content_container\"><a href=\"https:\/\/belvg.com\/magento-webdesign\" class=\"link_to_module\" target=\"_blank\" rel=\"noopener\"><\/a><div class=\"module_content\"><img src=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2019\/01\/magento-webdesign-1.png\" width=\"100\" height=\"100\" alt=\"magento webdesign\" class=\"module_image\" title=\"Configuring Site Design in Magento 2 Admin Panel\"><div class=\"module_content_part\"><h3 class=\"title\">Magento Webdesign<\/h3><p class=\"module_content_text\">Take your online store to the next level with BelVG Magento Webdesign<\/p><a href=\"https:\/\/belvg.com\/magento-webdesign\" class=\"link_2_to_module\" target=\"_blank\" style=\"display:inline-block\" rel=\"noopener\"><span class=\"read-more\">Visit the page<\/span><\/a><\/div><\/div><\/div>\n<h4><a id=\"step_6\"><\/a><strong><span style=\"color: #000000;\">Pagination settings<\/span><\/strong><\/h4>\n<p><a href=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/09\/image61.png\"><img decoding=\"async\" loading=\"lazy\" class=\"lazy aligncenter size-full wp-image-16703\" src=\"https:\/\/belvg.com\/wp-content\/uploads\/2019\/06\/pixel.png\" data-src=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/09\/image61.png\" alt=\"Configuring the Design System under Content &gt; Design &gt; Configuration in Magento 2 Admin Panel\" width=\"1341\" height=\"448\" title=\"Configuring Site Design in Magento 2 Admin Panel\"><\/a><\/p>\n<p>Here you can specify:<\/p>\n<ul>\n<li>The number of links to next pages<\/li>\n<li>The number of links that will be skipped. If you need to skip the list of 5 links, and the step is set to 4, then the last link of the skip will be the first link on the new list.<\/li>\n<li>The text for the forward and back buttons, arrows are shown by default.<\/li>\n<\/ul>\n<h4><a id=\"step_7\"><\/a><strong><span style=\"color: #000000;\">Product image watermarks<\/span><\/strong><\/h4>\n<p><a href=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/09\/image21.png\"><img decoding=\"async\" loading=\"lazy\" class=\"lazy aligncenter size-full wp-image-16704\" src=\"https:\/\/belvg.com\/wp-content\/uploads\/2019\/06\/pixel.png\" data-src=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/09\/image21.png\" alt=\"Configuring the Design System under Content &gt; Design &gt; Configuration in Magento 2 Admin Panel\" width=\"1351\" height=\"881\" title=\"Configuring Site Design in Magento 2 Admin Panel\"><\/a><\/p>\n<div class=\"content_sales_info\" style=\"background-image: url(https:\/\/belvg.com\/blog\/wp-content\/uploads\/2019\/03\/Sales_background.png\"><img width=\"65\" height=\"65\" src=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2019\/03\/Igor-Dragun1.png\" alt=\"Igor Dragun\" title=\"Configuring Site Design in Magento 2 Admin Panel\"><div class=\"content_part\"><h3 class=\"title\">Partner With Us <\/h3><span class=\"sales_content_text\">Let's discuss how to grow your business. Get a Free Quote.<\/span><\/div> <a class=\"call-to-action\" href=\"https:\/\/belvg.com\/contact?utm_source=blog&amp;utm_campaign=sales_block&amp;utm_content=middle\" target=\"_blank\" rel=\"noopener\">Talk to Igor<\/a><\/div>\n<p>Here you can set the watermark parameters for the main image sizes:<\/p>\n<ul>\n<li>Image (in jpeg, gif, png);<\/li>\n<li>Image opacity in %;<\/li>\n<li>Image size in pixels;<\/li>\n<li>Image position. The position of the watermark on an image.<\/li>\n<\/ul>\n<h4><a id=\"step_8\"><\/a><strong><span style=\"color: #000000;\">Transactional emails<\/span><\/strong><\/h4>\n<p><a href=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/09\/image51.png\"><img decoding=\"async\" loading=\"lazy\" class=\"lazy aligncenter size-full wp-image-16705\" src=\"https:\/\/belvg.com\/wp-content\/uploads\/2019\/06\/pixel.png\" data-src=\"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/09\/image51.png\" alt=\"Configuring the Design System under Content &gt; Design &gt; Configuration in Magento 2 Admin Panel\" width=\"1434\" height=\"647\" title=\"Configuring Site Design in Magento 2 Admin Panel\"><\/a><\/p>\n<p>Here you can set:<\/p>\n<ul>\n<li>Logo image (in jpg, jpeg, gif, png);<\/li>\n<li>Logo image alt;<\/li>\n<li>Logo width and logo height in pixels;<\/li>\n<li>Header and footer templates.<\/li>\n<\/ul>\n<h2><a id=\"step_9\"><\/a><strong><span style=\"color: #000000;\">What happens when a theme is added or removed<\/span><\/strong><\/h2>\n<p>You can install a theme manually as a component and using a composer. If the theme appeared on the list of the available themes after installing and restarting the admin panel, then the process was completed successfully and you can use it.<\/p>\n<p>The process of deleting a theme differs depending on the method of its installation:<\/p>\n<ul>\n<li>Before deleting, you need to switch the site to the developer mode and make sure that the theme inactive as a parent or a child.<\/li>\n<li>If the theme was installed manually &mdash; just delete the theme files and all its data from the database.<\/li>\n<li>If the theme was installed using a composer &mdash; we delete it with a CLI command, for example: <em>&ldquo;magento theme:uninstall &ndash;backup-code frontend\/BrandName\/default&rdquo;.<\/em><\/li>\n<li>If the theme was installed via a repository, the process remains almost the same, but before that, we need to delete the dependencies from the compiler file.<\/li>\n<li>If the theme was installed as a component, we delete it in the admin panel via &ldquo;uninstall&ldquo; in the list of the installed components.<\/li>\n<\/ul>\n<h2><a id=\"step_10\"><\/a><strong><span style=\"color: #000000;\">Common mistakes made in regard to these settings<\/span><\/strong><\/h2>\n<p>Let&rsquo;s take a look at the most common mistakes:<\/p>\n<ul>\n<li>Changes will not be displayed if you don&rsquo;t clean the cache\/deploy static content.<\/li>\n<li>Uploading an unsupported file type for the logo.<\/li>\n<li>Deleting a theme in a wrong way (manually deleting a theme, that was installed through the composer, etc.).<\/li>\n<li>Using the same meta description and title on all pages of a webstore.<\/li>\n<li>If the rights to read\/write are incorrect, the graphics files may not load.<\/li>\n<\/ul>\n<p>Thank you for your attention, I hope everything was clear and you won&rsquo;t have any problem while using these tools for your webstore customization.<\/p>\n<div class=\"module_in_content_container\"><a href=\"https:\/\/belvg.com\/magento-development\" class=\"link_to_module\" target=\"_blank\" rel=\"noopener\"><\/a><div class=\"module_content\"><div class=\"module_content_part\"><h3 class=\"title\">Magento Development Services<\/h3><p class=\"module_content_text\">Take your online store to the next level with BelVG Magento development<\/p><a href=\"https:\/\/belvg.com\/magento-development\" class=\"link_2_to_module\" target=\"_blank\" style=\"display:inline-block\" rel=\"noopener\"><span class=\"read-more\">Visit the page<\/span><\/a><\/div><\/div><\/div>\n\n","protected":false},"excerpt":{"rendered":"Magento 2 offers a variety of tools for configuring site design. These tools let you &#8230;","protected":false},"author":22,"featured_media":16696,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"image","meta":{"_acf_changed":false,"footnotes":""},"categories":[550,551,552,474,491,389,526,548,547,553,549],"tags":[],"class_list":["post-16690","post","type-post","status-publish","format-image","has-post-thumbnail","hentry","category-conversion-web-design","category-web-design-audit","category-web-design-process","category-ecommerce","category-magento-2","category-magento2-development","category-magento-theme","category-responsive-web-design","category-web-design","category-web-design-from-scratch","category-website-redesign","post_format-post-format-image"],"acf":[],"aioseo_notices":[],"aioseo_head":"\n\t\t<!-- All in One SEO 5.0.4 - aioseo.com -->\n\t<meta name=\"description\" content=\"Configure site design using the options in Magento 2 Admin Panel under Content &gt; Design &gt; Configuration. Common mistakes made while adding or removing a theme.\" \/>\n\t<meta name=\"robots\" content=\"max-image-preview:large\" \/>\n\t<meta name=\"author\" content=\"Mikhail Soiko\"\/>\n\t<link rel=\"canonical\" href=\"https:\/\/belvg.com\/blog\/configuring-site-design-in-magento-2-admin-panel.html\" \/>\n\t\t<meta name=\"generator\" content=\"All in One SEO (AIOSEO) 5.0.4\" \/>\n\t\t<script type=\"application\/ld+json\" class=\"aioseo-schema\">\n\t\t\t{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/configuring-site-design-in-magento-2-admin-panel.html#article\",\"name\":\"How to configure site design in Magento 2 admin | BelVG Blog\",\"headline\":\"Configuring Site Design in Magento 2 Admin Panel\",\"author\":{\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/author\\\/mishell-soiko#author\"},\"publisher\":{\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/#organization\"},\"image\":{\"@type\":\"ImageObject\",\"url\":\"https:\\\/\\\/belvg.com\\\/blog\\\/wp-content\\\/uploads\\\/2018\\\/09\\\/Configuring-Site-Design-in-Magento-2-Admin-Panel.jpg\",\"width\":1110,\"height\":590,\"caption\":\"Configuring Site Design in Magento 2 Admin Panel\"},\"datePublished\":\"2018-09-18T15:04:49+02:00\",\"dateModified\":\"2025-02-10T17:40:17+02:00\",\"inLanguage\":\"en-US\",\"commentCount\":2,\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/configuring-site-design-in-magento-2-admin-panel.html#webpage\"},\"isPartOf\":{\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/configuring-site-design-in-magento-2-admin-panel.html#webpage\"},\"articleSection\":\"Conversion Design, Design Audit, Design Process, ECOMMERCE, Magento 2, Magento 2 Development, Magento Theme, Responsive Web Design, Web Design, Web Design from Scratch, Website Redesign, Image\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/configuring-site-design-in-magento-2-admin-panel.html#breadcrumblist\",\"itemListElement\":[{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/#listItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/belvg.com\\\/blog\\\/\",\"nextItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/category\\\/magento2-development#listItem\",\"name\":\"Magento 2 Development\"}},{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/category\\\/magento2-development#listItem\",\"position\":2,\"name\":\"Magento 2 Development\",\"item\":\"https:\\\/\\\/belvg.com\\\/blog\\\/category\\\/magento2-development\",\"nextItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/configuring-site-design-in-magento-2-admin-panel.html#listItem\",\"name\":\"Configuring Site Design in Magento 2 Admin Panel\"},\"previousItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/#listItem\",\"name\":\"Home\"}},{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/configuring-site-design-in-magento-2-admin-panel.html#listItem\",\"position\":3,\"name\":\"Configuring Site Design in Magento 2 Admin Panel\",\"previousItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/category\\\/magento2-development#listItem\",\"name\":\"Magento 2 Development\"}}]},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/#organization\",\"name\":\"BelVG Blog\",\"description\":\"Magento and Prestashop articles\",\"url\":\"https:\\\/\\\/belvg.com\\\/blog\\\/\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/author\\\/mishell-soiko#author\",\"url\":\"https:\\\/\\\/belvg.com\\\/blog\\\/author\\\/mishell-soiko\",\"name\":\"Mikhail Soiko\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/configuring-site-design-in-magento-2-admin-panel.html#authorImage\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/1603d45135617d53877de2d9ffe112a497830fa8a92f16dd13b43069b1e53482?s=96&d=mm&r=g\",\"width\":96,\"height\":96,\"caption\":\"Mikhail Soiko\"}},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/configuring-site-design-in-magento-2-admin-panel.html#webpage\",\"url\":\"https:\\\/\\\/belvg.com\\\/blog\\\/configuring-site-design-in-magento-2-admin-panel.html\",\"name\":\"How to configure site design in Magento 2 admin | BelVG Blog\",\"description\":\"Configure site design using the options in Magento 2 Admin Panel under Content > Design > Configuration. Common mistakes made while adding or removing a theme.\",\"inLanguage\":\"en-US\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/#website\"},\"breadcrumb\":{\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/configuring-site-design-in-magento-2-admin-panel.html#breadcrumblist\"},\"author\":{\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/author\\\/mishell-soiko#author\"},\"creator\":{\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/author\\\/mishell-soiko#author\"},\"image\":{\"@type\":\"ImageObject\",\"url\":\"https:\\\/\\\/belvg.com\\\/blog\\\/wp-content\\\/uploads\\\/2018\\\/09\\\/Configuring-Site-Design-in-Magento-2-Admin-Panel.jpg\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/configuring-site-design-in-magento-2-admin-panel.html\\\/#mainImage\",\"width\":1110,\"height\":590,\"caption\":\"Configuring Site Design in Magento 2 Admin Panel\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/configuring-site-design-in-magento-2-admin-panel.html#mainImage\"},\"datePublished\":\"2018-09-18T15:04:49+02:00\",\"dateModified\":\"2025-02-10T17:40:17+02:00\"},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/belvg.com\\\/blog\\\/\",\"name\":\"BelVG Blog\",\"description\":\"Magento and Prestashop articles\",\"inLanguage\":\"en-US\",\"publisher\":{\"@id\":\"https:\\\/\\\/belvg.com\\\/blog\\\/#organization\"}}]}\n\t\t<\/script>\n\t\t<!-- All in One SEO -->\n\n","aioseo_head_json":{"title":"How to configure site design in Magento 2 admin | BelVG Blog","description":"Configure site design using the options in Magento 2 Admin Panel under Content > Design > Configuration. Common mistakes made while adding or removing a theme.","canonical_url":"https:\/\/belvg.com\/blog\/configuring-site-design-in-magento-2-admin-panel.html","robots":"max-image-preview:large","keywords":"","webmasterTools":{"miscellaneous":""},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/belvg.com\/blog\/configuring-site-design-in-magento-2-admin-panel.html#article","name":"How to configure site design in Magento 2 admin | BelVG Blog","headline":"Configuring Site Design in Magento 2 Admin Panel","author":{"@id":"https:\/\/belvg.com\/blog\/author\/mishell-soiko#author"},"publisher":{"@id":"https:\/\/belvg.com\/blog\/#organization"},"image":{"@type":"ImageObject","url":"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/09\/Configuring-Site-Design-in-Magento-2-Admin-Panel.jpg","width":1110,"height":590,"caption":"Configuring Site Design in Magento 2 Admin Panel"},"datePublished":"2018-09-18T15:04:49+02:00","dateModified":"2025-02-10T17:40:17+02:00","inLanguage":"en-US","commentCount":2,"mainEntityOfPage":{"@id":"https:\/\/belvg.com\/blog\/configuring-site-design-in-magento-2-admin-panel.html#webpage"},"isPartOf":{"@id":"https:\/\/belvg.com\/blog\/configuring-site-design-in-magento-2-admin-panel.html#webpage"},"articleSection":"Conversion Design, Design Audit, Design Process, ECOMMERCE, Magento 2, Magento 2 Development, Magento Theme, Responsive Web Design, Web Design, Web Design from Scratch, Website Redesign, Image"},{"@type":"BreadcrumbList","@id":"https:\/\/belvg.com\/blog\/configuring-site-design-in-magento-2-admin-panel.html#breadcrumblist","itemListElement":[{"@type":"ListItem","@id":"https:\/\/belvg.com\/blog\/#listItem","position":1,"name":"Home","item":"https:\/\/belvg.com\/blog\/","nextItem":{"@type":"ListItem","@id":"https:\/\/belvg.com\/blog\/category\/magento2-development#listItem","name":"Magento 2 Development"}},{"@type":"ListItem","@id":"https:\/\/belvg.com\/blog\/category\/magento2-development#listItem","position":2,"name":"Magento 2 Development","item":"https:\/\/belvg.com\/blog\/category\/magento2-development","nextItem":{"@type":"ListItem","@id":"https:\/\/belvg.com\/blog\/configuring-site-design-in-magento-2-admin-panel.html#listItem","name":"Configuring Site Design in Magento 2 Admin Panel"},"previousItem":{"@type":"ListItem","@id":"https:\/\/belvg.com\/blog\/#listItem","name":"Home"}},{"@type":"ListItem","@id":"https:\/\/belvg.com\/blog\/configuring-site-design-in-magento-2-admin-panel.html#listItem","position":3,"name":"Configuring Site Design in Magento 2 Admin Panel","previousItem":{"@type":"ListItem","@id":"https:\/\/belvg.com\/blog\/category\/magento2-development#listItem","name":"Magento 2 Development"}}]},{"@type":"Organization","@id":"https:\/\/belvg.com\/blog\/#organization","name":"BelVG Blog","description":"Magento and Prestashop articles","url":"https:\/\/belvg.com\/blog\/"},{"@type":"Person","@id":"https:\/\/belvg.com\/blog\/author\/mishell-soiko#author","url":"https:\/\/belvg.com\/blog\/author\/mishell-soiko","name":"Mikhail Soiko","image":{"@type":"ImageObject","@id":"https:\/\/belvg.com\/blog\/configuring-site-design-in-magento-2-admin-panel.html#authorImage","url":"https:\/\/secure.gravatar.com\/avatar\/1603d45135617d53877de2d9ffe112a497830fa8a92f16dd13b43069b1e53482?s=96&d=mm&r=g","width":96,"height":96,"caption":"Mikhail Soiko"}},{"@type":"WebPage","@id":"https:\/\/belvg.com\/blog\/configuring-site-design-in-magento-2-admin-panel.html#webpage","url":"https:\/\/belvg.com\/blog\/configuring-site-design-in-magento-2-admin-panel.html","name":"How to configure site design in Magento 2 admin | BelVG Blog","description":"Configure site design using the options in Magento 2 Admin Panel under Content > Design > Configuration. Common mistakes made while adding or removing a theme.","inLanguage":"en-US","isPartOf":{"@id":"https:\/\/belvg.com\/blog\/#website"},"breadcrumb":{"@id":"https:\/\/belvg.com\/blog\/configuring-site-design-in-magento-2-admin-panel.html#breadcrumblist"},"author":{"@id":"https:\/\/belvg.com\/blog\/author\/mishell-soiko#author"},"creator":{"@id":"https:\/\/belvg.com\/blog\/author\/mishell-soiko#author"},"image":{"@type":"ImageObject","url":"https:\/\/belvg.com\/blog\/wp-content\/uploads\/2018\/09\/Configuring-Site-Design-in-Magento-2-Admin-Panel.jpg","@id":"https:\/\/belvg.com\/blog\/configuring-site-design-in-magento-2-admin-panel.html\/#mainImage","width":1110,"height":590,"caption":"Configuring Site Design in Magento 2 Admin Panel"},"primaryImageOfPage":{"@id":"https:\/\/belvg.com\/blog\/configuring-site-design-in-magento-2-admin-panel.html#mainImage"},"datePublished":"2018-09-18T15:04:49+02:00","dateModified":"2025-02-10T17:40:17+02:00"},{"@type":"WebSite","@id":"https:\/\/belvg.com\/blog\/#website","url":"https:\/\/belvg.com\/blog\/","name":"BelVG Blog","description":"Magento and Prestashop articles","inLanguage":"en-US","publisher":{"@id":"https:\/\/belvg.com\/blog\/#organization"}}]}},"aioseo_meta_data":{"post_id":"16690","title":"How to configure site design in Magento 2 admin | #site_title","description":"Configure site design using the options in Magento 2 Admin Panel under Content &gt; Design &gt; Configuration. Common mistakes made while adding or removing a theme.","keywords":null,"keyphrases":null,"focus_keyword":null,"additional_keywords":null,"truseo_locale":null,"primary_term":null,"canonical_url":null,"og_title":null,"og_description":null,"og_object_type":"default","og_image_type":"default","og_image_custom_url":null,"og_image_custom_fields":null,"og_image_url":null,"og_image_width":null,"og_image_height":null,"og_video":null,"og_custom_url":null,"og_article_section":null,"og_article_tags":null,"twitter_use_og":false,"twitter_card":"default","twitter_image_type":"default","twitter_image_custom_url":null,"twitter_image_custom_fields":null,"twitter_image_url":null,"twitter_title":null,"twitter_description":null,"schema_type":"default","schema_type_options":null,"schema":{"blockGraphs":[],"customGraphs":[],"default":{"data":{"Article":[],"Course":[],"Dataset":[],"FAQPage":[],"Movie":[],"Person":[],"Product":[],"ProductReview":[],"Car":[],"Recipe":[],"Service":[],"SoftwareApplication":[],"WebPage":[]},"graphName":"","isEnabled":true},"graphs":[]},"pillar_content":false,"robots_default":true,"robots_noindex":false,"robots_noarchive":false,"robots_nosnippet":false,"robots_nofollow":false,"robots_noimageindex":false,"robots_noodp":false,"robots_notranslate":false,"robots_max_snippet":null,"robots_max_videopreview":null,"robots_max_imagepreview":"large","priority":null,"frequency":null,"local_seo":null,"limit_modified_date":false,"ai":null,"breadcrumb_settings":null,"seo_analyzer_scan_date":null,"created":"2026-11-03 18:37:04","updated":"2026-11-03 18:37:04"},"aioseo_breadcrumb":"<div class=\"aioseo-breadcrumbs\"><span class=\"aioseo-breadcrumb\">\n\t\t\t<a href=\"https:\/\/belvg.com\/blog\/\" title=\"Home\">Home<\/a>\n\t\t<\/span><span class=\"aioseo-breadcrumb-separator\">\u00bb<\/span><span class=\"aioseo-breadcrumb\">\n\t\t\t<a href=\"https:\/\/belvg.com\/blog\/category\/magento2-development\" title=\"Magento 2 Development\">Magento 2 Development<\/a>\n\t\t<\/span><span class=\"aioseo-breadcrumb-separator\">\u00bb<\/span><span class=\"aioseo-breadcrumb\">\n\t\t\tConfiguring Site Design in Magento 2 Admin Panel\n\t\t<\/span><\/div>","aioseo_breadcrumb_json":[{"label":"Home","link":"https:\/\/belvg.com\/blog\/"},{"label":"Magento 2 Development","link":"https:\/\/belvg.com\/blog\/category\/magento2-development"},{"label":"Configuring Site Design in Magento 2 Admin Panel","link":"https:\/\/belvg.com\/blog\/configuring-site-design-in-magento-2-admin-panel.html"}],"post_mailing_queue_ids":[],"_links":{"self":[{"href":"https:\/\/belvg.com\/blog\/wp-json\/wp\/v2\/posts\/16690","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/belvg.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/belvg.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/belvg.com\/blog\/wp-json\/wp\/v2\/users\/22"}],"replies":[{"embeddable":true,"href":"https:\/\/belvg.com\/blog\/wp-json\/wp\/v2\/comments?post=16690"}],"version-history":[{"count":0,"href":"https:\/\/belvg.com\/blog\/wp-json\/wp\/v2\/posts\/16690\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/belvg.com\/blog\/wp-json\/wp\/v2\/media\/16696"}],"wp:attachment":[{"href":"https:\/\/belvg.com\/blog\/wp-json\/wp\/v2\/media?parent=16690"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/belvg.com\/blog\/wp-json\/wp\/v2\/categories?post=16690"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/belvg.com\/blog\/wp-json\/wp\/v2\/tags?post=16690"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}