Our Partner & Developer boards on the community are moving to a brand new home: the .dev community forums! While you can still access past discussions here, for all your future app and storefront building questions, head over to the new forums.

How to limit app block and app embed block to specific product pages?

How to limit app block and app embed block to specific product pages?

hacun3jr
Shopify Partner
23 2 19

Hello,

 

I am working with theme app extension. I have an app block and an app embed block, and I want to give users the ability to limit the visibility of these blocks to specific product pages and collections if they want.

 

Looking through the docs, I notice that thereis an enabled_on option and an available_if option using app metafields, but I dont understand the logic with those on how to limit the blocks to specific product or collection pages.

 

I can see how they could be limited based on billing plan or subscription, but how or where to add the logic to check if the product page is a specific one that shouldnt show the app blocks? Thank you.

Replies 2 (2)

Liam
Community Manager
3108 342 884

The enabled_on and available_if attributes in the schema of your app blocks can indeed be used to control the visibility of these blocks. However, limiting visibility to specific product or collection pages would require a different approach.

 

The enabled_on attribute only controls the templates and section groups where the app block can be used, but it does not provide granular control over individual pages. The available_if attribute, on the other hand, works with app-data metafields to control the visibility of your blocks. However, it's important to note that these metafields are tied to the entire app, not specific pages or collections.

 

To control visibility on a per-page basis, you could possibly leverage Liquid and specifically conditional tags. You could build a condition that checks the page.title, page.id, or product.handle Liquid objects, and renders your app block when the conditions are met. 

 

Liam | Developer Advocate @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit Shopify.dev or the Shopify Web Design and Development Blog

Jahid-KlinKode
Excursionist
145 1 5

Hey @hacun3jr, check out this YouTube tutorial for a step-by-step guide on creating a Members-Only Store on Shopify: