Checkout Toolbox

Flex Theme Sections

Linear Shopping Experiences

A Link List Section for the Flex Theme on Shopify

Setup steps:

  1. Add page__link-list section to the theme code.

Code for the Custom Liquid Section

This code is for a section for the Flex theme. If you are using a different theme, you may need to adjust the code accordingly.

Transcript

Hey, Scott Austin here from JadePuma.

For all of my stores, I create a page called Brand Guidelines. And it uses a custom section that I created called Brand Guidelines that allows me to put in, you know, what logos we're using, what the color palette looks like, topography information. And I also have information the bottom of this one for FLandB, where I have links to video tutorials. And I also have links to store management tools. And this whole thing started off as one big section with lots of elements you can add to it and blocks that you can add for the different types of content. And the problem I came across, let me just open this page up in theme customization inside of Shopify admin. The problem I came up with is a section currently is only allowed 50 blocks. And here if I open up the brand guidelines, you see I've got, I don't know how many of that is, let's just say 20, 25 different blocks added for colors and the video tutorial links and headers.

And then I was also adding, you know, other links for the story management tool section here, and I hit the 50 limit. So I created a new section that just allows you to add the link list that, you know, here's store management where there's, you know, headers and then links so that that section works like this. You can add it to a page and it allows you to define what the header's gonna be. And you know, as much information as you want underneath for an explanation. You can also set some colors and some spacing. And then the blocks, you have two options for blocks. You have link, header and a link. And they're pretty simple. The only Keter is this element here. And all you get to do is put in what the text is for that. And then links are two elements, which is the title, which is this information right here, and then the actual link that you know, you want it to go to.

And it shows the link as text and it is hyperlinked. So it'll take you to whatever that element is for the cu for the consumer of this page. They can quickly link off to different things. So that's the section. Pretty simple one to add it to your store. All you have to do is create the new section using the section name that's shown on the tutorial, which is, if you're watching this on YouTube, they'll be able to link in the YouTube video to go to the JadePuma site where the code is located. If you're on the, the YouTube or if you're on the JadePuma page already watching the video, then just look down below the video, you'll see the code block there. So create a section with that title name, and then just copy the, the code from that code element, paste it into that new section, and you should be able to add that section to any of your pages in your store after that.

All right, hopefully that helps. Thanks for watching.

 


JadePuma is a certified Shopify Expert. If you need any help with your Shopify store, we can help.


Search