Topic summary
A user seeks to reposition a slideshow heading and “shop now” button to the bottom right on desktop only, and change header menu colors from black to white when scrolling.
Solutions Provided:
- Moeed: Suggested adding custom code to theme.liquid file above the
</body>tag (specific code implementation shown in screenshot) - Dan-From-Ryviu: Recommended adding CSS to the Slideshow section’s Custom CSS using
justify-content: flex-endfor screens 750px+ - namphan: Proposed modifying base.css with padding-left adjustment for desktop; noted that changing header text color would create visibility issues when hovering due to matching background colors
Current Status:
The user confirmed one solution works but requests further adjustment to move the elements even lower vertically. The discussion remains open with this additional positioning request pending.
Need if possible to move the heading and button more to the bottom right and is there a way to change the main menu “Home,Hoodies,Contact” and the right icons “more, account,cart icons” from black font to white when scrolling down for both desktop and mobile? Please let me know if possible thanks
1 Like
Hey @Degain
Follow these Steps:
-
Go to Online Store
-
Edit Code
-
Find theme.liquid file
-
Add the following code in the bottom of the file above tag
RESULT:
If I managed to solve your problem then, don’t forget to Like it and Mark it as Solution!
Best Regards,
Moeed
Hi @Degain
You can do that by adding this code to Custom CSS of Slideshow section.
@media (min-width: 750px) {
.slideshow__text-wrapper { justify-content: flex-end; }
}
Hi @Degain ,
1: For slideshow: Please go to Actions > Edit code > Assets > base.css file and paste this at the bottom of the file:
@media screen and (min-width: 750px) {
.slideshow__text-wrapper.banner__content {
padding-left: 10rem !important;
}
}
2: For header: I tested and if you change it, when hovering the header background will be the same color as the text and you can’t see it.
Please let me know.
