Can I use script tags to identify sections from templates?

AnEpicName
Tourist
8 1 0

Hi everyone,

 

I'm developing an App in which I intend to add a button to toggle an AR view of a product. But I don't know if there's a standard between the Shopify templates. For example, if I get the div where the description of a product is in one of the free templates by its id or whatever, can I assume that I will find that same id in another template? 

 

Thanks!

0 Likes
mkamalkayani
Explorer
65 5 5

Hi,

yes, every section has a unique id that is injected by the liquid renderer.

For example, for a section named as "slideshow", its rendered html would be:

<div id="shopify-section-slideshow" >
     // other section code
</div>

 
You can find this detail in the shopify docs.

0 Likes
AnEpicName
Tourist
8 1 0

Hi,

Thanks for the answer, but I forgot to mention that I'm working with Script Tags and I want to identify a specific html section no matter the template... I was checking out random stores using Shopify and it seems that there's no standard in the section naming in ids or classes. Some of them are capitalized, others use underscores or hyphens, etc. So I'm not sure if your example works for every case.

I'm new with Script Tags so I'm still learning how all this works...

0 Likes
mkamalkayani
Explorer
65 5 5

Yes, the section name would be theme dependent.

You can use an attribute selector e.g `div[id*="shopify-section"]` to select all the sections in the DOM whose id contains the word "shopify-section". 

0 Likes