{"id":321,"date":"2022-11-18T01:35:26","date_gmt":"2022-11-18T01:35:26","guid":{"rendered":"https:\/\/loftocean.com\/doc\/patiotime\/?post_type=ptkb&p=321"},"modified":"2022-11-25T08:39:38","modified_gmt":"2022-11-25T08:39:38","slug":"create-a-new-site-header","status":"publish","type":"ptkb","link":"https:\/\/loftocean.com\/doc\/patiotime\/ptkb\/create-a-new-site-header\/","title":{"rendered":"Create a new site header"},"content":{"rendered":"\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\t\t\t\t

Create a new site header<\/h4>
  1. After installing and activating\u00a0PatioTime Core<\/strong>\u00a0&\u00a0Elementor<\/strong>, please navigate to\u00a0Dashboard<\/strong>\u00a0>\u00a0Header Builder<\/strong>. There you can see the list of all the site header created. You can create, delete, duplicate, and edit the site headers. To set one of them to be the global site header, please open the WordPress customizer and navigate to\u00a0Site Header > Header<\/strong>.\"\"<\/a><\/li>
  2. After the initial installation of the theme, if you did not import the demo, there will be a “Sample Site Header” on this page. It will help you work quickly. You can edit this header directly, or copy one and edit it, or simply create a brand new one.\"\"<\/a><\/li>
  3. When editing a site header with Elementor, in the left sidebar, you will find\u00a0PatioTime Elements<\/strong>. Here you can find common elements in the site header of a website, such as\u00a0Site Logo<\/span>,\u00a0Navigation Menu<\/span>,\u00a0Mini Cart<\/span>, etc.\"\"<\/a><\/li><\/ol>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t
    \n\t\t\t\t
    \n\t\t\t\t\t\t\t
    \n\t\t\t\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t
    \n\t\t\t\t
    \n\t\t\t\t\t\t\t\t\t

    Quickly create a new site header with PatioTime Library<\/h4>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t
    \n\t\t\t\t
    \n\t\t\t\t\t\t\t
    \n\t\t\t
    <\/div>\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t
    \n\t\t\t\t
    \n\t\t\t\t\t\t\t\t\t
    1. Navigate to Dashboard<\/strong>\u00a0>\u00a0Header Builder<\/strong>, click the “Add New” button. Enter a name of this new site header and then edit with Elementor.<\/li>
    2. In the Elementor editor, please open the “PatioTime Template Library<\/strong>” and navigate to “Block<\/strong>” > “Site<\/strong> Headers<\/strong>“.<\/li>
    3. Select a pre-made site header and insert it to the content area. Then you can start editing each element.<\/li><\/ol>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t
      \n\t\t\t\t
      \n\t\t\t\t\t\t\t\t\tEach pre-made site header includes responsive styles<\/strong>. For example, as you can see from this video, after adding this site header, there are 3 sections on the page. But in preview, only the first and second sections are displayed in desktop mode, and only the third section is displayed in tablet and mobile modes. This is achieved by adjusting the Responsive Visibility<\/strong> of each element (choose to\u00a0Show\u00a0<\/strong>\/\u00a0Hide<\/strong> an element according to the device). For more details, please read the following tutorial.\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t
      \n\t\t\t\t
      \n\t\t\t\t\t\n