Hide home page sections on mobile

Solved

Hide home page sections on mobile

VSom
Excursionist
12 0 5

Dear expert community,

 

I would like to find a way to hide the gift card section on my home page when people are visiting the website on Mobile : www.joyamada.com

 

I have looked into posted topics without finding my way around - would you know how to fix this ?

 

many thanks ahead !

Vanina

Accepted Solution (1)

Tech_Coding
Shopify Partner
514 132 131

This is an accepted solution.

Hello @VSom 

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
@media screen and (max-width:767px){
     section#shopify-section-template--14720616595505__featured_product_4GeqLW {
        display: none !important;
     }
}
</style>
my reply helpful? Click Like to let me know!
your question answered? Mark it as an Accepted Solution.

my reply helpful? Click Like to let me know!
your question answered? Mark it as an Accepted Solution.
Shopify UI Developer
Your Coffee Tips adds a little sweetness to my day.

View solution in original post

Replies 4 (4)

topnewyork
Astronaut
1130 151 189

@VSom  Hi
1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file
3. In theme.liquid, paste the below code before </head>

 

<style>
 @media (max-width: 768px){
.section-spacing.color-scheme.up-background-picto.up-no-sticky {
    display: none !important;
}
}
</style>

 

If my reply is helpful, kindly click like and mark it as an accepted solution.
Thanks!

Need a Shopify developer? Hire us at Top New York Web Design
Boost Your Store Sales with Volume/Tier Discount Try Big Bulk Discount
Create New Shopify Store For Just 1$/Month

Tech_Coding
Shopify Partner
514 132 131

This is an accepted solution.

Hello @VSom 

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
@media screen and (max-width:767px){
     section#shopify-section-template--14720616595505__featured_product_4GeqLW {
        display: none !important;
     }
}
</style>
my reply helpful? Click Like to let me know!
your question answered? Mark it as an Accepted Solution.

my reply helpful? Click Like to let me know!
your question answered? Mark it as an Accepted Solution.
Shopify UI Developer
Your Coffee Tips adds a little sweetness to my day.

Natasha-Saed
Shopify Partner
460 50 86

Hello,

 

Go To Online store then chose edit code open your theme.css file and paste the following code at the end and save.

 

@media only screen and (max-width: 768px) {

#shopify-section-template--14720616595505__featured_product_4GeqLW {display: none;}

}

If my solution helped you don't forget to accept it to help others.
===================================================================
And if you really like my support share a cup of coffee with me paypal.me/freemindsint

dws_pvt_ltd
Shopify Partner
368 69 87

Hello @VSom ! Please follow these steps to add this CSS code:
1. Go to your Online Store
2. Click on "Themes"
3. Select "Edit code"
4. Open your section file. If you have a custom CSS file, open that instead.
5. If you can't find your custom CSS file, open base.css" OR "theme.css".
6. Add the following code at the end of the file.

 

@media screen and (min-width: 768px) {
	section.shopify-section.shopify-section--up-featured-product-with-bg {
		display: none;
	}
}

 

Feel free to reach out if you have any questions or need assistance.
Best Regards,
DWS.

Helpful? then please Like and Accept the Solution.
For any inquiries, please feel free to contact via WhatsApp and Email: sales@dolphinwebsolution.com.
For more information visit our website Dolphin Web Solution Pvt Ltd.