Shopify themes, liquid, logos, and UX
Hello, im looking for help on how I can create a sticky header for my theme with transparent logo.
my theme is fashionopolism.
Hi @Elliot7 ,
This is Henry at PageFly - Shopify Advanced Page Builder app.
You can try this code by following these steps:
Go to Online store => themes => actions => edit code and add this code on file theme.liquid before tag </body>
<style>
#nav {
background: transparent;
}
</style>
Hope this answer helps.
Best regards,
Henry | PageFly
Please let me know if it works by giving it a Like or marking it as a solution!
PageFly - #1 Page Builder for Shopify merchants.
All features are available from Free plan. Live Chat Support is available 24/7.
Locate the header section: Look for the header section in the theme files. Typically, it can be found in the "header.liquid" or "header-section.liquid" file within the "Sections" or "Snippets" folder.
Create a sticky header: To make the header sticky, add the following CSS code to the appropriate place within the header section:
/* Make the header sticky */
.site-header {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 1000;
background-color: #fff; /* Replace with your desired background color */
/* Add any additional styling for the sticky header */
}
/* Add spacing to the content below the sticky header */
body {
padding-top: 100px; /* Adjust the value to match the height of your sticky header */
}
As 2024 wraps up, the dropshipping landscape is already shifting towards 2025's trends....
By JasonH Nov 27, 2024Hey Community! It’s time to share some appreciation and celebrate what we have accomplis...
By JasonH Nov 14, 2024In today’s interview, we sat down with @BSS-Commerce to discuss practical strategies f...
By JasonH Nov 13, 2024