clickpass

Grab several certain images from array

Recommended Posts

I want to split my output of an image array, see my code here:

<div class="row">
  	<?php foreach($page->umf_imgs as $image) {echo "<div class='one-fourth column refs'><img src='$image->url'></div>";} ?>
</div>
<div class="row">
  	<?php foreach($page->umf_imgs as $image) {echo "<div class='one-fourth column refs'><img src='$image->url'></div>";} ?>
</div>
<div class="row">
  	<?php foreach($page->umf_imgs as $image) {echo "<div class='one-fourth column refs'><img src='$image->url'></div>";} ?>
</div>

The number of images is 11, but I only want to add four in a row. Is it possible to grab them, e.g. image 1-4, image 5-8, image 9-12?

Share this post


Link to post
Share on other sites

modulus as long as it's divisible by four you can achieve that

 

Share this post


Link to post
Share on other sites

Great, but I still don't know how to select my images. An example would be very helpful.

To be honest, I have not the slightest idea how a modulus operator can do my task.

Share this post


Link to post
Share on other sites

I want to split my output of an image array, see my code here:

<div class="row">
  	<?php foreach($page->umf_imgs as $image) {echo "<div class='one-fourth column refs'><img src='$image->url'></div>";} ?>
</div>
<div class="row">
  	<?php foreach($page->umf_imgs as $image) {echo "<div class='one-fourth column refs'><img src='$image->url'></div>";} ?>
</div>
<div class="row">
  	<?php foreach($page->umf_imgs as $image) {echo "<div class='one-fourth column refs'><img src='$image->url'></div>";} ?>
</div>

The number of images is 11, but I only want to add four in a row. Is it possible to grab them, e.g. image 1-4, image 5-8, image 9-12?

Share this post


Link to post
Share on other sites

@clickpass

You can use array_chunk, or use hook to add similar method to WireArray object.

Take a look at this post

 

Share this post


Link to post
Share on other sites
<div class="row">
<?php
$i = 0;
foreach ($page->umf_img as $image) {   
  echo "<div class='one-fourth column refs'><img src='$image->url'></div>";
  if ($i % 4 === 0) {
  echo '</div><div class="row">';
  }
  $i++;
}?>
</div>

 

  • Like 1

Share this post


Link to post
Share on other sites
4 hours ago, clickpass said:

I even think I posted the topic under the wrong category.

Moderator Note:

I've merged your two topics

  • Like 1

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.

  • Similar Content

    • By louisstephens
      I have a repeater with a text field where I would like to use hanna code (to make it easier on the user) so the user can define the action of a image that is in the repeater. For example:
      1. The image should have an external link:
      - the user can just type in the url
      2. The image, when clicked, should be printable (using print.js)
      - the user can just type [[print_image]]
      That works just fine, but I am running into an "issue". The code I need to use to print is:
      onclick="printJS({printable: 'path_to_image', type: 'image'});" I can put that into the hanna code as plain text, but I have no idea how to get the image from the repeater item and pass to "path_to_image". Is this even possible?
    • By Sten
      Hi,
      I have a lot of difficulties with getting a field value.
      First I created a template, inside I created several fields
      two fields are a dropdown select box So I have a value and a label for each line.
      Then I want to get the field value in _init.php or in the template to display it. How can I get the value of a field for the page ? I need to understand the flow through which data goes.
      Could someone help me ?
      Thank you
       
       
       
    • By louisstephens
      So this is more or less just a question regarding best practices, and how to actually achieve this. I have an internal tool I built awhile ago that has just gotten very "trashed". The naming conventions are all out of whack due to trying to get something completed, and pages are just everywhere. The fields got really out of hand as well, but I believe I have found a much cleaner field structure with the Repeater Matrix and a few other ProFields.  I decided recently to rewrite the template structure and the fields from scratch to keep everything nice and neat, but then it hit me that I would need to move all the previous data over and populate the new fields etc.
      The current tree looks something like:
      Group Title - Section A (template "section") - Category One (template "category") - Category Two (template "category") - Section B (template "section") - Category One (template "category") - Category Two (template "category") Etc etc... The structure is pretty good, and I am thinking of keeping it as it serves my purpose. However, I now have about 140 Sections with child pages that I would hopefully like to move to different templates, as well as changing the child templates/mapping data to the new fields. The only fields I need to worry about are a few textareas, text fields, options field,  as well as 1 image filed.
      I guess my real question is, what is the best way to go about this "migration" via the api while keeping the parent/child structure. It would be ok to leave it as is and chip away at it if I were the only one using it, but unfortunately that is not the case. 
      I guess one approach would be to copy over the entire structure and make the move to the new templates/fields. Once we have verified all the data/templates are correct, we could remove the old structure and possibly rename the new to mirror the old. However, this might just be too complicated.
    • By Marcel
      Hey, 
      I am very new to processwire and bootstrap. I have a field (text area) and there I want to be able to insert an image which is responsive. I tryed it with Source but in the end the page doesn't seem to like it when I insert in Source the following code
      <img src="<?php echo $homepage->content_img->url; ?>" class="img-fluid" alt="Responsive image"> What can I do to make it possible to insert reponsive images in a text area?
      Thank you in advance.
      Marcel
    • By gonzz
      I'm doing an artist site and they want to be able to upload a large .tiff to their portfolio. I need to keep to a copy of the original file in the server for the art distributers, and of course serve jpg in the web front end.
      I had the idea of extending the file or image upload input so that if the image is tiff, keep it, and also convert it to jpg, so I could access through something like $image->originalUrl or $image->size(100, 100)->url 
      I was wondering if you thought this a good idea, or if i'm over-engineering something that could be done simply. Also, I've never extended an input, so any examples are welcome.
      Thanks!