The complete code for Twenty Seventeen WordPress theme header.php reveals the inner workings of this popular theme, showcasing how its header.php file controls the layout and functionality of the website’s top section. This guide delves into the core components of header.php, providing a comprehensive understanding of its structure, content, and customization possibilities.
Understanding header.php is crucial for WordPress developers and website owners alike. It lays the foundation for the website’s visual identity, navigation, and search engine optimization (). This file houses essential elements like the website’s title, navigation menu, and logo, all of which contribute to a positive user experience and a strong online presence.
Header.php Overview
In the realm of WordPress themes, header.php stands as a foundational file, acting as the blueprint for your website’s header. This file dictates the structure and content that appears at the top of every page on your website, shaping the visual identity and user experience.
Think of header.php as the head of your website, housing crucial elements like the navigation menu, logo, site title, and other essential components that define the overall look and feel of your site. Its role extends beyond mere aesthetics; it also plays a vital part in (Search Engine Optimization) by providing clear signals to search engines about your website’s content and structure.
Typical Structure and Content
A standard header.php file typically encompasses the following elements, although the specific structure may vary depending on the theme:
- DOCTYPE declaration:Specifies the HTML version used for the document.
- HTML tag:The root element of the HTML document.
- Head section:Contains meta information about the page, including the title, character set, stylesheets, and scripts.
- Body tag:Encloses the visible content of the page, including the header content.
- Header content:Includes elements like the logo, site title, navigation menu, and any other visual components that appear at the top of the page.
Importance for and User Experience, The complete code for twenty seventeen wordpress theme header.php
Header.php plays a crucial role in both and user experience:
- :The
tag within header.php is a key element for search engine optimization. It provides a concise description of the page’s content, which search engines use to understand the page’s relevance to user queries.</li> <li><strong>User Experience:</strong>A well-designed header provides a clear and consistent visual hierarchy, making it easy for users to navigate the website and find the information they need. A well-structured header can enhance usability and contribute to a positive user experience. </li> </ul> <h2><span class="ez-toc-section" id="Key_Components_of_Headerphp_The_Complete_Code_For_Twenty_Seventeen_WordPress_Theme_Headerphp"></span>Key Components of Header.php: The Complete Code For Twenty Seventeen WordPress Theme Header.php<span class="ez-toc-section-end"></span></h2> <p>The header.php file is comprised of several key components that work together to create the website’s header. Understanding these components is essential for customizing and optimizing your header. </p> <h3><span class="ez-toc-section" id="Core_Sections"></span>Core Sections<span class="ez-toc-section-end"></span></h3> <p>Here’s a breakdown of the core sections within header.php: </p> <ul> <li><strong>DOCTYPE Declaration:</strong> <pre><code><!DOCTYPE html></code></pre> <p>This declaration specifies the HTML version used for the document. It ensures that browsers interpret the code correctly. </p> </li> <li><strong>HTML Tag:</strong> <pre><code><html lang="en"></code></pre> <p>The HTML tag is the root element of the HTML document. The “lang” attribute specifies the language of the document, which is important for accessibility and . </p> </li> <li><strong>Head Section:</strong> <pre><code><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>WordPress Theme - Header.php</title> <link rel="stylesheet" href="style.css"> </head></code></pre> <p>The head section contains meta information about the page, including the title, character set, stylesheets, and scripts. It’s crucial for and browser compatibility. </p> </li> <li><strong>Body Tag:</strong> <pre><code><body> </body></code></pre> <p>The body tag encloses the visible content of the page, including the header content. </p> </li> <li><strong>Header Content:</strong> <pre><code><header id="masthead" class="site-header" role="banner"> <div class="site-branding"> <h1 class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home">WordPress Theme</a></h1> </div> <nav id="site-navigation" class="main-navigation" role="navigation"> <button class="menu-toggle" aria-controls="primary-menu" aria-expanded="false"><span class="screen-reader-text">Menu</span></button> <ul id="primary-menu" class="nav-menu"> <li class="menu-item"><a href="#">Home</a></li> <li class="menu-item"><a href="#">About</a></li> <li class="menu-item"><a href="#">Contact</a></li> </ul> </nav> </header> </code></pre> <p>The header content typically includes elements like the logo, site title, navigation menu, and any other visual components that appear at the top of the page.</p> </li> </ul> <h3><span class="ez-toc-section" id="Table_of_Key_Components"></span>Table of Key Components<span class="ez-toc-section-end"></span></h3> <table> <thead> <tr> <th>Component</th> <th>Function</th> </tr> </thead> <tbody> <tr> <td>DOCTYPE Declaration</td> <td>Specifies the HTML version used for the document.</td> </tr> <tr> <td>HTML Tag</td> <td>The root element of the HTML document.</td> </tr> <tr> <td>Head Section</td> <td>Contains meta information about the page, including the title, character set, stylesheets, and scripts.</td> </tr> <tr> <td>Body Tag</td> <td>Encloses the visible content of the page, including the header content.</td> </tr> <tr> <td>Header Content</td> <td>Includes elements like the logo, site title, navigation menu, and any other visual components that appear at the top of the page.</td> </tr> </tbody> </table> <h2><span class="ez-toc-section" id="Headerphp_for_Twenty_Seventeen_Theme"></span>Header.php for Twenty Seventeen Theme<span class="ez-toc-section-end"></span></h2> <p>The Twenty Seventeen theme, a popular and well-designed default WordPress theme, utilizes a structured header.php file that incorporates various features and functionalities. Let’s examine its specific structure and content. </p> <h3><span class="ez-toc-section" id="Structure_and_Content"></span>Structure and Content<span class="ez-toc-section-end"></span></h3> <p>The header.php file in Twenty Seventeen is designed to be flexible and customizable. It features a well-organized structure that separates different components for easier management. The file includes elements like: </p> <ul> <li><strong>DOCTYPE declaration:</strong>Specifies the HTML5 version for the document. </li> <li><strong>HTML tag:</strong>The root element of the HTML document. </li> <li><strong>Head section:</strong>Contains meta information about the page, including the title, character set, stylesheets, and scripts. It also includes links to the theme’s stylesheet and various scripts. </li> <li><strong>Body tag:</strong>Encloses the visible content of the page, including the header content. </li> <li><strong>Header content:</strong>Includes elements like the site branding (logo and site title), navigation menu, and a toggle button for mobile navigation. It also incorporates the use of CSS classes for styling and organization. </li> </ul> <h3><span class="ez-toc-section" id="Comparison_with_a_Generic_WordPress_Theme"></span>Comparison with a Generic WordPress Theme<span class="ez-toc-section-end"></span></h3> <p>Compared to a generic WordPress theme, Twenty Seventeen’s header.php file demonstrates a more advanced approach to structure and functionality. It incorporates features like: </p> <ul> <li><strong>Mobile responsiveness:</strong>The header is designed to adapt seamlessly to different screen sizes, ensuring a consistent user experience across devices. </li> <li><strong>Customizable branding:</strong>The theme allows for easy customization of the site branding, including the logo and site title. </li> <li><strong>Flexible navigation:</strong>The navigation menu can be customized with various options, including dropdowns and submenus. </li> </ul> <h3><span class="ez-toc-section" id="Unique_Features_and_Functionalities"></span>Unique Features and Functionalities<span class="ez-toc-section-end"></span></h3> <p>The Twenty Seventeen theme’s header.php file incorporates several unique features, including: </p> <ul> <li><strong>Custom header image:</strong>The theme allows users to upload a custom header image that appears at the top of the website. </li> <li><strong>Site title and tagline:</strong>The header displays the site title and tagline, which can be customized from the WordPress dashboard. </li> <li><strong>Social media links:</strong>The theme includes a section for displaying links to the website’s social media profiles. </li> </ul> <h2><span class="ez-toc-section" id="Customizing_the_Headerphp_File"></span>Customizing the Header.php File<span class="ez-toc-section-end"></span></h2> <p>Customizing the header.php file is a powerful way to tailor your website’s appearance and functionality to your specific needs. While it’s important to maintain the theme’s core structure and functionality, you can add, remove, or modify elements to achieve your desired look and feel.</p> <h3><span class="ez-toc-section" id="Adding_or_Removing_Elements"></span>Adding or Removing Elements<span class="ez-toc-section-end"></span></h3> <p>To add or remove elements from the header.php file, you can simply modify the HTML code within the header section. For example, to add a new navigation link, you would add an </p> <li>element within the <ul>element that represents the navigation menu. To remove an element, you can simply delete the corresponding HTML code. </p> <h3><span class="ez-toc-section" id="Code_Snippets_for_Common_Customizations"></span>Code Snippets for Common Customizations<span class="ez-toc-section-end"></span></h3> <p>Here are some code snippets for common customizations: </p> <ul> <li><strong>Adding a logo:</strong> <pre><code><div class="site-branding"> <a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"> <img src=" <?php echo get_template_directory_uri(); ?>/images/logo.png" alt="Your Logo" /> </a> </div></code></pre> <p>This code snippet adds an image as the logo to the header. Replace “logo.png” with the actual file name and path of your logo image. </p> </li> <li><strong>Changing the navigation menu:</strong> <pre><code><nav id="site-navigation" class="main-navigation" role="navigation"> <ul id="primary-menu" class="nav-menu"> <li class="menu-item"><a href="#">Home</a></li> <li class="menu-item"><a href="#">About</a></li> <li class="menu-item"><a href="#">Services</a></li> <li class="menu-item"><a href="#">Contact</a></li> </ul> </nav></code></pre> <p>This code snippet modifies the navigation menu to include different links. Replace the existing links with your desired links. </p> </li> </ul> <h3><span class="ez-toc-section" id="Best_Practices_for_Customization"></span>Best Practices for Customization<span class="ez-toc-section-end"></span></h3> <p><img decoding="async" class="aligncenter" src="https://i1.wp.com/codex.wordpress.org/images/0/05/D18juYYcEq.jpg?w=700" alt="The complete code for twenty seventeen wordpress theme header.php" title="Wordpress twenty seventeen codex widgets theme column" /></p> <p>When customizing the header.php file, it’s essential to follow best practices to maintain theme functionality and responsiveness: </p> <ul> <li><strong>Use a child theme:</strong>Always make customizations within a child theme to avoid losing your changes when the parent theme is updated. </li> <li><strong>Maintain the theme’s structure:</strong>Try to maintain the existing structure of the header.php file to ensure compatibility with the theme’s design and functionality. </li> <li><strong>Use valid HTML:</strong>Ensure that your code is valid HTML to prevent errors and ensure proper rendering in browsers. </li> <li><strong>Test thoroughly:</strong>After making changes, test your website thoroughly to ensure that everything works as expected and that the changes are visually appealing. </li> </ul> <h2><span class="ez-toc-section" id="Advanced_Headerphp_Techniques"></span>Advanced Header.php Techniques<span class="ez-toc-section-end"></span></h2> <p>Beyond basic customizations, there are advanced techniques you can employ to enhance your header.php file, unlocking greater control and flexibility. </p> <h3><span class="ez-toc-section" id="Custom_Headers_with_Conditional_Logic"></span>Custom Headers with Conditional Logic<span class="ez-toc-section-end"></span></h3> <p>You can use conditional logic to create custom headers based on different conditions, such as the current page type or user role. This allows you to tailor the header content to specific scenarios. </p> <pre><code><?php if ( is_front_page() ) : ?> <h1>Welcome to our homepage!</h1> <?php else : ?> <h2>This is a regular page</h2> <?php endif; ?></code></pre> <p>This code snippet displays a different heading depending on whether the current page is the homepage or a regular page. </p> <h3><span class="ez-toc-section" id="Custom_Post_Types_and_Headers"></span>Custom Post Types and Headers<span class="ez-toc-section-end"></span></h3> <p>You can create custom post types and associate specific header content with them. This allows you to create unique headers for different types of content on your website. </p> <pre><code><?php if ( is_post_type_archive( 'product' ) ) : ?> <h1>Our Products</h1> <?php else : ?> <h2>This is a regular page</h2> <?php endif; ?></code></pre> <p>This code snippet displays a custom heading for the product archive page. </p> <h3><span class="ez-toc-section" id="Integrating_Third-Party_Plugins_or_Scripts"></span>Integrating Third-Party Plugins or Scripts<span class="ez-toc-section-end"></span></h3> <p><img decoding="async" class="aligncenter" src="https://i1.wp.com/codex.wordpress.org/images/8/8e/DiH4qFyymD.jpg?w=700" alt="Twenty wordpress seventeen layout codex column selected both when" title="Twenty wordpress seventeen layout codex column selected both when" /></p> <p>You can integrate third-party plugins or scripts into the header.php file to add functionality to your website. This can include elements like social sharing buttons, analytics tracking, or custom fonts. </p> <pre><code><script src="https://example.com/plugin.js"></script></code></pre> <p>This code snippet adds a third-party script to the header. Make sure to replace “https://example.com/plugin.js” with the actual URL of the script. </p> <h3><span class="ez-toc-section" id="Impact_on_Site_Performance_and_Security"></span>Impact on Site Performance and Security<span class="ez-toc-section-end"></span></h3> <p>It’s crucial to consider the impact of header.php modifications on site performance and security: </p> <ul> <li><strong>Performance:</strong>Excessive code in the header can slow down your website’s loading time. It’s important to minimize the number of scripts and stylesheets included in the header. </li> <li><strong>Security:</strong>Be cautious when adding external scripts or plugins to the header. Ensure that they are from reputable sources and that you understand their functionality and potential security risks. </li> </ul> <h2><span class="ez-toc-section" id="Closure"></span>Closure<span class="ez-toc-section-end"></span></h2> <p>By mastering the intricacies of the Twenty Seventeen theme’s header.php file, developers and website owners can create a visually appealing and functional website. The knowledge gained from this guide empowers users to customize the header.php file to their specific needs, enhancing the website’s overall design, functionality, and performance.</p> <p>Whether it’s adding a unique logo, modifying the navigation menu, or implementing advanced features, understanding the structure and content of header.php unlocks a world of customization possibilities. </p> <h2><span class="ez-toc-section" id="Frequently_Asked_Questions"></span>Frequently Asked Questions<span class="ez-toc-section-end"></span></h2> <p><strong>What is the purpose of header.php in a WordPress theme?</strong></p> <p>header.php defines the structure and content of the website’s header section, including the logo, navigation menu, and other essential elements that appear at the top of every page. </p> <p><strong>How can I customize the header.php file in the Twenty Seventeen theme?</strong></p> <p>You can customize the header.php file by modifying the code directly or using a child theme to override the default template. This allows you to change the logo, navigation, and other elements within the header. </p> <p><strong>What are some best practices for customizing header.php?</strong></p> <p>Ensure your modifications maintain the theme’s functionality and responsiveness. Use a child theme for customizations to avoid overwriting the original theme files. </p> <div style="clear:both; margin-top:0em; margin-bottom:1em;"><a href="https://bohemiandesign.my.id/grab-taxi-online-taxi-service-wordpress-theme/" target="_blank" rel="dofollow" class="udf2b69fc9e4843af3cb59ffa83860113"><!-- INLINE RELATED POSTS 1/3 //--><style> .udf2b69fc9e4843af3cb59ffa83860113 { padding:0px; margin: 0; padding-top:1em!important; padding-bottom:1em!important; width:100%; display: block; font-weight:bold; background-color:#eaeaea; border:0!important; border-left:4px solid #34495E!important; text-decoration:none; } .udf2b69fc9e4843af3cb59ffa83860113:active, .udf2b69fc9e4843af3cb59ffa83860113:hover { opacity: 1; transition: opacity 250ms; webkit-transition: opacity 250ms; text-decoration:none; } .udf2b69fc9e4843af3cb59ffa83860113 { transition: background-color 250ms; webkit-transition: background-color 250ms; opacity: 1; transition: opacity 250ms; webkit-transition: opacity 250ms; } .udf2b69fc9e4843af3cb59ffa83860113 .ctaText { font-weight:bold; color:#464646; text-decoration:none; font-size: 16px; } .udf2b69fc9e4843af3cb59ffa83860113 .postTitle { color:#000000; text-decoration: underline!important; font-size: 16px; } .udf2b69fc9e4843af3cb59ffa83860113:hover .postTitle { text-decoration: underline!important; } </style><div style="padding-left:1em; padding-right:1em;"><span class="ctaText">See also</span> <span class="postTitle">Grab Taxi- Online Taxi Service WordPress Theme: Building Your Ride-Sharing Platform</span></div></a></div> </div> <footer class="entry-meta" aria-label="Entry meta"> <span class="cat-links"><span class="gp-icon icon-categories"><svg viewBox="0 0 512 512" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em"><path d="M0 112c0-26.51 21.49-48 48-48h110.014a48 48 0 0143.592 27.907l12.349 26.791A16 16 0 00228.486 128H464c26.51 0 48 21.49 48 48v224c0 26.51-21.49 48-48 48H48c-26.51 0-48-21.49-48-48V112z" /></svg></span><span class="screen-reader-text">Categories </span><a href="https://bohemiandesign.my.id/category/wordpress-development/" rel="category tag">WordPress Development</a></span> <span class="tags-links"><span class="gp-icon icon-tags"><svg viewBox="0 0 512 512" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em"><path d="M20 39.5c-8.836 0-16 7.163-16 16v176c0 4.243 1.686 8.313 4.687 11.314l224 224c6.248 6.248 16.378 6.248 22.626 0l176-176c6.244-6.244 6.25-16.364.013-22.615l-223.5-224A15.999 15.999 0 00196.5 39.5H20zm56 96c0-13.255 10.745-24 24-24s24 10.745 24 24-10.745 24-24 24-24-10.745-24-24z"/><path d="M259.515 43.015c4.686-4.687 12.284-4.687 16.97 0l228 228c4.686 4.686 4.686 12.284 0 16.97l-180 180c-4.686 4.687-12.284 4.687-16.97 0-4.686-4.686-4.686-12.284 0-16.97L479.029 279.5 259.515 59.985c-4.686-4.686-4.686-12.284 0-16.97z" /></svg></span><span class="screen-reader-text">Tags </span><a href="https://bohemiandesign.my.id/tag/header-php/" rel="tag">header.php</a>, <a href="https://bohemiandesign.my.id/tag/twenty-seventeen/" rel="tag">Twenty Seventeen</a>, <a href="https://bohemiandesign.my.id/tag/website-customization/" rel="tag">website customization</a>, <a href="https://bohemiandesign.my.id/tag/wordpress-development/" rel="tag">WordPress development</a>, <a href="https://bohemiandesign.my.id/tag/wordpress-theme/" rel="tag">WordPress theme</a></span> <nav id="nav-below" class="post-navigation" aria-label="Posts"> <div class="nav-previous"><span class="gp-icon icon-arrow-left"><svg viewBox="0 0 192 512" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M178.425 138.212c0 2.265-1.133 4.813-2.832 6.512L64.276 256.001l111.317 111.277c1.7 1.7 2.832 4.247 2.832 6.513 0 2.265-1.133 4.813-2.832 6.512L161.43 394.46c-1.7 1.7-4.249 2.832-6.514 2.832-2.266 0-4.816-1.133-6.515-2.832L16.407 262.514c-1.699-1.7-2.832-4.248-2.832-6.513 0-2.265 1.133-4.813 2.832-6.512l131.994-131.947c1.7-1.699 4.249-2.831 6.515-2.831 2.265 0 4.815 1.132 6.514 2.831l14.163 14.157c1.7 1.7 2.832 3.965 2.832 6.513z" fill-rule="nonzero" /></svg></span><span class="prev"><a href="https://bohemiandesign.my.id/install-new-wordpress-site-with-plugins-and-child-theme/" rel="prev">Install New WordPress Site: Plugins & Child Theme</a></span></div><div class="nav-next"><span class="gp-icon icon-arrow-right"><svg viewBox="0 0 192 512" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M178.425 256.001c0 2.266-1.133 4.815-2.832 6.515L43.599 394.509c-1.7 1.7-4.248 2.833-6.514 2.833s-4.816-1.133-6.515-2.833l-14.163-14.162c-1.699-1.7-2.832-3.966-2.832-6.515 0-2.266 1.133-4.815 2.832-6.515l111.317-111.316L16.407 144.685c-1.699-1.7-2.832-4.249-2.832-6.515s1.133-4.815 2.832-6.515l14.163-14.162c1.7-1.7 4.249-2.833 6.515-2.833s4.815 1.133 6.514 2.833l131.994 131.993c1.7 1.7 2.832 4.249 2.832 6.515z" fill-rule="nonzero" /></svg></span><span class="next"><a href="https://bohemiandesign.my.id/wordpress-how-to-enqueue-scripts-in-child-theme-to-override-parent/" rel="next">WordPress: Enqueue Scripts in Child Themes to Override Parent</a></span></div> </nav> </footer> </div> </article> </main> </div> </div> </div> <div class="site-footer"> <footer class="site-info" aria-label="Site" itemtype="https://schema.org/WPFooter" itemscope> <div class="inside-site-info grid-container"> <div class="copyright-bar"> <span class="copyright">© 2024 ThemeVibe</span> • Built with <a href="https://generatepress.com" itemprop="url">GeneratePress</a> </div> </div> </footer> </div> <a title="Scroll back to top" aria-label="Scroll back to top" rel="nofollow" href="#" class="generate-back-to-top" data-scroll-speed="400" data-start-scroll="300"> <span class="gp-icon icon-arrow-up"><svg viewBox="0 0 330 512" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="1.414"><path d="M305.863 314.916c0 2.266-1.133 4.815-2.832 6.514l-14.157 14.163c-1.699 1.7-3.964 2.832-6.513 2.832-2.265 0-4.813-1.133-6.512-2.832L164.572 224.276 53.295 335.593c-1.699 1.7-4.247 2.832-6.512 2.832-2.265 0-4.814-1.133-6.513-2.832L26.113 321.43c-1.699-1.7-2.831-4.248-2.831-6.514s1.132-4.816 2.831-6.515L158.06 176.408c1.699-1.7 4.247-2.833 6.512-2.833 2.265 0 4.814 1.133 6.513 2.833L303.03 308.4c1.7 1.7 2.832 4.249 2.832 6.515z" fill-rule="nonzero" /></svg></span> </a><script id="generate-a11y">!function(){"use strict";if("querySelector"in document&&"addEventListener"in window){var e=document.body;e.addEventListener("mousedown",function(){e.classList.add("using-mouse")}),e.addEventListener("keydown",function(){e.classList.remove("using-mouse")})}}();</script><script id="custom-script-js-extra"> var wpdata = {"object_id":"13018","site_url":"https:\/\/bohemiandesign.my.id"}; </script> <script src="https://bohemiandesign.my.id/wp-content/plugins/wp-meta-and-date-remover/assets/js/inspector.js?ver=1.1" id="custom-script-js"></script> <script id="ez-toc-scroll-scriptjs-js-extra"> var eztoc_smooth_local = {"scroll_offset":"30","add_request_uri":""}; </script> <script src="https://bohemiandesign.my.id/wp-content/plugins/easy-table-of-contents/assets/js/smooth_scroll.min.js?ver=2.0.68.1" id="ez-toc-scroll-scriptjs-js"></script> <script src="https://bohemiandesign.my.id/wp-content/plugins/easy-table-of-contents/vendor/js-cookie/js.cookie.min.js?ver=2.2.1" id="ez-toc-js-cookie-js"></script> <script src="https://bohemiandesign.my.id/wp-content/plugins/easy-table-of-contents/vendor/sticky-kit/jquery.sticky-kit.min.js?ver=1.9.2" id="ez-toc-jquery-sticky-kit-js"></script> <script id="ez-toc-js-js-extra"> var ezTOC = {"smooth_scroll":"1","visibility_hide_by_default":"","scroll_offset":"30","fallbackIcon":"<span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span>","chamomile_theme_is_on":""}; </script> <script src="https://bohemiandesign.my.id/wp-content/plugins/easy-table-of-contents/assets/js/front.min.js?ver=2.0.68.1-1724072788" id="ez-toc-js-js"></script> <!--[if lte IE 11]> <script src="https://bohemiandesign.my.id/wp-content/themes/generatepress/assets/js/classList.min.js?ver=3.4.0" id="generate-classlist-js"></script> <![endif]--> <script id="generate-menu-js-extra"> var generatepressMenu = {"toggleOpenedSubMenus":"1","openSubMenuLabel":"Open Sub-Menu","closeSubMenuLabel":"Close Sub-Menu"}; </script> <script src="https://bohemiandesign.my.id/wp-content/themes/generatepress/assets/js/menu.min.js?ver=3.4.0" id="generate-menu-js"></script> <script id="generate-back-to-top-js-extra"> var generatepressBackToTop = {"smooth":"1"}; </script> <script src="https://bohemiandesign.my.id/wp-content/themes/generatepress/assets/js/back-to-top.min.js?ver=3.4.0" id="generate-back-to-top-js"></script> </body> </html> <!-- Page cached by LiteSpeed Cache 6.5.0.1 on 2024-12-10 01:13:26 -->