Site icon The Metal Spot

Adding Extra Rows for Promoted Links/Featured Items on Shopify Responsive Theme

Accommodating a growing business always requires a little code juggling and planning. Currently, we really like our Responsive Shopify Theme, however having only 8 featured categories presents a challenge for NiciArt as we move into 2017. To expand our line-up, we are planning on offering photography, jewelry tools and equipment, paintings, and overhauling our golf ball marker category in the coming year. The photography category will include a mix of royalty free downloadable backgrounds and images along with framed artistic landscape photos from our adventures in the Desert Southwest.

Starting with our basic layout we have 8 categories and are using the featured promotions to set up our menu:

Initially the new categories will be invisible, but for now, I’ll show them as “Test” to ensure the coding is working correctly.

Step 1

Find the featured-promotions in the index.liquid files and change the number of items to display from 8 to 12. For us, that means editing line 217 for i in (1…12)

Step 2

Find the code in the settings.scheme.json that refers to the featured-promotions

After featured item 8, simply copy, edit, and re-paste the code:

},

{

“type”: “header”,

“content”: “Promotion 9”

},

{

“type”: “checkbox”,

“id”: “feature9_enabled”,

“label”: “Enable promotion”

},

{

“type”: “image”,

“id”: “feature9.jpg”,

“label”: “Image”,

“info”: “840 x 840px recommended”,

“max-width”: 840,

“max-height”: 760

},

{

“type”: “text”,

“id”: “feature9_link”,

“label”: “Link URL (optional)”

},

{

“type”: “text”,

“id”: “feature9_title”,

“label”: “Title text (optional)”

},

{

“type”: “text”,

“id”: “feature9_description”,

“label”: “Description (optional)”

 

Step 3

Repeat the last code paste for 10…12 and don’t forget to open and close each set with:

},

{

Step 4

After adding the code for 8 to 12, then close the set with

}
]

Step 5

Now you can simply carry on with adding the next 4 promoted items to the expanded menu.

 

So far, we have been using Out of the Sandbox’s Responsive Theme for about 3 weeks and besides providing us with a clean modern layout featuring sections divided neatly by banners along with logical navigation options, this Responsive Theme is incredibly flexible to edit and customize. My complaint with the Shopify stock themes is they are so basic that customizing usually means starting from scratch to add functionality, whereas a quality template such as Responsive allows the user to simply add onto or modify the existing code. As much as I object to paying Shopify more than the monthly subscription fee, a custom template can definitely save hours of needless and frustrating coding.

Exit mobile version