HOME  >  HOW TO USE > How to replace and customize headers and footers

How to replace and customize headers and footers

” FullSitePatterner ” provides various block patterns such as headers, footers, buttons and boxes .

Here, we will explain how to replace the header from the theme-specific default setting (header-navbar) to the WordPress default navigation (header-WP-navigation: design is customized) .

Open the page with the header you want to change from the Appearance – Editor menu .
Here it is the ” front page “.

Since it is related to the structure and design of the page, it is better to insert it first and then delete the block before replacement when inserting it in the same hierarchy as before replacement so that mistakes such as display collapse do not occur . I think.

Here, the header after replacement is inserted before the header before replacement .
Since the header before replacement will be deleted eventually, it does not matter whether it is before or after .

When you add a block, an empty paragraph is displayed, and to insert the block pattern here, click the “+” mark on the right side of the paragraph.

You can search for the header to be inserted on the screen above, but if you click the ” Show All ” button for blocks and patterns, the “Blocks” and “Patterns” menu will be displayed on the left.

Theme-specific headers, footers, and other parts can be found under Patterns .
Patterns are categorized by categories such as “header” and “button”.

Select a header category from the drop-down menu and click the thumbnail-displayed header after replacement to insert the block pattern in the location selected with the “+” button earlier .

There is also a header before replacement , so the header is duplicated.

Delete the header before replacement.
To avoid display collapse, it is locked to prohibit movement , but it can be deleted .

Click the three vertical dots to display the menu for operating the block, and there is a “Delete” menu at the bottom .

After deleting the header before replacement, the replacement of the header is completed as shown below.

Click the “Save” button at the top right of the editor screen to insert the block pattern for the entire page and save the replaced template.

View the site and check, the header has changed.
Although it is difficult to understand in the screen below, the hamburger menu displayed on smartphones is particularly different.