Answers.Body: <p>I wouldn't use Craft's <code>isMobileBrowser</code> detection here. It's the <strong>viewport width</strong> you are actually interested in and not whether the visitors is viewing your site from a mobile, tablet or desktop device. </p>
  
  <p>So what I'd do instead is to add a css class to the last item in each row and
  hide that item for the viewport widths in question with css. </p>
  
  <pre><code>{% for batch in craft.entries.section('afval')|batch(3) %}
      &lt;div class="row"&gt;
          {% for item in batch %}
              {% set lastItemClass = loop.last ? 'col-xs-hidden' %}
  
              &lt;div class="col-xs-6 col-md-4 {{ lastItemClass }}"&gt;
              &lt;/div&gt;
          {% endfor %}
      &lt;/div&gt;
  {% endfor %}
  </code></pre>
  
  
  
  <pre><code>.col-xs-hidden {display: none;}
  
  @media (min-width: @screen-md-min) {
    .col-xs-hidden {display: block;}
  }
  </code></pre>
  
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2015-08-31T12:34:15.253Z
Answers.Text: This seems to be a very good solution but the problem is that I actually do need to show it in batches of 2 on mobile / tablet not on any sort of desktop device so Paul's solution fits more for my problem. Thank you for the answer though really appreciate it :D
Answers.UserDisplayName: Justin Dekkers
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2015-08-31T12:42:41.300Z
Answers.Text: Hmm... that's exactly what the code does. It shows it in batches of 2, and on all browser with a viewport widths with 992px and above you have batches of 3.
Answers.UserDisplayName: carlcs
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2015-08-31T12:47:37.197Z
Answers.Text: There might be huge tablets that Craft classifies as mobile devices and tiny laptops or people having their browser windows very narrow that you're serving the 3 items per row because Craft cannot know about the width. And don't you use Bootstraps breakpoints for other things and want to have this batches detail play nicely with those?
Answers.UserDisplayName: carlcs
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2015-08-31T12:20:06.917Z
Answers.LastActivityDate: 2015-09-01T22:39:33.497Z
Answers.LastEditDate: 2015-09-01T22:39:33.497Z
Answers.UserDisplayName: carlcs
Answers.Body: <p>You should close your for-tag pair within the <code>{% if ... %}</code>.</p>
  
  <p>So:</p>
  
  <pre><code>{% if craft.request.isMobileBrowser %}
      {% for batch in craft.entries.section('afval')|batch(2) %}
          ...
      {% endfor %}
  {% else %}
      {% for batch in craft.entries.section('afval')|batch(3) %}
          ...
      {% endfor %}
  {% endif %}
  </code></pre>
  
  <p>Or, even better:</p>
  
  <pre><code>{% set batch = craft.request.isMobileBrowser ? 2 : 3 %}
  
  {% for batch in craft.entries.section('afval') | batch(batch) %}
      ...
  {% endfor %}
  </code></pre>
  
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2015-08-31T11:14:27.927Z
Answers.Text: The last was code did it! Thank you so much!
Answers.UserDisplayName: Justin Dekkers
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2015-08-31T10:35:45.230Z
Answers.LastActivityDate: 2015-08-31T10:35:45.230Z
Answers.UserDisplayName: Paul
Body: <p>I have a loop to go through my products which go in batches because they need to show detail info every third entry. When the Website is viewed from a mobile device, Tablet or Mobile I want it to loop in Batches of 2 instead of 3.</p>
  
  <p>All I get when I make an "if" statement is errors about the for loop not closing.</p>
  
  <pre><code>    {% if craft.request.isMobileBrowser %}
          {% for batch in craft.entries.section('afval')|batch(2) %}
      {% else %}
          {% for batch in craft.entries.section('afval')|batch(3) %}
      {% endif %}
      lots of content here...
      {% endfor %}
  </code></pre>
  
  <p><strong>So how can I get the loop to go in 2 entries per batch instead of 3 when reached "col-sm"(bootstrap) or atleast when a mobile device is detected.</strong></p>
  
Tags: <entries><forloop>
Title: Is it possible to change a loop if mobile browser is detected?
ThreadText: # Is it possible to change a loop if mobile browser is detected?
  
  (Asked by: username_0 on 2015-08-31)
  
  I have a loop to go through my products which go in batches because they need to show detail info every third entry. When the Website is viewed from a mobile device, Tablet or Mobile I want it to loop in Batches of 2 instead of 3.
  
  All I get when I make an "if" statement is errors about the for loop not closing.
  
  ```
      {% if craft.request.isMobileBrowser %}
          {% for batch in craft.entries.section('afval')|batch(2) %}
      {% else %}
          {% for batch in craft.entries.section('afval')|batch(3) %}
      {% endif %}
      lots of content here...
      {% endfor %}
  
  ```
  
  **So how can I get the loop to go in 2 entries per batch instead of 3 when reached "col-sm"(bootstrap) or atleast when a mobile device is detected.**
  
  **Tags:** entries, forloop
  
  
  ---
  
  ## 2 answers
  
  ### Answer by username_2 on 2015-08-31. Score: 6 | Accepted answer
  
  You should close your for-tag pair within the `{% if ... %}`.
  
  So:
  
  ```
  {% if craft.request.isMobileBrowser %}
      {% for batch in craft.entries.section('afval')|batch(2) %}
          ...
      {% endfor %}
  {% else %}
      {% for batch in craft.entries.section('afval')|batch(3) %}
          ...
      {% endfor %}
  {% endif %}
  
  ```
  
  Or, even better:
  
  ```
  {% set batch = craft.request.isMobileBrowser ? 2 : 3 %}
  
  {% for batch in craft.entries.section('afval') | batch(batch) %}
      ...
  {% endfor %}
  
  ```
  
  > **Comments:**
  > **username_0**: The last was code did it! Thank you so much!  
  
  ---
  
  ### Answer by username_1 on 2015-08-31. Score: 3
  
  I wouldn't use Craft's `isMobileBrowser` detection here. It's the **viewport width** you are actually interested in and not whether the visitors is viewing your site from a mobile, tablet or desktop device.
  
  So what I'd do instead is to add a css class to the last item in each row and
  hide that item for the viewport widths in question with css.
  
  ```
  {% for batch in craft.entries.section('afval')|batch(3) %}
      <div class="row">
          {% for item in batch %}
              {% set lastItemClass = loop.last ? 'col-xs-hidden' %}
  
              <div class="col-xs-6 col-md-4 {{ lastItemClass }}">
              </div>
          {% endfor %}
      </div>
  {% endfor %}
  
  ```
  
  ```
  .col-xs-hidden {display: none;}
  
  @media (min-width: @screen-md-min) {
    .col-xs-hidden {display: block;}
  }
  
  ```
  
  > **Comments:**
  > **username_0**: This seems to be a very good solution but the problem is that I actually do need to show it in batches of 2 on mobile / tablet not on any sort of desktop device so username_2's solution fits more for my problem. Thank you for the answer though really appreciate it :D  
  > **username_1**: Hmm... that's exactly what the code does. It shows it in batches of 2, and on all browser with a viewport widths with 992px and above you have batches of 3.  
  > **username_1**: There might be huge tablets that Craft classifies as mobile devices and tiny laptops or people having their browser windows very narrow that you're serving the 3 items per row because Craft cannot know about the width. And don't you use Bootstraps breakpoints for other things and want to have this batches detail play nicely with those?  
  
  ---
  
  