How to build custom Shopify sections (In-depth guide)

In this video you'll learn build custom Shopify sections and add them to any store or theme. We'll cover sections from front to back and go through every property. You'll learn how to add settings to your sections, change the tag, add blocks, add presets, add locales, add section groups, change the class, change the tag, and much more!
Section Docs - shopify.dev/docs/themes/archi...
Section group docs - shopify.dev/docs/themes/archi...
Setting docs - shopify.dev/docs/themes/archi...
Finished code - gist.github.com/robbyklein/23...
0:00 - Intro
0:30 - Creating a new section
2:00 - Tags, Classes, and Limits
3:00 - Settings
4:44 - Blocks
9:19 - Presets
11:27 - Locales
12:29 - Enabled/Disabled On
13:20 - Stylesheet / Javascript
15:55 - Section Groups
18:50 - Direct rendering
19:13 - Default
19:41 - Label Translations

[@cmscss]

Your real-time video style is a godsend my friend, no long-winded intros just straight into making stuff happen. Love the fact there is no styling as well, just Shopify dev. Perfect, keep ‘em coming and thanks again, much appreciated.

[@chrislaforet1064]

After many hours of searching docs to no avail, this video answered several questions and helped me move forwards! Thanks.

[@kevinphandy2]

Oh hell yeah. Been so busy scrubbing through your Getting Started vid for the last few weeks that I missed this upload. Perfect timing!

[@ChristopherJones-vx2jw]

I just started learning Shopify development and your videos have been a GODSEND, I have just gotten to a point where I need to learn how to set up block sections! Perfect timing robby!

[@webok]

As always, an amazing video. To the point. Informative. Super helpful. I was just looking for a refresher on this topic as I am building a couple custom sections for a clients theme. Thank you Robby cheers!

[@bmfitzgerald3]

Nice job dude! Super helpful (speedy) run through. I think a slowed down version where you share some insights on what you believe to be the most valuable features of sections (and why), would be a highly valuable follow-up.

[@joel-steinmann]

probably the best and fastest video on this topic. thanks buddy learned a bunch.

[@mohamedaiteljaouadi906]

Very informative video, Thank you, Robby, for sharing your knowledge with us 🙏.

[@Rostyagai-dev]

Your tutorials are amazing! Thank you so much for your job!

[@henryleestudio]

Such a great video man, thank you!

[@felipesanchez3215]

Amazing work! Keep it up!

[@MyOwnBluetorch]

i liked, subscribed can't remember the last thing you said but i did it - Thank you for great content

[@vinicom100]

Holy shit, this is gold! Thank you very much, you're the best!

[@WaqarSaifi]

I've been following your Shopify theme development videos for a year now, and they've all been excellent. However, I would love to see a video where you demonstrate how to use JavaScript components for rendering cart page and filters as you know most of the time we need to work with dawn theme. I find it a bit confusing, and I believe your expertise would make it clearer.

[@regularyt-pz4ki]

thank you was looking for this

[@Vastlee]

This makes me happy on the inside.

[@abdelrahmanmohamed1206]

best video for Sections

[@Alishahlakhani]

God Bless you! This was so helpful

[@branchyapple]

Thanks man!

[@Saterata13]

Grateful! 🤘

[@math0magic]

Killed it

[@shenyuanliao1655]

Thank you very much for your video, and I hope you can send out videos about gift-bundled shopping carts in shopify

[@alexandergeorgesquire220]

Hey Robby!!
Would love a video on a breakdown of json syntax and best practice etc..

[@JK-gh9ng]

json isn't exclusive to shopify, you could probably easily find a video somewhere else covering it. It's also mostly straightforward, object with keys and values, no trailing commas.

[@saraansari5065]

Hi Robby,
Thanks for the great tutorial video. I have a question: can we create a section with two columns and add another sections in each column, like a page builder ?

[@thebetacoders4738]

Can we add defaults for blocks? Means add 1 or more default block with default value for each setting?

[@jimshoes]

how to you edit the shopify code in visual studio and then have it update like that?

[@funnyariyo5763]

How do you run your liquid from vs code to Shopify?

[@orangecalzados9053]

Hello Robby my name is joel and im starting with shopify. Im using CLI 3.0 and im trying to do the section with you in the same time looking the video. my problem is that i have to do all the time PUSH to see my change and i cant use the visual studio to do my changes on live. could you help me with that? thanks

[@hirenprajapati1]

script tag content not run when we use Section Rendering API

[@lisajewelrydesigns]

Rob how can i add the code snip i got from paypal for my buttons on shopify

[@manojrawat5756]

👌👌

[@ThiagoDaurizio]

Can do too a page template liquid and json tutorial please?

[@someradtunesimade]

yo how are you seeing your changes reflected in real time on the browser theme editor ???

[@codingwithrobby]

I’m using Shopify theme kit. The Shopify cli for themes is another option for this.

[@someradtunesimade]

@@codingwithrobby thank you! I will have to try out theme kit, I think hot reload would be really useful in the learning stage especially

[@yashulja]

Hello Robby from Ukraine! You do a great job! How can I donate you?

[@cyraxvisuals6203]

Should i follow this instead of this tut you did: th-cam.com/video/zCDo-l5DJSo/w-d-xo.html

[@funnyariyo5763]

How do you run your liquid from vs code to Shopify?

[@codingwithrobby]

Themekit or the Shopify cli