Shopify Question posted in
The Shopify help center can be found here.

adding sections to first and last in for loop containing sections – Shopify

my code

First of all, I use Plate CMS(runs on shopify liquid), this is creating the sections you can see in the image above.

Now im struggeling with a small problem. I want to loop all 6 sections but only 4 of them are placed inside a div and the other 2(the header and footer) are so called tray's, meaning there are a bit diffrent and won’t be placed inside that div.

I know i can loop through the 4 sections usingsomethign like this:

$('#mydiv > section').each(function () { /* ... */ });

but the problem is that i can’t select the header and footer this way.
and then i loop on the div above it will loop the <div data-id="post_15757"> and not the sections inside.

How do i use a loop like this: $('#mydiv > section').each(function () { /* ... */ });, but also add my header and footer?

Tags:

2

Answers


  1. 0

    You can use jQuery add

    let $div = $('#mydiv");
$('> section',$div).add($div.prev()).add($div.next())

    or in order:

    let $sections = $('section').first(), $div = $sections.next();
$sections.add($('> section',$div).add($div.next())

    or perhaps just 

    const $sections = $('section');
    Login or Signup to reply.
  2. 0

    You can also select on data attribute:

    var sections = $('[data-plate-object="section"]');

$.each(sections, function(idx, val){
    // apply logic
});

    This makes it almost certain, sections created by the CMS will be selected, and not HTML sections from integration.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search