Discuss and resolve questions on Liquid, JavaScript, themes, sales channels, and site speed enhancements.
Hi,
I have 4 questions:
1) How can I align the location of the logo on desktop and mobile, so that the word SKALL is in the same line as menu items?
2) On the mobile, is this possible to break the heading text on the Slide so that its shows like:
"Elevate Your Table Decor
With Premium Ceramics"
3) How can I have a different size of the font of the Heading Slide text on a mobile and on a desktop?
4) How can I make sure that full picture is displayed on a Slide in both versions Mobile and Desktop? Currently Slide focuses only on a specific area of the picture.
I will appreciate all the hints.
The link to the page: https://feacd2-2b.myshopify.com/
Thanks!
Solved! Go to the solution
This is an accepted solution.
Hi @MateusSkall
Dan here from Ryviu: Product Reviews & QA app.
1. You can do that by adding this code to your theme.liquid file, after <head>
<style>
.header__heading-logo {
margin-botton: 30px;
}
</style>
2. add this code before </style> of above code in 1.
@media (max-width: 749px) {
.slideshow__text .banner__heading {
max-width: 255px !imporrtant;
}
}
3. You CSS on 2. to add font size for mobile
font-size: 24px !important;
- Solved it? Hit Like and Accept solution! ❤️Buy Me Coffee❤️
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.
This is an accepted solution.
It is caused by my code to center your logo.
<style>
.header__heading-logo {
margin-botton: 30px;
}
</style>
You can solve it by resize your logo, removing white space at the top and adding some more space at the bottom, removing my above code, upload the logo again
- Solved it? Hit Like and Accept solution! ❤️Buy Me Coffee❤️
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.
This is an accepted solution.
Hi @MateusSkall
Dan here from Ryviu: Product Reviews & QA app.
1. You can do that by adding this code to your theme.liquid file, after <head>
<style>
.header__heading-logo {
margin-botton: 30px;
}
</style>
2. add this code before </style> of above code in 1.
@media (max-width: 749px) {
.slideshow__text .banner__heading {
max-width: 255px !imporrtant;
}
}
3. You CSS on 2. to add font size for mobile
font-size: 24px !important;
- Solved it? Hit Like and Accept solution! ❤️Buy Me Coffee❤️
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.
Hi @Dan-From-Ryviu thanks it worked. Can I have one more question on how to remove this unnaturally high break between the logo and the slides?
This is an accepted solution.
It is caused by my code to center your logo.
<style>
.header__heading-logo {
margin-botton: 30px;
}
</style>
You can solve it by resize your logo, removing white space at the top and adding some more space at the bottom, removing my above code, upload the logo again
- Solved it? Hit Like and Accept solution! ❤️Buy Me Coffee❤️
- Reton: Loyalty & Rewards - Earn points through tasks, redeem for discounts, and enjoy exclusive VIP rewards!
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.
Thanks!
2m ago Learn the essential skills to navigate the Shopify admin with confidence. T...
By Shopify Feb 12, 2025Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025