{"id":1895,"date":"2019-09-30T15:00:47","date_gmt":"2019-09-30T13:00:47","guid":{"rendered":"https:\/\/qodeinteractive.com\/magazine\/?p=1895"},"modified":"2022-01-11T10:41:07","modified_gmt":"2022-01-11T09:41:07","slug":"things-to-do-after-installing-bridge","status":"publish","type":"post","link":"https:\/\/qodeinteractive.com\/magazine\/things-to-do-after-installing-bridge\/","title":{"rendered":"10 Things to Do After Installing the Bridge Theme"},"content":{"rendered":"<div class=\"wpb-content-wrapper\"><p>[vc_row][vc_column][vc_column_text]When you decide to build your own website, your go-to solution is probably going to be WordPress. And why wouldn\u2019t it be? For one, you can download it for free, and two, you don\u2019t need any coding knowledge to use it. Others already did all the work, which means that you\u2019re just a few mouse clicks away from setting the cornerstone of your web empire. [\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]All you have to do to get started is download WordPress from <a href=\"https:\/\/wordpress.org\/\" target=\"_blank\" rel=\"noopener noreferrer\">wordpress.org<\/a>, and install it on your server. If you need help on that regard, this tutorial will be of great help:[\/vc_column_text][vc_empty_space height=&#8221;41px&#8221;][vc_column_text]<iframe loading=\"lazy\" src=\"https:\/\/www.youtube.com\/embed\/_05NUFKObqA\" width=\"1280\" height=\"720\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe>[\/vc_column_text][vc_empty_space height=&#8221;40px&#8221;][vc_column_text]The next, and perhaps most important step in creating your website is deciding which theme to go with. There are tons of great <a href=\"https:\/\/qodeinteractive.com\/themes-list\/\">premium WordPress themes<\/a> to choose from. But if you want a truly versatile solution, a theme you can use to create any type of website imaginable, the <a href=\"https:\/\/qodeinteractive.com\/wordpress-theme\/bridge-creative-multi-purpose-wordpress-theme\/\">Bridge creative multipurpose theme<\/a> is a pretty good option, even if we do say so ourselves. You can find out more about Bridge and all it has to offer in the video below:[\/vc_column_text][vc_empty_space height=&#8221;41px&#8221;][vc_column_text]<iframe loading=\"lazy\" src=\"https:\/\/www.youtube.com\/embed\/b74j7Kt8Uas\" width=\"1280\" height=\"720\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><span data-mce-type=\"bookmark\" style=\"display: inline-block; width: 0px; overflow: hidden; line-height: 0;\" class=\"mce_SELRES_start\">\ufeff<\/span><\/iframe>[\/vc_column_text][vc_empty_space height=&#8221;41px&#8221;][vc_column_text]If you\u2019d prefer an unbiased opinion, you can check out <a href=\"https:\/\/www.collectiveray.com\/bridge-theme-wordpress\" target=\"_blank\" rel=\"noopener noreferrer\">Collective Ray\u2019s review of the Bridge theme<\/a>.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]If you\u2019ve already purchased Bridge and are ready to build your beautiful website, this article will help get you off to a quick start. Here, we list the 10 things you should do right after installing the Bridge theme. [\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]There\u2019s pretty much nothing you can\u2019t do with this creative bestseller. It\u2019s been making waves since the day it was released, and for good reason. So stick around, and learn how to make the most of it.[\/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\">1. Install and Activate Plugins<\/h2>\n<p>[\/vc_column_text][vc_column_text]As soon as you install and activate the theme, the first thing you should do is choose <em><strong>Plugins<\/strong><\/em> from the menu on the left and activate installed plugins. Some are optional, whereas others simply must be activated in order for the theme to function in its full glory.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-1.jpg\" class=\"attachment-full size-full\" alt=\"Install and activate plugins\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-1.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-1-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-1-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]When it comes to choosing which optional plugins to go with, activate those that are of use to you and your business. For instance, if you don\u2019t have Twitter, there\u2019s probably no point in activating the <em>Qode Twitter Feed<\/em> plugin. Or, if you don\u2019t have the intention of running an online shop, you won\u2019t need the <em>WooCommerce<\/em> plugin either. If that should ever change, you can always go back to <em>Plugins<\/em> and apply the changes as per your requirements.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]While Bridge is compatible with the Gutenberg editor, you can also install the <em>Classic Editor<\/em> Plugin, if you\u2019re already used to working with it.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]However, you are required to activate either <strong>WPBakery Page Builder plugin or Elementor<\/strong>, which come bundled free with Bridge. These drag-and-drop page builders give you access to all the custom shortcodes the Bridge theme comes with and makes creating a stunning website both easier and faster.[\/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\">2. Import a Bridge Demo<\/h2>\n<p>[\/vc_column_text][vc_column_text]<strong>Before importing a demo, you need to register your Bridge theme first.<\/strong> To do that, make sure the <em><strong>Bridge Core<\/strong><\/em> plugin is active. If you don\u2019t have it installed, go to <strong><em>Appearance &gt; Install Plugins<\/em><\/strong> to add and activate the plugin.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]Then, select <em><strong>Bridge Dashboard<\/strong><\/em> from your admin menu. A <em><strong>Registration<\/strong><\/em> form will then appear and you\u2019ll be asked to enter your <strong>purchase code and your email address<\/strong> to register your copy of Bridge.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Bridge-registration.jpg\" class=\"attachment-full size-full\" alt=\"Bridge registration\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Bridge-registration.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Bridge-registration-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Bridge-registration-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]<strong>Please note that one license works for one domain only.<\/strong> If you\u2019d like to use your copy of Bridge on some other website, you first need to deregister your theme on the old website, and then register it again for the new one.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]Take a look at this video for a step-by-step guide on how to register a Bridge theme .[\/vc_column_text][vc_empty_space height=&#8221;41px&#8221;][vc_column_text]<iframe loading=\"lazy\" src=\"https:\/\/www.youtube.com\/embed\/5RJoVE5ScQs\" width=\"1280\" height=\"720\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><span data-mce-type=\"bookmark\" style=\"display: inline-block; width: 0px; overflow: hidden; line-height: 0;\" class=\"mce_SELRES_start\">\ufeff<\/span><\/iframe>[\/vc_column_text][vc_empty_space height=&#8221;41px&#8221;][vc_column_text]Now that you\u2019ve activated all the required plugins and you\u2019ve registered your copy of Bridge, the next step to take is to <strong>import a demo<\/strong>. The Bridge demos are great starting points for your website. Just choose the demo that best fits the type of site you\u2019re going for, import it, and then customize it to your taste and make it your own.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]There are two types of Bridge demos: the ones that use the Elementor page builder, and the ones that use the WPBakery page builder plugin. Only the original Bridge demo is available for both Elementor and WPBakery. [\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]Just keep in mind that once you decide which page builder you\u2019re going to use, you should stick with it. So, if you start creating a website with WPBakery, we recommend you keep on using that page builder. But you can easily switch to Elementor for your next project.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]To better understand the difference between Elementor and WPBakery in Bridge, check out the following video:[\/vc_column_text][vc_empty_space height=&#8221;41px&#8221;][vc_column_text]<iframe loading=\"lazy\" src=\"https:\/\/www.youtube.com\/embed\/eyvXDYoe-Mk\" width=\"1280\" height=\"720\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><span data-mce-type=\"bookmark\" style=\"display: inline-block; width: 0px; overflow: hidden; line-height: 0;\" class=\"mce_SELRES_start\">\ufeff<\/span><\/iframe>[\/vc_column_text][vc_empty_space height=&#8221;41px&#8221;][vc_column_text]To import a demo with Bridge, head over to the menu on the left and go to <strong>Bridge Dashboard<\/strong>.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Bridge-dashboard-import.jpg\" class=\"attachment-full size-full\" alt=\"Bridge dashboard import\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Bridge-dashboard-import.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Bridge-dashboard-import-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Bridge-dashboard-import-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]This is where you\u2019ll find all the available Bridge demos. You can search them by entering a keyword in the Search field, or browse them by category. To find demos that were built using Elementor, select the <em><strong>Elementor<\/strong> <\/em>category.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Find-your-demo.jpg\" class=\"attachment-full size-full\" alt=\"Find your demo\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Find-your-demo.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Find-your-demo-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Find-your-demo-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]If you want to learn which page builder was used to build a specific demo, click on the demo. A pop up window will appear, and under <em><strong>Following plugins should be installed and activated before a demo import<\/strong><\/em> you\u2019ll see which plugin was used to build 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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Import-demo-content.jpg\" class=\"attachment-full size-full\" alt=\"Import demo content\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Import-demo-content.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Import-demo-content-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Import-demo-content-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]Here you can also choose the content you\u2019d like to import, as well as decide if you want to import media files along with the demo. If you\u2019d like to import the full demo, <strong>choose \u201cAll\u201d under Import Type and set Import Attachments to \u201cYes.\u201d<\/strong>[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Import-options.jpg\" class=\"attachment-full size-full\" alt=\"Import options\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Import-options.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Import-options-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Import-options-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]Once you\u2019ve set all the options and installed the required plugins, just click the Import button and your demo will be imported. [\/vc_column_text][vc_column_text]To guide you through the demo import process, we\u2019ve made two video tutorials &#8211; one for each page builder. The following video will teach you how to <strong>how to import demos made with Elementor<\/strong>:[\/vc_column_text][vc_empty_space height=&#8221;41px&#8221;][vc_column_text]<iframe loading=\"lazy\" src=\"https:\/\/www.youtube.com\/embed\/ZhxWJJv7s8g\" width=\"1280\" height=\"720\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe>[\/vc_column_text][vc_empty_space height=&#8221;41px&#8221;][vc_column_text]And this one will show you <strong>how to import demos made using WPBakery<\/strong>:[\/vc_column_text][vc_empty_space height=&#8221;41px&#8221;][vc_column_text]<iframe loading=\"lazy\" src=\"https:\/\/www.youtube.com\/embed\/sAzBZEb6-9Q\" width=\"1280\" height=\"720\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe>[\/vc_column_text][vc_empty_space height=&#8221;41px&#8221;][vc_column_text]Just remember that if you choose to import an Elementor demo, you should deactivate the WPBakery plugin and vice versa. [\/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\">3. Add Your Logo<\/h2>\n<p>[\/vc_column_text][vc_column_text]A logo is probably one of the first things we notice when we visit a website. In most cases it\u2019s located in the top-left corner of a website. Having a logo is indispensable for anyone who\u2019s serious about their brand. A well designed logo will capture people\u2019s attention and help make your brand memorable and unique.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]To add a logo to your website using Bridge, go to <em><strong>Qode Options<\/strong><\/em> (this is where you\u2019ll find all the global settings related to the theme) from the menu, and then select <strong><em>Logo<\/em><\/strong>.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Qode-Options-Logo.jpg\" class=\"attachment-full size-full\" alt=\"Qode Options Logo\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Qode-Options-Logo.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Qode-Options-Logo-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Qode-Options-Logo-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]Here you\u2019ll see a bunch of logo-related options. Not only can you add a default image that will be displayed as the logo, but you also get to choose between a dark or light logo variant.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-7.jpg\" class=\"attachment-full size-full\" alt=\"Logo-related options on Bridge\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-7.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-7-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-7-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]Also, it\u2019s possible to use a different logo for each header type (sticky, mobile, or fixed), as well as to set the <em>Logo Height for Mobile<\/em>.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]Once you\u2019re done with all the settings, don\u2019t forget to click <em>Save Changes<\/em>.[\/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\">4. Change the Favicon<\/h2>\n<p>[\/vc_column_text][vc_column_text]Favicons are those tiny icons you see in tabs when browsing, as well as in bookmark lists, search results, etc. They\u2019re normally displayed on the left side of the web browser\u2019s tab, and are super useful, because as petite as they are, they help others identify your brand. Favicons can contain your logo, or anything else that represents your business. They usually measure 16 x 16px, though in some cases they can go up to 32 x 32px in size. In the image below, you can see the favicon of the Qode Interactive 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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-8.jpg\" class=\"attachment-full size-full\" alt=\"WordPress Favicon\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-8.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-8-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-8-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]Many people actually tend to overlook this step and completely forget to set a favicon for their website. This is a simple task when you\u2019re using the Bridge theme.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]Once again, hover over to the menu on the left, and under <strong><em>Qode Options<\/em> select <em>General<\/em><\/strong>.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Qode-Options-General.jpg\" class=\"attachment-full size-full\" alt=\"Qode Options General\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Qode-Options-General.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Qode-Options-General-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Qode-Options-General-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]Press Ctrl + F (or Command + F on Mac) and type in \u201cfavicon\u201d to quickly find the <em><strong>Favicon Image<\/strong><\/em> option.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-10.jpg\" class=\"attachment-full size-full\" alt=\"Upload Favicon image\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-10.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-10-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-10-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]The only thing left to do now is to choose an image that you\u2019d like to use as your favicon.[\/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\">5. Connect to Social Media<\/h2>\n<p>[\/vc_column_text][vc_column_text]We\u2019re all aware of just how important social media is for brand marketing. There\u2019s nothing better in terms of ensuring greater exposure for your business and spreading the word about the services you provide. You get to share your content in a cost-effective way and directly communicate with your audience all over the world. Satisfied customers are one of the most important factors that greatly contribute to your professional success. [\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]There are <strong>two ways in which you can integrate social media on your website<\/strong>. One is by using Bridge\u2019s <strong>Social Icons shortcode<\/strong> and the other is by using the <strong>Qode Social Icons widget<\/strong>.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]Let\u2019s start off by showing you how to use the <strong>Social Icons shortcode<\/strong>.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-11.jpg\" class=\"attachment-full size-full\" alt=\"Social Icons shortcode\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-11.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-11-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-11-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]This shortcode comes with numerous options, from choosing social icons which will be added to your website, to setting the icon type, size, icon pack, icon color, border color, etc. Since you want icons to lead to your social media pages, don\u2019t forget to<strong> input the appropriate URL in the <em>Link<\/em> field<\/strong>. By using the Social Icons shortcode, you have the possibility to display social icons anywhere on a page.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-12.jpg\" class=\"attachment-full size-full\" alt=\"Social Icons shortcode settings\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-12.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-12-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-12-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]When it comes to adding social icons to a widget area, there are two ways to do this. The first is by pasting the social icon shortcode into a Text widget, while the second is by using the Qode Social Icon widget. [\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]It\u2019s important to note here that some Bridge demos were created before the Qode Social Icon Widget. In those demos, social icons were added to widget areas using a combination of the social icon shortcode and the Text widget. [\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-15.jpg\" class=\"attachment-full size-full\" alt=\"Social Icons in Footer\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-15.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-15-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-15-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]In this case, if you want to use exactly the same social icons in the widget area as in the demo, all you have to do is to change the link to your social media accounts. To do this, from the menu on the left select <em><strong>Appearance &gt; Widgets<\/strong><\/em>.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-16.jpg\" class=\"attachment-full size-full\" alt=\"WordPress Widget Options\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-16.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-16-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-16-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]On the right hand side of the screen you\u2019ll see every single widget area available. What you want to do is find the ones which contain said social icons, so you can make the modifications as per your needs.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-17.jpg\" class=\"attachment-full size-full\" alt=\"Available widget area\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-17.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-17-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-17-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]Open the widget area with the social icons, and then open the Text widget within. [\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-18a.jpg\" class=\"attachment-full size-full\" alt=\"Open the Text widget\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-18a.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-18a-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-18a-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]As you can see in the image above, in our example the<em><strong> Footer Column 1<\/strong><\/em> widget area has a <em><strong>Text<\/strong><\/em> widget with the social icon shortcode inside it. It\u2019s quite easy to recognize this shortcode, since it starts with <em><strong>social_icons<\/strong><\/em>.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]Here\u2019s an example of the social icon shortcode for Twitter:[\/vc_column_text][vc_empty_space height=&#8221;30px&#8221;][vc_column_text]<code class=\"EnlighterJSRAW\" data-enlighter-language=\"generic\">[social_icons type=\"normal_social\" icon=\"fa-twitter\" use_custom_size=\"yes\" size=\"fa-lg\" custom_size=\"17\" link=\"http:\/\/twitter.com\" target=\"_blank\"] <\/code>[\/vc_column_text][vc_empty_space height=&#8221;34px&#8221;][vc_column_text]Once you find the Text widget with these social icons, all you need to do is insert the link that leads to your Twitter feed between the quotation marks after link=. In the example above, we\u2019d replace the <em>http:\/\/twitter.com<\/em> link with the link to our twitter feed.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]The same applies to all social icons, regardless of the widget area they\u2019re placed in. If some of the icons are superfluous, simply delete the entire shortcode, along with the box brackets \u2013 [ ].[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]The<strong> Qode Social Icon<\/strong> widget, on the other hand, is the easiest way to add new social icons to the various widget areas of your website.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]All you need to do is decide which widget area you\u2019d like to display the social icon in and then drag and drop the Qode Social Icon widget into that widget area. The widget has a variety of options that let you modify the type and size of the social icons, choose the font icon pack, the icon color, add the link, set the hover color, etc.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-18b.jpg\" class=\"attachment-full size-full\" alt=\"Qode Social Icon widget\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-18b.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-18b-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-18b-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]And that\u2019s all there is to it. Just remember to save the widget settings once you\u2019re done setting up your social icon. [\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]We also have a useful video that explains how to add and customize social icons both via the Qode Social Icon widget and by using the combination of the Social Icon shortcode and the Text widget. Check it out below:[\/vc_column_text][vc_empty_space height=&#8221;41px&#8221;][vc_column_text]<iframe loading=\"lazy\" src=\"https:\/\/www.youtube.com\/embed\/bvtCEWkmJok\" width=\"1280\" height=\"720\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe>[\/vc_column_text][vc_empty_space height=&#8221;80px&#8221;][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n<h2 class=\"qodef-h4\">6. Add\/Change Contact Information in Your Footer<\/h2>\n<p>[\/vc_column_text][vc_column_text]If you import a demo, it will come with some placeholder links, addresses, and phone numbers in the footer area. Of course, you\u2019ll want to change all of this information to correspond to your business. Luckily, doing so is quite simple.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-19.jpg\" class=\"attachment-full size-full\" alt=\"Add\/change contact information in your footer\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-19.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-19-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-19-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]All the information in the footer is placed in the <strong><em>Footer Column<\/em><\/strong> widget areas. In our example, we\u2019ll explain how you can change the address, email, and phone number located in the first footer column.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]Head over to the menu on the left side of the screen and select <em><strong>Appearance &gt; Widgets<\/strong><\/em>. Then, under <em><strong>Footer Column 1<\/strong><\/em> choose the <em><strong>Text<\/strong><\/em> block.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-19a.jpg\" class=\"attachment-full size-full\" alt=\"Under Footer Column 1 choose the Text block\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-19a.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-19a-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-19a-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]First, let\u2019s take care of the <strong>address<\/strong>. If it\u2019s not there already, use Google maps or a similar app to determine your precise location.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-20.jpg\" class=\"attachment-full size-full\" alt=\"Determine your precise location\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-20.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-20-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-20-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]The copy the URL and paste it within the quotation marks after the <em>href<\/em> atribute.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-19b.jpg\" class=\"attachment-full size-full\" alt=\"Copy the URL and paste it\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-19b.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-19b-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-19b-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]Don\u2019t forget to also change the actual address text. The address is always placed between the<code class=\"EnlighterJSRAW\" data-enlighter-language=\"html\"> &lt;a&gt;<\/code> and <code class=\"EnlighterJSRAW\" data-enlighter-language=\"html\">&lt;\/a&gt;<\/code> tags.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-19c.jpg\" class=\"attachment-full size-full\" alt=\"Change the actual address text\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-19c.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-19c-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-19c-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]The <strong>target attribute<\/strong> is set as <strong><em>blank<\/em><\/strong> because we want the map to open in a new tab. However, if you wish for it to load in the same tab, just delete this attribute. The <code class=\"EnlighterJSRAW\" data-enlighter-language=\"html\">&lt;br&gt;<\/code> tags are useful when you\u2019re writing an address, as they signify a line break. In our case, the address breaks in two lines and each is linked.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-19d.jpg\" class=\"attachment-full size-full\" alt=\"Line break tag\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-19d.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-19d-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-19d-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]To make sure nothing is linked as in the demo you\u2019ve imported, it\u2019s important not to forget to<strong> change all the href attributes<\/strong> in all <code class=\"EnlighterJSRAW\" data-enlighter-language=\"html\">&lt;a&gt;<\/code> tags. That\u2019s where you place hyperlinks to other web locations.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]When it comes to the phone number that you wish to display in the footer, you should do pretty much the same as with the address. The only difference is that, instead of the address, you\u2019ll now paste the phone and fax number between the <code class=\"EnlighterJSRAW\" data-enlighter-language=\"html\">&lt;a&gt;<\/code> and <code class=\"EnlighterJSRAW\" data-enlighter-language=\"html\">&lt;\/a&gt;<\/code> tags, and you\u2019ll use the<em> tel:<\/em> and <em>fax:<\/em> markers in the href attribute.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-19e.jpg\" class=\"attachment-full size-full\" alt=\"Paste the phone and fax number\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-19e.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-19e-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-19e-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]To add the <strong>email address<\/strong>, paste it between the <code class=\"EnlighterJSRAW\" data-enlighter-language=\"html\">&lt;a&gt;<\/code> and <code class=\"EnlighterJSRAW\" data-enlighter-language=\"html\">&lt;\/a&gt;<\/code>\u00a0 tags. Just remember to use the <em>mailto:<\/em> marker within the <em>href<\/em> attribute if you\u2019d like the link to open the user\u2019s default mail client.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-19f.jpg\" class=\"attachment-full size-full\" alt=\"Add the email address\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-19f.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-19f-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-19f-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]If no address and contact details have been linked in the demo you imported, you can use the following codes and change the appropriate information as explained in the text above: [\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;][vc_column_text]<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"html\">&lt;a href=\"https:\/\/www.google.com\/maps\/place\/WTC+Cortlandt\/@40.7079626,-73.9994727,16z\/data=!4m8!1m2!2m1!1sgoogle+maps!3m4!1s0x89c25a19872391ef:0xccdbc0027a5b8faf!8m2!3d40.7109799!4d-74.0116753\" target=\"_blank\"&gt;198 West 21th Street, Suite 721&lt;br \/&gt;\r\nNew York NY 10010&lt;\/a&gt;&lt;br \/&gt;\r\nEmail:&lt;a href=\u201dmailto:eshiels@ncgo.com\u201d&gt; eshiels@ncgo.com&lt;\/a&gt;&lt;br \/&gt;\r\nPhone: &lt;a href=\"tel:+1800990877\" &gt;+0990877&lt;\/a&gt;&lt;br \/&gt;\r\nFax: &lt;a href=\"fax:+1800990877\" &gt;0990877&lt;\/a&gt;<\/pre>\n<p>[\/vc_column_text][vc_empty_space height=&#8221;18px&#8221;][vc_column_text]Regarding <strong>the website link in the footer<\/strong> (which is usually located in the bottom footer widget area), if it\u2019s already included in the demo, you can just change the text between the <span style=\"font-weight: 400;\">\u00a0<code class=\"EnlighterJSRAW\" data-enlighter-language=\"html\">&lt;a&gt; &lt;\/a&gt;<\/code><\/span> tags and the href attribute to correspond to your website. However, if there is no website link in the footer of the demo you imported, you can use the following code to add it:[\/vc_column_text][vc_empty_space height=&#8221;50px&#8221;][vc_column_text]<\/p>\n<pre class=\"EnlighterJSRAW\" data-enlighter-language=\"html\">&lt;a href=\u201dsite_url\u201d&gt;the name of your website&lt;\/a&gt;<\/pre>\n<p>[\/vc_column_text][vc_empty_space height=&#8221;18px&#8221;][vc_column_text]Once again, to ensure no links remain from the demo itself, make sure you check all widget areas and modify all the href tag. [\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]Learn more about setting up and customizing your website footer in this video tutorial:[\/vc_column_text][vc_empty_space height=&#8221;41px&#8221;][vc_column_text]<iframe loading=\"lazy\" src=\"https:\/\/www.youtube.com\/embed\/lSPn1eUJ5LY\" width=\"1280\" height=\"720\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe>[\/vc_column_text][vc_empty_space height=&#8221;80px&#8221;][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n<h2 class=\"qodef-h4\">7. Customize the Colors<\/h2>\n<p>[\/vc_column_text][vc_column_text]There are several places where you can alter the colors of your website, depending on which colors you\u2019d like to change. Some settings are global, whereas others refer to pages only. To better understand global and page settings in Bridge, feel free to check out this video tutorial:[\/vc_column_text][vc_empty_space height=&#8221;41px&#8221;][vc_column_text]<iframe loading=\"lazy\" src=\"https:\/\/www.youtube.com\/embed\/tKfg1LX7_GA\" width=\"1280\" height=\"720\" frameborder=\"0\" allowfullscreen=\"allowfullscreen\"><\/iframe>[\/vc_column_text][vc_empty_space height=&#8221;40px&#8221;][vc_column_text]To change the colors throughout your website, go to the menu, and select <em><strong>Qode Options &gt; General<\/strong><\/em>.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Qode-Options-General.jpg\" class=\"attachment-full size-full\" alt=\"Qode Options General\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Qode-Options-General.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Qode-Options-General-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Qode-Options-General-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]This is where you can set <strong>the first main color<\/strong> (the most dominant color on your website), as well as <strong>the second, third, and fourth main color<\/strong>. You can also play around a bit and modify <strong>the content and box background colors, the text selection color, and gradient colors<\/strong>.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-21.jpg\" class=\"attachment-full size-full\" alt=\"Customize the colors\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-21.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-21-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-21-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]To change the colors of the header, footer, sidebar, as well as the title, fonts, blog, and portfolio colors, just go to the menu and under <em><strong>Qode Options<\/strong> <\/em>find the corresponding section. For instance, if you wish to alter your font colors, go to <em><strong>Qode Options &gt; Fonts<\/strong><\/em>.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]As we mentioned earlier, the color changes can also be applied to only one page or post. You can modify the background color, the color of the header and the <a href=\"https:\/\/qodeinteractive.com\/magazine\/set-wordpress-title-area\/\">title area<\/a>, and various other options. The modifications will be visible only on the specific page or post you set those options on.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-22.jpg\" class=\"attachment-full size-full\" alt=\"Page background color\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-22.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-22-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-22-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]To change the colors on a page or a post, just open that post in your WrodPress admin. As you scroll, you\u2019ll see options which let you change the colors of various elements of a page. [\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]If you notice that some options are not active, go to <em><strong>Screen Option<\/strong><\/em> at the upper right corner of your admin dashboard. A lot of check boxes that you can tick will appear, just choose the sections you\u2019d like to display on that particular page.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-23.jpg\" class=\"attachment-full size-full\" alt=\"Screen Option\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-23.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-23-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-23-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;60px&#8221;]<div class=\"qodef-single-image-holder   qodef-has-border \">\n    <div class=\"qodef-si-inner\" >\n                                    <img loading=\"lazy\" decoding=\"async\" width=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-24.jpg\" class=\"attachment-full size-full\" alt=\"Choose the sections you\u2019d like to display\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-24.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-24-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-24-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;90px&#8221;][vc_separator color=&#8221;custom&#8221; accent_color=&#8221;#f0f0f0&#8243;][vc_empty_space height=&#8221;50px&#8221;][vc_widget_sidebar sidebar_id=&#8221;top-picks-banner&#8221;][vc_empty_space height=&#8221;28px&#8221;][vc_separator color=&#8221;custom&#8221; accent_color=&#8221;#f0f0f0&#8243;][vc_empty_space height=&#8221;80px&#8221;][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n<h2 class=\"qodef-h4\">8. Change Fonts<\/h2>\n<p>[\/vc_column_text][vc_column_text]To take care of the font settings on your website, go to Qode <em><strong>Options &gt; Fonts<\/strong><\/em>.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Qode-Options-Fonts.jpg\" class=\"attachment-full size-full\" alt=\"Qode Options Fonts\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Qode-Options-Fonts.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Qode-Options-Fonts-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2019\/09\/Qode-Options-Fonts-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]There\u2019s a whole bunch of options here allowing you to go into great detail font-wise. You can choose different heading styles (from H1 to H6), set fonts for both the header and footer, as well as for links, menus, etc. Aside from deciding on fonts, you can also set the appropriate responsiveness for each style and font you choose.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-26.jpg\" class=\"attachment-full size-full\" alt=\"Fonts\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-26.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-26-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-26-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;79px&#8221;][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n<h2 class=\"qodef-h4\">9. Menu Settings<\/h2>\n<p>[\/vc_column_text][vc_column_text]When it comes to customizing your menu, all the settings are placed in<em><strong> Appearance &gt; Menu<\/strong><\/em>.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-27.jpg\" class=\"attachment-full size-full\" alt=\"Menu settings\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-27.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-27-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-27-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]This is where you can create a new menu or modify the one that you imported with the demo. [\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-28.jpg\" class=\"attachment-full size-full\" alt=\"Create a new menu or modify the one that you imported with the demo\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-28.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-28-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-28-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]To create a brand new menu, click on <em><strong>Create new menu<\/strong><\/em> and then name it. Once you\u2019re done, don\u2019t forget to click <em><strong>Create Menu<\/strong><\/em>.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-29.jpg\" class=\"attachment-full size-full\" alt=\"Create new menu\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-29.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-29-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-29-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]Under <em><strong>Add menu items<\/strong><\/em> you\u2019ll be able to find all the pages, posts, categories, etc. that you\u2019ve created. Choose which elements you\u2019d like to add to your menu by checking the box next to its name. What\u2019s also handy is that you can add custom links. Just go to <em><strong>Custom Links<\/strong><\/em> and paste the URL that you like. Don\u2019t forget to enter the link text, though.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-30.jpg\" class=\"attachment-full size-full\" alt=\"Add menu items\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-30.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-30-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-30-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]If you want your link to open in a new tab upon being clicked (and this refers not only to Custom Links, but also to other menu content), go to <strong><em>Screen Options<\/em><\/strong>, and under <em><strong>Show advanced menu properties<\/strong><\/em> tick the <strong><em>Link Target<\/em><\/strong> box.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-30a.jpg\" class=\"attachment-full size-full\" alt=\"Advanced menu properties\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-30a.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-30a-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-30a-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]Now, when you click on a link, you\u2019ll have the option to check the <em><strong>Open link in a new window\/tab<\/strong><\/em> box.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-30b.jpg\" class=\"attachment-full size-full\" alt=\"Open link in a new window\/tab box\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-30b.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-30b-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-30b-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]Once you\u2019ve decided which elements will be a part of your menu, click on <strong>Add to menu<\/strong>.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-31.jpg\" class=\"attachment-full size-full\" alt=\"Add item to menu\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-31.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-31-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-31-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]As you start adding pages to a menu, you\u2019ll see them appear under the<em><strong> Menu Structure<\/strong><\/em>. Feel free to drag and drop the content to arrange the menu items the way you like it best, and to create multi-level menus.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-32.jpg\" class=\"attachment-full size-full\" alt=\"Menu Structure\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-32.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-32-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-32-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]At the bottom of the page, under<em><strong> Menu Settings<\/strong><\/em>, you get to add the menu you created to your website. You can choose where you\u2019d like it to appear.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-33.jpg\" class=\"attachment-full size-full\" alt=\"Menu Settings\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-33.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-33-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-33-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]Once you\u2019re happy with the way everything looks, hit the <em><strong>Save Menu<\/strong><\/em> button.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]Should you, at some point, decide to remove some elements from the menu, you can do it by simply clicking the <em><strong>Remove<\/strong><\/em> 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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-34.jpg\" class=\"attachment-full size-full\" alt=\"Remove elements from the menu\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-34.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-34-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-34-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;79px&#8221;][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n<h2 class=\"qodef-h4\">10. Arrange the Widgets<\/h2>\n<p>[\/vc_column_text][vc_column_text]Widgets let you further customize your website. You can add a widget to any available widget area on your website and it\u2019ll appear on all pages that have that widget area in them. To access your widgets, navigate to <em><strong>Appearance &gt; Widgets<\/strong><\/em> in the main 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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-16.jpg\" class=\"attachment-full size-full\" alt=\"WordPress Widget Options\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-16.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-16-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-16-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]Bridge comes packed with some stellar widgets that can enhance the functionality of your pages.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-35.jpg\" class=\"attachment-full size-full\" alt=\"Widgets\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-35.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-35-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-35-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]There are <em><strong>two ways of adding widgets to a widget area<\/strong><\/em>. You can drag and drop them to the desired widget area, or you can click the arrow next to the widget\u2019s name and then choose the widget area from the dropdown menu. When you\u2019re done, click the <em><strong>Add Widget<\/strong><\/em> 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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-37.jpg\" class=\"attachment-full size-full\" alt=\"Adding widgets to a widget area\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-37.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-37-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-37-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]It\u2019s also important to note that this is the area where you can <strong>create and build your footer<\/strong>, as well as add various widgets to your header.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]Bridge is full of great widgets. For instance, there\u2019s a variety of handy product and store-related widgets, as well as the <strong><em>Qode Instagram<\/em><\/strong> and<em><strong> Qode Social Icon<\/strong><\/em> widgets, to name just a few. Add the ones that best fit your requirements and enhance the overall functionality of your website without having to write a single line of code.[\/vc_column_text][vc_empty_space height=&#8221;28px&#8221;][vc_column_text]What\u2019s also great is that <strong>each widget can be further customized<\/strong>. To edit them to your liking, click on the arrow next to the name of the widget. You\u2019ll see that all options available are pretty much self-explanatory.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-37a.jpg\" class=\"attachment-full size-full\" alt=\"Widget options\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-37a.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-37a-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-37a-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;38px&#8221;][vc_column_text]In case you want to <strong>delete a widget<\/strong>, again, click on the arrow next to its name. At the very bottom, you\u2019ll see the <strong><em>Delete<\/em><\/strong> option. Click on it to remove the chosen widget.[\/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=\"710\" height=\"378\" src=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-37a.jpg\" class=\"attachment-full size-full\" alt=\"Widget options\" srcset=\"https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-37a.jpg 710w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-37a-300x160.jpg 300w, https:\/\/qodeinteractive.com\/magazine\/wp-content\/uploads\/2020\/09\/10-Things-37a-620x330.jpg 620w\" sizes=\"auto, (max-width: 710px) 100vw, 710px\" \/>                        <\/div>\n<\/div>[vc_empty_space height=&#8221;79px&#8221;][\/vc_column][\/vc_row][vc_row][vc_column][vc_column_text]<\/p>\n<h2 class=\"qodef-h4\">Conclusion<\/h2>\n<p>[\/vc_column_text][vc_column_text]The Bridge theme is so versatile that it turns WordPress into your virtual playground. It enables you to build websites for literally all kinds of businesses. From agencies, jewelry shops, to language schools and construction companies, Bridge has got you covered. In this article we\u2019ve suggested what to do once you install the theme, but feel free to explore its features on your own as well. Combine features from different demos, tweak them as you like, and use all that Bridge has to offer to craft some unparalleled websites.[\/vc_column_text][\/vc_column][\/vc_row]<\/p>\n<\/div>","protected":false},"excerpt":{"rendered":"<p>If you\u2019ve purchased Bridge and are ready to build your beautiful website, this article will help get you off to a quick start.<\/p>\n","protected":false},"author":4,"featured_media":2109,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[7],"tags":[18,16,13],"class_list":["post-1895","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-tutorials","tag-bridge","tag-themes","tag-wordpress"],"_links":{"self":[{"href":"https:\/\/qodeinteractive.com\/magazine\/wp-json\/wp\/v2\/posts\/1895","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\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/qodeinteractive.com\/magazine\/wp-json\/wp\/v2\/comments?post=1895"}],"version-history":[{"count":0,"href":"https:\/\/qodeinteractive.com\/magazine\/wp-json\/wp\/v2\/posts\/1895\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/qodeinteractive.com\/magazine\/wp-json\/wp\/v2\/media\/2109"}],"wp:attachment":[{"href":"https:\/\/qodeinteractive.com\/magazine\/wp-json\/wp\/v2\/media?parent=1895"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/qodeinteractive.com\/magazine\/wp-json\/wp\/v2\/categories?post=1895"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/qodeinteractive.com\/magazine\/wp-json\/wp\/v2\/tags?post=1895"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}