Remove section for mobile

Store Design
,

Topic summary

A user seeks help removing the tag section from their blog/recipe pages on mobile devices only. Their Shopify store is on a development domain (d55d0b-08.myshopify.com).

Solutions Proposed:

Multiple respondents offered CSS-based solutions:

  • Option 1: Add CSS to the critical.css file targeting .blog_sidebar .sticky.top-30 >div:nth-child(3) with display: none !important

  • Option 2: Use Shopify’s Theme Settings > Custom CSS section with a media query approach: @media screen and (max-width: 768px) targeting .blog-grid-container .blog_sidebar .sticky.top-30 > div:nth-child(3) with display: none

Both solutions use CSS to hide the third child element within the blog sidebar’s sticky container. The second approach specifically limits the change to mobile viewports (768px and below), which better addresses the mobile-only requirement.

Screenshots were provided showing implementation steps and expected results. The discussion remains open pending confirmation from the original poster.

Summarized with AI on November 4. AI used: claude-sonnet-4-5-20250929.
1

Hi, can anyone help me remove only the tag section from my recipes/blog age from mobile ?
thank you !

Here is the page: https://d55d0b-08.myshopify.com/blogs/rezepte

Daniel19901_0-1730905413391.png
Daniel19901_0-1730905413391.png507Ă—538 9.22 KB

2

@Daniel19901 which one

3

Hello @Daniel19901 ,

Follow these steps:

  1. Go to Online Store → Theme → Edit code

  2. Open your critical.css file and paste the following code at the bottom:

.blog_sidebar .sticky.top-30 >div:nth-child(3) {
    display: none !important;
}

If problem solved don’t forget to Like it and Mark it as Solution!
And if you need help with customization/code part you can contact me for services

You can find the email in the signature below.

Thanks

1 Like
4

Hi @Daniel19901

To complete your requests, please follow these steps:

  1. Go to Shopify Admin > Online Store > Theme > Customize > Theme Settings > Custom CSS https://prnt.sc/i8ljAMlHJUKl
  2. Paste the code provided into the Custom CSS section.
@media screen and (max-width: 768px){
.blog-grid-container .blog_sidebar .sticky.top-30 >div:nth-child(3) {
    display: none;
}
}

Here is the result: https://prnt.sc/Xo7kijQTNsqU

I hope this helps

Best,

Daisy

1 Like