Have your say in Community Polls: What was/is your greatest motivation to start your own business?

Re: Dawn: Custom Liquid Section with Dynamic Source Option

Dawn: Custom Liquid Section with Dynamic Source Option

pearlerwork
Shopify Partner
76 1 10

I'm using Dawn Theme. I'm needing my Custom Liquid section to have an option to select a dynamic source. Is there a line of code I can add to the section file? Thanks!

 

For context, we have shortcodes added to a metafield for each product that will load a unique UGC gallery for each product. 

Replies 5 (5)

iCart_App
Shopify Partner
636 60 113

Hello @pearlerwork 

 

Here's a simplified example of what the code might look like in your section file:

 

<div class="custom-section">
    <form action="#" method="post" id="dynamic-source-form">
        <label for="dynamic-source-select">Select Dynamic Source:</label>
        <select name="dynamic-source" id="dynamic-source-select">
            {% for source in product.metafields.custom.sources %}
                <option value="{{ source }}">{{ source }}</option>
            {% endfor %}
        </select>
        <button type="submit">Apply</button>
    </form>
</div>

 

  • product.metafields.custom.sources represent the data structure where you store the dynamic sources for each product. Adjust this according to how your data is structured.
  • Replace "Apply" with an appropriate label for your submit button.

iCart Cart Drawer Cart Upsell App


- If you find the solution helpful, please accept and like it
- To learn more visit www.identixweb.com
Arif_Shopidevs
Shopify Partner
263 37 36

@iCart_App 
In Shopify product section will the form action need. Is that managed by Shopify auto? 
Thank you

Found it helpful? Please like and mark the solution that helped you.
Slider Revolution - Create sliders, theme sections, banners, videos, pages, advanced animation, and social feeds.
Essential Grid Gallery - Create photo galleries, video galleries, portfolio galleries, product gallery, collection gallery and more.
EasyDisplay: Product Showcase - Easily display collections, related products, discounts, recently viewed items, and best sellers
iCart_App
Shopify Partner
636 60 113

@Arif_Shopidevs 

In Shopify, the form action for product sections typically doesn't need to be specified manually. Shopify handles form submissions automatically for product pages.

 

When a customer interacts with the product form, such as selecting options for variants or adding the product to the cart, Shopify's JavaScript code manages the form submission process.

iCart Cart Drawer Cart Upsell App


- If you find the solution helpful, please accept and like it
- To learn more visit www.identixweb.com
pearlerwork
Shopify Partner
76 1 10

Thanks, @iCart_App - shouldn't I be adding schema, not HTML?
I'm just wanting to add the little 'dynamic source' button in the top right like all the other fields have:

 

Image 2024-05-14 at 3.20.36 pm.jpg

 

Screen Shot 2024-05-14 at 3.19.14 pm.png

whateverlabs
Visitor
1 0 0

i'm having the same issue. did you get a resolutions? thanks