How to Activate Shopify modular drag & drop sections on ANY page you want

How to Activate Shopify modular drag & drop sections on ANY page you want

187
23



INSTRUCTIONS
1. In my Theme.liquid, all I did was call the section I created:
% section ‘business-home’ %
Insert this after the normal placeholder tag for your page content.
demo code: https://pastebin.com/ugTcPFDB

2. This is my code for ACTIVATING DRAG & DROP MODULES ON ANY PAGE I WANT:
https://pastebin.com/cBrFS3YR

LIVE PAGE where I implemented modular section blocks:
https://chuubie.com/pages/business

Additional discussion —
Created a Shopify discussion board post for this here:
https://ecommerce.shopify.com/c/ecommerce-design/t/how-to-add-shopify-section-blocks-to-pages-not-just-the-homepage-459622

– – – – – – – – – – – –
TIPS IF YOU’RE STUCK:

1. Take a screenshot of where you’re stuck.
2. Markup your screenshot with an annotation tool to highlight and explain (ie. awesomescreenshot .. iphone markup tool+imgur.. your choice).
3. paste marked up screenshot in comment section

Let’s work through this!

That will give me the

23 Comments

  1. Great tutorial and content! So, can you help us do the same with the Modular theme, but not with image text block, with collections list block?

  2. I have problems when I'm trying to save, it says "Line 81 — Liquid syntax error: Unknown tag 'schema' "

  3. Hi, can you explain me pls why after saving my new html section after copying it from existing sections as you showed its not saving, I mean- im saving it but when I look sections on a new page or collection i dont see it to be there like it is in your video, maybe im doing smg wrong?

  4. Maybe I'm missing something but you didn't actually show where you paste the blocks you want into the new section. Your example has image and text blocks but what if we want something else?

  5. Hi Steven,
    Thanks for the tutorial. I'd gotten the business home to appear under sections. I added a test page to my navigation to test this, but when I click 'Business Home' and add content nothing appears on my page. Any sussestions on where I could have messed up, or if I am missing a step?

  6. yes its working but they are the blocks in one section, if i want multiple time this whole section means that i want same reusable functionality of section to any page as on homepage what can i do??

  7. Sweet tutorial! Huge hessle audio fan too <3

  8. Great tutorial and content! Was looking for something like this for a while. But, I would like to add the same section finctionality on a different page. I tried following the same steps but with a new page name which was also the same as the IF CONDITION in the new section liquid file but I can't get working.

    After I navigate to the new page I do have the section option on the left to add – "Custom content" – but it's full of all of the other content from the other page I made and it doesn't display.

    Also, I tried deleting some of the sections that appear on the left side but they also deleted on the other page that is using that custom section. Hrrmmmmmm. Any thoughts on this?

    So, can I only duplicate a section and use it on one other page only?

    Thanks again for the great video!

  9. Hey steven, first of all thank you for the tutorial. could you contact me on email: JimmyKBusiness@hotmail.com I would love to know what assets you use on your site to make the pictures and text stand like they do. 🙂

  10. You are amazing Man! Very useful, Thank You 🙂

  11. hey steven, great video, im trying to add a section "featured product" with another link, lets say "About us" how can i do that?

  12. I left a comment but it appears to have been deleted.

  13. Thanks, Steve! I do have a question though:

    I just did this with one of the "image with text overlays" and it is showing up at the end of my page, near the footer. I want it to be directly below the header. Is that going to be possible? If so, what do I need to do? I am noticing that I can edit the page.liquid file to change the order of the title and the page content, or to even hide the title, but even still the section I added comes afterward.

    Thank you!

  14. Amazing tutorial. I am having trouble with "Add Section". I've done everything and the section is showing up on my Customize Page, but I can't seem to add new sections. Just the one. Is there a secret to this?

  15. Does this still work? I have the same theme and everything, I feel like i am going in the Navigation Piece of things because I have the module appear everywhere but when I select an image it doesn't appear?

  16. Thank you sooooo much for this tutoria!! I saw it a couple of times to understand. But now it works great!!

  17. Super helpful!! Thank you so much for posting 🙂

  18. Good video Steven. Clear, concise, and very useful.
    Not sure if calling MANY sections directly from theme.liquid will slow down other pages (or is a Shopify best practice), but it works very nicely to implement custom Shopify sections on a few quick pages.
    Thanks for the info man.
    btw Awesome portfolio at http://www.stevenchustudio.com truly multidisciplinary

  19. INSTRUCTIONS
    1. In my Theme.liquid, all I did was call the section I created:
    {% section 'business-home' %}
    Insert this after the normal placeholder tag for your page content.
    demo code: https://pastebin.com/ugTcPFDB

    2. This is my code for ACTIVATING DRAG & DROP MODULES ON ANY PAGE I WANT:
    https://pastebin.com/cBrFS3YR

  20. I've been looking everywhere for information on this and believe it or not but this seems to be the only source of information about this. Please make a video on this topic more thoroughly in detail without leaving out steps for the venture theme. This video is to vague for the people who could actually use this. The people who know what youre talking about dont need this because they already know. Thanks.

  21. You seem to be the only one on the internet that has information on this…thanks a ton!

  22. Ho Steven, thanks for the tutorial. How do I anchor links within sections? For eg. In my menu, if I click about, I want it to go to that particular section rather than go to a new page? I can't seem to name the section or anything here. Any help would be great, thanks!

Leave a Reply

Your email address will not be published. Required fields are marked *