Shock Theme has useful functions for displaying the logo in different situations, such as at the top of the site, when scrolling down the page sticky header and in responsive mode, visible on mobile. In the footer there is a simple logo block, where there is no toggle function.
Note that the
<img> tag has different locations for you to type the URL of the respective files:
You can add text in front of the logo image with the logo-after-text element, or if you don't have a logo image, remove everything and just keep the site-title element which by default is commented out as example.
<a class="navbar-brand" href="/"> <!-- <div class="site-title">Site Title</div> --> <img src="assets/images/logo-white.svg" data-logo-alt="assets/images/logo-white.svg" data-logo-mobile="assets/images/logo-white.svg" alt="Shock Theme" class="logo" /> <span class="logo-after-text">SHOCK</span> </a>
If your logo stays the same in all situations, just replicate the same URL and that will work fine. Removing the attributes from the
<img> tag will cause console errors.