Dynamic Data On App Embed Block

[ammi1378]

Hi there. i'm new to shopify development and trying to learn and understand the platform.

i came up with a question and i wasn't able to find an answer for that.

right now i',m trying to build something like quicky (just for practicing) which is a announcement bar banner. 

you can make different banners. say one of them is enabled for product page and another is enabled for home page. each one has different settings value. the product page and home page banners has different messages/backgrounds/... which i think is stored in a database outside of shopify.

my question is "how different pages can have different data of the same embedded app theme?"

as far as i researched it is not possible to have a dynamic schema to inject your desired dynamic data there. so how this plugin is able to distinguish between pages and show different message according to their page url?

and one final piece of a question. i want to show a message (on the bar banner) in products page where all products show the same message ("welcome to product page") but with two exceptions. product "a" shows "hello happy customer" and product "b" shows "hello amazing customer". how can i achieve that with this assumption those messages are hosted on my database and should be retrieved via my api?

[Liam]

Hi Ammi1378,

You could use Liquid's conditional tags and Liquid objects to identify which page a customer is currently on. Shopify provides a number of page-specific Liquid objects, such as product, collection, blog, article, page and search that you could use to identify the current page.

For example, you could use the product Liquid object to check the current product's title or handle and then use this information to fetch the appropriate message your database. For example, you could have a condition in your code that if the product's title is "a" or "b" and then make a request to your API to fetch the appropriate message.

Here's a basic example of how you could use Liquid objects to identify the current page and display a different message for different products:

{% if product %}
  {% if product.title == 'a' %}
    <div class="announcement-bar">Hello happy customer</div>
  {% elif product.title == 'b' %}
    <div class="announcement-bar">Hello amazing customer</div>
  {% else %}
    <div class="announcement-bar">Welcome to product page</div>
  {% endif %}
{% elsif collection %}
  <div class="announcement-bar">Welcome to collection page</div>
{% else %}
  <div class="announcement-bar">Welcome to home page</div>
{% endif %}

Hope this helps!