Helpful Tips Shown Below
1. How to Add a Custom Logo
2. How to Change the Color of a Logo
3. How to Make Navigation Menu Collapsible
4. How to Change a Headers Primary Color
5. How to Change a Secondary Color
6. How to Change a Scale of Your Logo
7. How to Change the Social Media Icons
8. How to Delete a One/All Social Media Link(s)
9. How to Delete Any Element in the Header
1. How to Add a Custom Logo
Walk through
1. Hover over the logo in the header block, once the logo becomes highlighted select the logo.
2. When prompted with block options, select the “Edit Content” (pencil) option that appears attached to the highlighted box.
3. You will then be taken to the Global Settings>Basic Info window.
4. Click the “Select File” box to the right-hand side of the logo field.
5. Once the “File Manager” appears, select the logo you wish place on your "Header.”
6. Click the “Save” button, then you will be prompted with a message that reads. “Success, Settings Saved.” Which will ensure your changes have been saved.
7. After, select the “Close” option located to the top right of your screen.
Note: If you new logo does not appear in place of the existing, simply refresh the screen and it will appear as it should.
2. How to Change the Color of a Logo
Walk through
1. Hover over the bottom left-hand side of the header block, once the entirety of the block becomes highlighted select the block.
2. When prompted with block options, select the “Element Settings” (gear) option that appears attached to the highlighted box.
3. Select the “Navigation Logo” tab.
4. You may then choose from our three logo options, default, white, or black.
5. After your selection, be sure to click on the red “Apply” button towards the bottom of your screen. This will ensure your changes have been saved.
3. How to Make Navigation Menu Collapsible
Walk through
1. Hover over the bottom left-hand side of the header block, once the entirety of the block becomes highlighted select the block.
2. When prompted with block options, select the “Element Settings” (gear) option that appears attached to the highlighted box.
3. Select the “Navigation Collapse” tab.
4. Then select the “Always Collapse” option.
5. After your selection, be sure to click on the red “Apply” button towards the bottom of your screen. This will ensure your changes have been saved.
4. How to Change a Header's Primary Color
Walk through
1. Hover over the bottom left-hand side of the header block, once the entirety of the block becomes highlighted select the block.
2. When prompted with block options, select the “Element Settings” (gear) option that appears attached to the highlighted box.
3. Select the “Navigation Color Options” tab.
4. Then select the color your wish to use (colors are based upon the colors you selected in the “Global Settings” menu).
5. After your selection, be sure to click on the red “Apply” button towards the bottom of your screen. This will ensure your changes have been saved.
5. How to Change a Header's Secondary Color
Walk through
1. Hover over the section where your company’s phone number and social media icons appear, once the entirety of the block becomes highlighted select the block.
2. When prompted with block options, select the “Element Settings” (gear) option that appears attached to the highlighted box.
3. Select the “Background Color Options” tab.
4. Then select the color your wish to use (colors are based upon the colors you selected in the “Global Settings” menu).
5. After your selection, be sure to click on the red “Apply” button towards the bottom of your screen. This will ensure your changes have been saved.
6. How to Change a Scale of Your Logo
Walk through
1. Hover over the bottom left-hand side of the header block, once the entirety of the block becomes highlighted select the block.
2. When prompted with block options, select the “Element Settings” (gear) option that appears attached to the highlighted box.
3. Select the “Image Height Options” tab.
4. Then select the scale your wish to use for your logo.
5. After your selection, be sure to click on the red “Apply” button towards the bottom of your screen. This will ensure your changes have been saved.
7. How to Change the Social Media Icon's
Walk through
1. Hover over the social media icon you wish to replace in the header block, once the icon becomes highlighted select it.
2. When prompted with block options, select the “Edit Content” (pencil) option that appears attached to the highlighted box.
3. You will then notice a new window pop up, which is where you may scroll down and select one of the many icons we offer within our library.
4. After you make your selection, click the "Save" button to the lower right-hand side of the select icons window.
5. After you have saved in the select icon window, be sure to "Save" your changes in the visual builder screen as well.
8. How to Delete a One/All Social Media Link(s)
Walk through
1. Hover over the social media icon you wish to "Delete" in the header block, once the icon becomes highlighted select it. If you wish to delete all the social media links, hover over until the entirety of the links are highlighted, then select.
2. When prompted with block options, select the “Trash Element” (trash can) option that appears attached to the highlighted box.
3. Be sure to "Save" your changes in the visual builder screen once complete.
9. How to Delete Any Element in the Header
Walk through
1. Hover over the element you wish to "Delete" in the header block. Once that element is highlighted, select it.
2. After your block editor options appear, select the "Trash Element" (trash can) option and that portion of the block will be deleted.
3. If you are satisfied with what you've deleted, be sure to "Save" your changes in the visual builder screen once complete.
Note: If by chance you are unsatisfied with the elements you have deleted, "Refresh" your browser to return your header to its original display.