Shopify theme app extension pass the data one block to other app block

Technical Q&A
1

hi everyone i am building the app extension.

i have two block. one was target with head and second was target with body.

i need to pass the data head target block to body element those data variable come from the schema



{% schema %}
{
"name": "Enable app ",
"target": "head", 
"settings": [

{
"type":"text",
"id":"myga_id",
"label":"Google  id "
}
]
}
{% endschema %}
2

Hi @Anonymous !
Could you provide more details?
What are these blocks? Are there sections, snippets, or simple HTML code?

Potentially you can put your head block into a variable with {% caption %} and use this variable in your body block. In some cases it is work but more details are needed.

3

@Andrei_Kuchuk i have theme app extension/ block/ i have two files
app-embed.liquid

app-embed-body.liquid

i need access app-embed.liquid variable to app-embed-body .liquid

“myga_id” i need access globally my all blocks

{% assign gl_a_id = block.settings.myga_id %}

gl_a_id i want to access every blocks files

4

Extention app blocks seem like Shopify theme settings blocks, so we can’t take a body block and put them into the head block.

But you can save your data in the page context.

As I understand the blocks can’t use Shopify page context and we can’t use a liquid variables outside the blocks.
But we can use js window object in both of them.

One way that I can see is a save settings ids in js variable.

Just for example, head block:


....

{% schema %}
...
{% endschema %}

And use this variable inside the body block.

This way is hack-like, pretty complicated, and unstable, but if you always know that bout of blocks will use only together - it can help.

Also, we can use js browser API (localstorage) to communicate between two different sections, but this way also has restrictions.

1 Like
5

@Andrei_Kuchuk i did the solution but

{% if block.settings.myga_id %}
  widnow.my_custom_block_ids.push('{{block.settings.myga_id}}')
{% endif %}

but still i am not getting windows object data into other blocks

6

i did with let js variable

{% assign my_var = block.settings.block_id %}
 {% if my_var %}
   let my_var_js = "{{ my_var }}";
 {% endif %}
1 Like
7

If you want to pass data from one block to another, create a common js file in your assets, then add “javascript” to schema, where you will declare the common-file

for example:
in assets: common-file.js
then in each block:
–Block A–

{% schema %}
{
"name": "Block A",
"target": "section",
"javascript": "common-file.js",
"settings": []
}
{% endschema %}

–Block B–

{% schema %}
{
"name": "Block B",
"target": "body",
"javascript": "common-file.js",
"settings": []
}
{% endschema %}

Cheers

1 Like