What I am trying to do:
I am trying to create an app that inserts content to the merchant's product page.
It appears that an app extension into the merchant's Online Store is the most effective way to do this (see https://shopify.dev/docs/app-extensions/extension-areas#online-store/).
In order to display the content, I am trying to use either a snippet or a section. However, I cannot get either of them to work properly.
I have taken these steps for the snippet:
I have enabled Online store as an extension area within my app (see https://shopify.dev/tutorials/add-a-new-app-extension)
With the Online store extension enabled, I have created a new snippet and a new section with very basic liquid code <h2>{{ product.title }}</h2>
I have enabled my app into a test store on my Shopify Partner account
I have added the {% render 'shopify://apps/etc... %} code into the correct position within the product page
Problem:
The content is not rendered
I have even tried this with the Sections Compatible version of the Debut template (see https://shopify.dev/tutorials/develop-theme-get-started-with-online-store-design-experience). Still nothing.
Is someone able to point me in the right direction here?
Related
I'm fairly new to liquid and Shopify development, but I'm making my way through. I've hit a snag where it seems like what I want to accomplish isn't possible. I'm making a static article page that's primarily HTML, but scattered throughout, I'd like to include instances of a relevant "You Might Like" section to display products.
<HTML>
{% section 'youMightLike' %}
<HTML>
{% section 'youMightLike' %}
I've tried adding a "presets" in the schema tag, and while that allows my section code to be placed anywhere on the homepage and function the way I think it should, my static page only allows for one collection to be chosen (which is then applied to every section on the page).
I've also tried adding blocks to the schema so I could just choose the collection in the block, but that seems to consolidate all the {% section 'youMightLike' %} lines across my entire page.
Am I thinking about this the right way, or is there something else I should be looking into?
Provided your theme is Online Store 2.0 capable, all you need is a unique page template and then you can just add whatever sections are necessary via the customizer.
If it's just a general page or what have you, break your HTML into a section or sections you can include on the page and then you can move around as needed https://shopify.dev/themes/architecture/sections
If your theme isn't 2.0 capable, then you can just create additional sections by modifying them slightly so they're unique. Just copy the section and then modify the name somehow so it's not the same.
I'm using shopify which allows a dynamic section on the home page to show 3 blog posts however this only appears on the homepage.
I would like to add the featured blog section that’s used on my Shopify home page, in the bottom of the Blog article template
I have added the {% section ‘featured-blog’ %} to the article.liquid template below {% section ‘article-template’ %} and it displays the 3 blog items but with dummy text and images, it can’t seem to get my actual blog posts? I must be missing something to get the actual blog content but I cant seem to figure it out!
Any ideas or help would be very very appreciated!
Output gets dummy text instead of my blog posts
All is good in your world! You need to navigate to an Article that is assigned to that template within your theme settings panel. Configuration settings for the Index (home page) and that Article template are distinct. It is awaiting your input and currently showing the default fallbacks.
I check this and it wasn't the same as my question:
Editing JSON data from within a shopify liquid page
Currently I have a file settings_data.json in my theme. This file has a specific field called "product_form_style" there is a specific field I need to edit here from one product template titled: product_custom_liquid
According to some scarce resource I read this would work:
{% settings.product_form_style == 'my value' %}
This however gives an error: "Liquid syntax error: Unknown tag 'settings'"
The official documentation says I can access it with ajax or jquery from js however it doesn't give any examples. It only says it can be done but I have no idea how.
The basic idea is if product template is 'product_custom' then change settings product_form_style == true.
Obviously the above is not correct syntax. Just an example.
You can't modify the settings_data.json from the front-end without using an APP.
If you could modify it without any authentication this would have been a huge security issue and anyone could modify it.
settings_data.json is modified only when you save something in your Customize panel. For any other way you will need a Private app or some App to do so.
In addition you can't modify files in any way from the liquid code as well. The liquid template language only outputs data, it can't modify that data without the use of some kind of an APP.
I was wondering if it's possible to target /app/ pages using liquid flow controls?
I'm trying to exclude a particular element from showing up on one of our app pages. The app page uses our layout/theme.liquid file when it loads. Wondering if there's a way I can set a condition to look for app based pages like we do for other template/page conditions like {% if template == 'something' %}
A call to any Proxy is going to result in data being returned. So if you have a link in your Liquid to a Proxy, Shopify could possibly navigate there eg: /app/fizzbuzz and render what your Proxy returns as Liquid. In that case, you'd know you're on /app/fizzbuzz after the page is loaded, so a quick inspection of the URL would let you run JS.
A call from a link results in Shopify rendering the content_for_layout, if your element is in there don't include that element.
Would be helpful to know how you are using the Proxy to give you more details. Most people use it as an Ajax call for JSON and then render the returned data. I assume you are not doing that.
I would like to create a way for an admin to add a different video on each product page. Such as a field that would take a YouTube embed code. Video needs to be underneath the product description (not part of the description or in place of the product image). Is there an easy way to do this?
If you are using Google chrome you have an extension "ShopifyFD" to add metafields.
There are other apps and API (useful for bulk) that will also help you in adding metafields to product.
Once done you can use {{ product.metafields.___.___ }} format to call the metafield value.