Jump to content
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

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 Mats
      BETA: SplashAndGrab
      https://github.com/madebymats/InputfieldSplashAndGrab
      This module attaches a search input to selected image fields that lets you search and download images from Unsplash.
      (Unsplash is a stock photo service where you can download images for free and use as you wish. No strings attached.)   
      You can search by string, colors, orientation/crop and order by relevance or time published
      I find Unsplash useful both for placeholder images when building sites but also as a time saver for editors if they don’t have any images at hand, just search, download and publish.

      Thanks to @apeisa for building the  FlickrInputField Module and @Robin S for AddImageUrls,  took a lot ideas and code from those modules.
    • By Markus (Blue Tomato)
      We have created a module to create BlurHash strings for images while uploading in ProcessWire. This blurry images will be saved in the database because they are very small (20-30 characters) and can be used for Data-URL's  as placeholders for image-lazy loading.
      https://github.com/blue-tomato/ImageBlurhash
      E.g. where we use this in production:
      https://www.blue-tomato.com/en-INT/blue-world/ https://www.blue-tomato.com/en-INT/blue-world/products/girls-are-awesome/ https://www.blue-tomato.com/en-INT/buyers-guides/skateboard/skateboard-decks/ https://www.blue-tomato.com/en-INT/team/anna-gasser/
    • By calago
      after the migration to version 3.0.145 our export templates all of a sudden dont work properly, 
      we have a functionality where we use a boiler template with a set of fields. for some reason since the upgrade when we select the export template to export it. it wont show any of the fields added after the migration, 

      as you can see the offer certificate remarks field has been added to the export, 
      but when we select it it wont come trough

    • By EyeDentify
      Hello dear PW gurus.

      I have stumbled over a strange error that i all of sudden got when trying to upload an image to a images field on a page.
      There where images allready stored in the field that i wanted to keep, but during the upload the error apear and after that all images are gone from the field and i can´t upload any, i just get the error every time.
      I am running ProcessWire 3.0.153 dev.
      Update:
      After looking in the assets folder i find the folder for the page and the image files seems to be there including the ones i tried to upload when the error occured.
      But they don´t show up in the images field in the page editor.
       
      The error reported:
       
      SQLSTATE[01000]: Warning: 1265 Data truncated for column 'ratio' at row 1 And here is a screenshot of the event:

      The TracyDebugger Error reporting:

      I hope you fine folks could point me in a direction.
      But it seems our old pal set_time_limit() is back.

      Regards, EyeDentify
    • By rushy
      Hi all
      Continuing my first project where I am creating and manipulating stuff from the frontend. Till now I've always added things like images from the backend, but in this project I need to add and move images from a frontend control. This is a photo album where images are stored in albums, each album being a page containing a Pageimages array in the usual way. So what I want to know is how do I move an image from one album (page) to another in the frontend? I just need some guidance on how to approach this.  I suppose I need to do a copy and delete - but how do I copy an image or images from one page to another? What function should I use to create a new image on an existing page? I include a code snippet from the server side of my delete image request and it works fine. I'd like to implement something similar for a move and upload new image request. 
      Many thanks for any help. Paul 
      <?php namespace ProcessWire; // sanitize inputs as 1-line text $action = $sanitizer->text($input->post('action')); $instr = $sanitizer->text($input->post('input')); $sel = $input->post('selected'); // Expect JSON for image selected image list $selected = json_decode($sel); $nosel = count($selected); $response = array(); // for building JSON response switch($action) { // delete selected images case 'delete': $out = "<p>Deleted $nosel image(s)</p>"; foreach($selected as $item){ $album = $pages->get($item->album); $album->of(false); $out .= "<p>Image {$item->file} from album {$album->title}</p>"; $album->images->delete($item->file); $album->of(true); } $out .= saveUpdatedAlbums($pages, $selected); // add the response message for the delete $response['message'] = $out; break; ...... // save any album that had an image deleted function saveUpdatedAlbums($pages, $selected) { $cur = ''; $out = ''; foreach($selected as $item){ $album = $pages->get($item->album); if($album->id != $cur) { $album->of(false); $album->save('images'); $album->of(true); $cur = $album->id; $out .= "<p>Updated album {$pages->get($cur)->title}</p>"; } } return $out; }  
       
       
×
×
  • Create New...