{"id":28580,"date":"2021-08-21T15:00:21","date_gmt":"2021-08-21T13:00:21","guid":{"rendered":"https:\/\/qodeinteractive.com\/magazine\/?p=28580"},"modified":"2021-08-20T14:10:47","modified_gmt":"2021-08-20T12:10:47","slug":"ultimate-guide-to-wordpress-theme-customizer","status":"publish","type":"post","link":"https:\/\/qodeinteractive.com\/magazine\/ultimate-guide-to-wordpress-theme-customizer\/","title":{"rendered":"The Ultimate Guide to the WordPress Theme Customizer"},"content":{"rendered":"<div class=\"wpb-content-wrapper\"><p>[vc_row][vc_column][vc_column_text]Even if you\u2019ve only just heard of WordPress, you probably know it is built around the tenet of inclusivity: the internet is for everyone, and <strong>everybody should be able to make a website<\/strong> whether or not they have any coding knowledge at all. With WordPress, it is true.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]To help non-coders find their way around creating a website, <strong>WordPress uses ready-made layouts called themes.<\/strong> The design and production of <a href=\"https:\/\/qodeinteractive.com\/\">premium themes<\/a> is an industry we are proudly a part of, but there is also no shortage of free themes to choose from. A theme, though, is just the scaffolding. A single theme can be used for thousands of websites and yet each website made with it can be completely unique.That\u2018s what the WordPress theme customizer is for.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]The <strong>WordPress theme customizer is a set of tools which anyone can use<\/strong> to make tweaks and corrections to the look and feel of a WordPress website with ease.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]This is what we\u2019ll be talking about:<br \/>\n[\/vc_column_text][vc_empty_space height=&#8221;22px&#8221;]<ul class=\"qodef-unordered-list-item qodef-toc\">\n    <li>\n\t        <div class=\"qodef-ul-title-holder\">\n            <span class=\"qodef-ul-title-content\"><a href=\"#what-is-the-wordpress-theme-customizer\">What is the WordPress Theme Customizer?<\/a><\/span>        <\/div>\n            <\/li>\n<\/ul>[vc_empty_space height=&#8221;5px&#8221;]<ul class=\"qodef-unordered-list-item qodef-toc\">\n    <li>\n\t        <div class=\"qodef-ul-title-holder\">\n            <span class=\"qodef-ul-title-content\"><a href=\"#get-started-with-the-wordpress-theme-customizer\">How to Get Started With the WordPress Theme Customizer<\/a><\/span>        <\/div>\n            <\/li>\n<\/ul>[vc_empty_space height=&#8221;5px&#8221;]<ul class=\"qodef-unordered-list-item qodef-toc\">\n    <li>\n\t        <div class=\"qodef-ul-title-holder\">\n            <span class=\"qodef-ul-title-content\"><a href=\"#site-identity-settings\">Site Identity Settings<\/a><\/span>        <\/div>\n            <\/li>\n<\/ul>[vc_empty_space height=&#8221;5px&#8221;]<ul class=\"qodef-unordered-list-item qodef-toc\">\n    <li>\n\t        <div class=\"qodef-ul-title-holder\">\n            <span class=\"qodef-ul-title-content\"><a href=\"#colors-dark-mode-and-background-image\">Colors &amp; Dark Mode And Background Image<\/a><\/span>        <\/div>\n            <\/li>\n<\/ul>[vc_empty_space height=&#8221;5px&#8221;]<ul class=\"qodef-unordered-list-item qodef-toc\">\n    <li>\n\t        <div class=\"qodef-ul-title-holder\">\n            <span class=\"qodef-ul-title-content\"><a href=\"#menus\">Menus<\/a><\/span>        <\/div>\n            <\/li>\n<\/ul>[vc_empty_space height=&#8221;5px&#8221;]<ul class=\"qodef-unordered-list-item qodef-toc\">\n    <li>\n\t        <div class=\"qodef-ul-title-holder\">\n            <span class=\"qodef-ul-title-content\"><a href=\"#widgets\">Widgets<\/a><\/span>        <\/div>\n            <\/li>\n<\/ul>[vc_empty_space height=&#8221;5px&#8221;]<ul class=\"qodef-unordered-list-item qodef-toc\">\n    <li>\n\t        <div class=\"qodef-ul-title-holder\">\n            <span class=\"qodef-ul-title-content\"><a href=\"#homepage-and-excerpt-settings\">Homepage And Excerpt Settings<\/a><\/span>        <\/div>\n            <\/li>\n<\/ul>[vc_empty_space height=&#8221;5px&#8221;]<ul class=\"qodef-unordered-list-item qodef-toc\">\n    <li>\n\t        <div class=\"qodef-ul-title-holder\">\n            <span class=\"qodef-ul-title-content\"><a href=\"#additional-css\">Additional CSS<\/a><\/span>        <\/div>\n            <\/li>\n<\/ul>[vc_empty_space height=&#8221;68px&#8221;][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n<h2 class=\"qodef-h4\"><a id=\"what-is-the-wordpress-theme-customizer\"><\/a>What Is the WordPress Theme Customizer?<\/h2>\n<p>[\/vc_column_text][vc_column_text]The WordPress theme customizer is <strong>a default feature of WordPress<\/strong>. If you\u2018ve completed a <a href=\"https:\/\/qodeinteractive.com\/magazine\/how-to-install-wordpress\/\">WordPress installation<\/a>, you have installed the customizer, too. And while you can use it to customize absolutely any theme, some of them add new features and options, including whole new panels, to the customizer: your results may vary, but each theme\u2019s customizer will likely have all the basic options. You can reach the WordPress theme customizer by navigating to <strong>Appearance\/Customize<\/strong> from your WordPress dashboard.[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"969\" height=\"518\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Appearance-Customize.jpg\" class=\"attachment-full size-full\" alt=\"Appearance Customize\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Appearance-Customize.jpg 969w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Appearance-Customize-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Appearance-Customize-768x411.jpg 768w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/04\/Appearance-Customize-620x331.jpg 620w\" sizes=\"auto, (max-width: 969px) 100vw, 969px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]The customizer\u2018s main functions have a lot to do with <strong>how your website appears to your visitors<\/strong>: colours and images, widgets, menus, and icons: all of these can be accessed and manipulated using the WordPress customizer. What\u2018s more, this is where you can <a href=\"https:\/\/qodeinteractive.com\/magazine\/wordpress-add-custom-css\/\">add CSS, or cascading style sheets, to your website<\/a>. These are pieces of code which are mainly to do with your website\u2018s appearance, but have other functions as well.[\/vc_column_text][vc_empty_space height=&#8221;80px&#8221;][vc_widget_sidebar sidebar_id=&#8221;new-top-picks-banner&#8221;][vc_empty_space height=&#8221;80px&#8221;][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n<h2 class=\"qodef-h4\"><a id=\"get-started-with-the-wordpress-theme-customizer\"><\/a>How to Get Started With the WordPress Theme Customizer<\/h2>\n<p>[\/vc_column_text][vc_column_text]In this ultimate guide, we will go over all of these options using the latest WordPress\u2018s default theme: <a href=\"https:\/\/wordpress.org\/themes\/twentytwentyone\/\" target=\"_blank\" rel=\"noopener\">Twenty Twenty-One<\/a>. Once you have navigated to the customizer using your WordPress dashboard, you will see that it has a number of sections in the <strong>left-hand side menu<\/strong>. You can also see the <strong>preview of your website to the right<\/strong> of it. This is where you can review the changes you make in real time.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]You can choose which element or function of your theme you wish to customize by <strong>clicking on it in the left-hand side menu<\/strong>. If an element has an <strong>edit (pencil) icon<\/strong> next to it, you can click on it to edit that element instead of finding it through the menu.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]At the top of the menu, you will find the <strong>Publish<\/strong> button. If you have made any changes to your website using the customizer, they will not be immediately visible to your visitors unless you <strong>Publish<\/strong> them. If there are some changes which need saving, the button will be blue and read <strong>Publish<\/strong>. If all your changes have been published, the button will be grey and read <strong>Published<\/strong>.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]Further down, you will see the title of the website you are customizing \u2013 in our case, <em>Bridge<\/em> \u2013 and the active theme, which you can see is <em>Twenty Twenty-One<\/em>. This is also where you can <a href=\"https:\/\/qodeinteractive.com\/magazine\/how-to-install-wordpress-theme\/\">install a WordPress theme<\/a> in case you want something other than the free \u2013 though fully functional \u2013 default theme.[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"969\" height=\"699\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Theme-Customizer.jpg\" class=\"attachment-full size-full\" alt=\"Theme Customizer\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Theme-Customizer.jpg 969w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Theme-Customizer-300x216.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Theme-Customizer-768x554.jpg 768w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Theme-Customizer-620x447.jpg 620w\" sizes=\"auto, (max-width: 969px) 100vw, 969px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]There are a lot of options, and many of them are very well annotated, which means that even a new user will find their way with relative ease. Still, for the sake of convenience, we will take you through the menu options one by one.[\/vc_column_text][vc_empty_space height=&#8221;68px&#8221;][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n<h2 class=\"qodef-h4\"><a id=\"site-identity-settings\"><\/a>Site Identity Settings<\/h2>\n<p>[\/vc_column_text][vc_column_text]Clicking on the <strong>Site Identity<\/strong> section will reveal some basic options to do with what some immediate impressions you can make with your website.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]The two text fields are for the<strong> Site Title<\/strong> and the <strong>Tagline<\/strong>. You can call your site however you like, and you can also use whichever tagline you like. You can leave both fields blank, or you can uncheck the<strong> Display Site Title &amp; Tagline<\/strong> box if you don\u2018t want to use these. WordPress\u2018s default for the <strong>Tagline<\/strong> is <em>Just another WordPress site<\/em>, and we didn\u2018t change that for this demonstration.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]This is where you can also manage some of the basic elements of your website\u2018s visual identity: the <strong>Logo<\/strong> and the <strong>Site Icon<\/strong>. Clicking on <em>Select logo\/site icon<\/em> will lead you to your Media Library, wherefrom you can select an image or upload one. The logo may or may not appear anywhere on your website \u2013 it doesn\u2018t, on ours \u2013 but the site icon (or favicon) appears in browser tabs, bookmark bars, and mobile apps. The current recommended size is <em>512&#215;512<\/em> pixels.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]If you don\u2019t have a favicon already, bear in mind that there are plenty of <a href=\"https:\/\/qodeinteractive.com\/magazine\/best-favicon-generators-for-wordpress\/\">favicon generators for WordPress<\/a> which you can use.[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"969\" height=\"609\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Site-Identity.jpg\" class=\"attachment-full size-full\" alt=\"Site Identity\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Site-Identity.jpg 969w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Site-Identity-300x189.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Site-Identity-768x483.jpg 768w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Site-Identity-620x390.jpg 620w\" sizes=\"auto, (max-width: 969px) 100vw, 969px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;78px&#8221;][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n<h2 class=\"qodef-h4\"><a id=\"colors-dark-mode-and-background-image\"><\/a>Colors &amp; Dark Mode And Background Image<\/h2>\n<p>[\/vc_column_text][vc_column_text]Clicking on this section reveals the <strong>Background color<\/strong> control. This is where you can choose the color of the background of your website either from the picker or by entering the hex code.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]The <strong>Dark Mode support<\/strong> checkbox, when checked, automatically optimizes the colours of your website in those cases your visitors use <a href=\"https:\/\/qodeinteractive.com\/magazine\/how-to-enable-wordpress-dark-mode\/\">dark mode<\/a> for viewing your website.[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"969\" height=\"518\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Colors-and-Dark-Mode.jpg\" class=\"attachment-full size-full\" alt=\"Colors and Dark Mode\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Colors-and-Dark-Mode.jpg 969w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Colors-and-Dark-Mode-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Colors-and-Dark-Mode-768x411.jpg 768w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Colors-and-Dark-Mode-620x331.jpg 620w\" sizes=\"auto, (max-width: 969px) 100vw, 969px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]In case you don\u2018t want a solid colour background to your website, the<strong> Background Image<\/strong> panel is where you can add a background image from your Medial Library or upload one. Once you do that, you will find the image settings, which you can use for various effects you wish to achieve.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]In case you decide to <a href=\"https:\/\/qodeinteractive.com\/magazine\/how-to-add-background-image-wordpress\/\">add a background image<\/a>, we have gone into great detail on your options and available settings.[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"969\" height=\"688\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Background-Image.jpg\" class=\"attachment-full size-full\" alt=\"Background Image\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Background-Image.jpg 969w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Background-Image-300x213.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Background-Image-768x545.jpg 768w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Background-Image-620x440.jpg 620w\" sizes=\"auto, (max-width: 969px) 100vw, 969px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;78px&#8221;][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n<h2 class=\"qodef-h4\"><a id=\"menus\"><\/a>Menus<\/h2>\n<p>[\/vc_column_text][vc_column_text]In the <strong>Menus<\/strong> panel, you can create menus and control their behaviour and placement on your website. This is where you can make new menus by clicking on the<strong> Create New Menu<\/strong> button.[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"969\" height=\"518\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Menus.jpg\" class=\"attachment-full size-full\" alt=\"Menus\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Menus.jpg 969w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Menus-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Menus-768x411.jpg 768w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Menus-620x331.jpg 620w\" sizes=\"auto, (max-width: 969px) 100vw, 969px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]Clicking on any menu you might have on your website will reveal the items your visitors see when they access the menu. You are also able to <em>Reorder<\/em> and <strong>Add Items<\/strong> to each of these menus from this area.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]You can use the <strong>Menu Locations<\/strong> options to control where the menu appears and the <strong>Menu Options<\/strong> checkbox to automatically add new pages to any particular menu. This is useful in case you want to allow your visitors easy access to your most important pages without having to add them manually to a menu.[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"969\" height=\"714\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Main-Menu.jpg\" class=\"attachment-full size-full\" alt=\"Main Menu\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Main-Menu.jpg 969w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Main-Menu-300x221.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Main-Menu-768x566.jpg 768w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Main-Menu-620x457.jpg 620w\" sizes=\"auto, (max-width: 969px) 100vw, 969px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]Clicking on the <strong>Create New Menu<\/strong> button will lead you to a screen where you need to name your menu and place it on a chosen menu area of your website (or choose not to, in case you want to use it in a general widget area). Once you have named your menu, clicking <strong>Next<\/strong> here will allow you to add items to it.[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"969\" height=\"498\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/New-Menu.jpg\" class=\"attachment-full size-full\" alt=\"New Menu\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/New-Menu.jpg 969w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/New-Menu-300x154.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/New-Menu-768x395.jpg 768w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/New-Menu-620x319.jpg 620w\" sizes=\"auto, (max-width: 969px) 100vw, 969px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]Finally, clicking on <strong>View All Locations<\/strong> in the menus section will let you place your menus on locations provided by your theme. Menus can be located in menu locations or in widget areas, but this panel will only give you access to theme-designated menu locations.[\/vc_column_text][vc_empty_space height=&#8221;68px&#8221;][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n<h2 class=\"qodef-h4\"><a id=\"widgets\"><\/a>Widgets<\/h2>\n<p>[\/vc_column_text][vc_column_text]Clicking on the <strong>Widgets<\/strong> panel will give you access to the widget areas your theme is using. The number and layout of your widget areas will depend on the theme you are using.[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"969\" height=\"518\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Widgets.jpg\" class=\"attachment-full size-full\" alt=\"Widgets\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Widgets.jpg 969w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Widgets-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Widgets-768x411.jpg 768w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Widgets-620x331.jpg 620w\" sizes=\"auto, (max-width: 969px) 100vw, 969px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]Clicking on any widget area (the single <strong>Footer<\/strong> area in our case) will allow you to <strong>Add a Widget<\/strong> to said area. Clicking the <strong>Add a Widget<\/strong> button will show you a searchable list of available widgets.[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"969\" height=\"518\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Add-Widget.jpg\" class=\"attachment-full size-full\" alt=\"Add Widget\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Add-Widget.jpg 969w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Add-Widget-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Add-Widget-768x411.jpg 768w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Add-Widget-620x331.jpg 620w\" sizes=\"auto, (max-width: 969px) 100vw, 969px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;78px&#8221;][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n<h2 class=\"qodef-h4\"><a id=\"homepage-and-excerpt-settings\"><\/a>Homepage And Excerpt Settings<\/h2>\n<p>[\/vc_column_text][vc_column_text]Your <strong>Homepage<\/strong> is typically the first part of your website a visitor will see. You can set it up to display your latest posts, or you can set it up as a static page, in which latter case you need another page for your posts.[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"969\" height=\"571\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Homepage.jpg\" class=\"attachment-full size-full\" alt=\"Homepage\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Homepage.jpg 969w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Homepage-300x177.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Homepage-768x453.jpg 768w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Homepage-620x365.jpg 620w\" sizes=\"auto, (max-width: 969px) 100vw, 969px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]The <strong>Excerpt Settings<\/strong> panel concerns the behaviour of the main body of your posts on your posts pages, including your Homepage. Set to <strong>Summary<\/strong>, it will display a <em>Continue reading<\/em> link for your posts. If set to <strong>Full text<\/strong>, it will show the entirety of your posts.[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"969\" height=\"518\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Excerpt.jpg\" class=\"attachment-full size-full\" alt=\"Excerpt\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Excerpt.jpg 969w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Excerpt-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Excerpt-768x411.jpg 768w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/Excerpt-620x331.jpg 620w\" sizes=\"auto, (max-width: 969px) 100vw, 969px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;78px&#8221;][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n<h2 class=\"qodef-h4\"><a id=\"additional-css\"><\/a>Additional CSS<\/h2>\n<p>[\/vc_column_text][vc_column_text]Finally, we have the<strong> Additional CSS<\/strong> panel. CSS stands for cascading style sheets, and is basically code for modifying the visual style of your website, but it can have other uses, too.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]The main box is where you <a href=\"https:\/\/qodeinteractive.com\/magazine\/wordpress-add-custom-css\/#using-the-customizer\">add your code<\/a>. CSS has a literally unlimited number of functions. We have previously used it to <a href=\"https:\/\/qodeinteractive.com\/magazine\/how-to-add-line-break-o-single-line-spacing-in-wordpress\/#change-paragraph-spacing-using-css\">change line and paragraph spacing<\/a>, <a href=\"https:\/\/qodeinteractive.com\/magazine\/disable-text-selection-in-wordpress\/#disable-text-selection-using-css\">disable text selection<\/a>, <a href=\"https:\/\/qodeinteractive.com\/magazine\/how-to-indent-paragraphs-in-wordpress\/#indent-single-line\">indent paragraphs<\/a>, <a href=\"https:\/\/qodeinteractive.com\/magazine\/how-to-change-font-size-in-wordpress\/#change-font-size-using-code\">change font size<\/a>, and for various other aesthetic and utilitarian functions.[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"969\" height=\"684\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/CSS.jpg\" class=\"attachment-full size-full\" alt=\"CSS\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/CSS.jpg 969w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/CSS-300x212.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/CSS-768x542.jpg 768w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2021\/08\/CSS-620x438.jpg 620w\" sizes=\"auto, (max-width: 969px) 100vw, 969px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;78px&#8221;][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n<h2 class=\"qodef-h4\">In Conclusion<\/h2>\n<p>[\/vc_column_text][vc_column_text]As you have seen, it is not an exaggeration to say that WordPress comes with nearly unlimited options, even without you paying for a single piece of software. But even among the unlimited options, we find common functionalities, and that is what WordPress Theme Customizer is for. Simply install WordPress and your chosen theme and get to work building a website from the ground up and tweaking it until it\u2018s just so.<br \/>\n[\/vc_column_text][\/vc_column][\/vc_row]<\/p>\n<\/div>","protected":false},"excerpt":{"rendered":"<p>Adjust your theme to your liking with the WordPress theme customizer: we will show you how.<\/p>\n","protected":false},"author":16990,"featured_media":28746,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[5],"tags":[14,4,13],"class_list":["post-28580","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-resources","tag-core","tag-tips","tag-wordpress"],"_links":{"self":[{"href":"https:\/\/qodeinteractive.com\/magazine\/wp-json\/wp\/v2\/posts\/28580","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/qodeinteractive.com\/magazine\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/qodeinteractive.com\/magazine\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/qodeinteractive.com\/magazine\/wp-json\/wp\/v2\/users\/16990"}],"replies":[{"embeddable":true,"href":"https:\/\/qodeinteractive.com\/magazine\/wp-json\/wp\/v2\/comments?post=28580"}],"version-history":[{"count":0,"href":"https:\/\/qodeinteractive.com\/magazine\/wp-json\/wp\/v2\/posts\/28580\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/qodeinteractive.com\/magazine\/wp-json\/wp\/v2\/media\/28746"}],"wp:attachment":[{"href":"https:\/\/qodeinteractive.com\/magazine\/wp-json\/wp\/v2\/media?parent=28580"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/qodeinteractive.com\/magazine\/wp-json\/wp\/v2\/categories?post=28580"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/qodeinteractive.com\/magazine\/wp-json\/wp\/v2\/tags?post=28580"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}