Why does my section ID keep changing in Shopify?

[KhallP]

I’m trying to hide a section in Shopify only on the computer by ID, it happens that after some time the ID of the section changes, is there any way for the ID to stay the same forever?

My code before changing the id:

@media(min-width:767px){
        #shopify-section-template--19645135487325__multicolumn_WjzVFL{
        display:none !important
        }
    }    

[PageFly-Richard]

Hi @KhallP ,
This is Richard from PageFly - Shopify Page Builder App.

The section id changes because this is a dynamic element. Will change when the theme is published. You need to set the class so you can keep the CSS

Best regards,
Richard | PageFly

[KhallP]

In a simple way, could you explain to me how to do this?

[niraj_patel]

Hello @KhallP

If you’re trying to hide a section on desktop only, you can use media queries based on the screen width, and you can also use classes or other selectors that are less likely to change.

Here’s an example of how you can modify your code:

css:
@media only screen and (min-width: 767px) {
.your-section-class {
display: none !important;
}
}
Replace “your-section-class” with the actual class of the section you want to hide. If your section doesn’t have a class, you might need to inspect the HTML code and find a more stable selector.

[KhallP]

Not working, my section class is “shopify-section section”:

In my code I put it like this:

```markup
@media (min-width: 767px) {
        .shopify-section section{
        display: none !important;
        }
    }

[niraj_patel]

Try this code
@media screen and (min-width:767px){

.shopify-section section{

display: none !important;

}

}

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

[KhallP]

still not working

[KhallP]

for some reason when I enter the code the only selection that disappears is the entire section of the products page

[niraj_patel]

It happed because this class used multipule time’s in section.

[KhallP]

How can I resolve this?

[KhallP]

something is happening in my store, when I enter the code to hide the staked product section from the desktop nothing happens:

@media screen and(min-width:767px){
      .shopify-section section section-featured-product{
      display:none !important
      }
    }