I have two working codes that do two things to the images in my word-press site. However they don't work when I use them both as is. I can't seem to combine them and keep the functionality of both.
Outputs all the images in my word-press post with the last one wrapped in #last-img
<?php
preg_match_all('/(<img [^>]*>)/', get_the_content(), $images);
for( $i=0; isset($images[1]) && $i < count($images[1]); $i++ ) {
if ($i == end(array_keys($images[1]))) {
echo sprintf('<div id="last-img">%s</div>', $images[1][$i]);
continue;
}
echo $images[1][$i];
}
?>
puts the last image as the background of #last-img
<?php
preg_match_all('/src="([^"]*)"/i', get_the_content(), $images);
?>
<div id="last-img" style="background:url(<?php echo $images[1][count($images[1])-1] )"> ... </div>
I want to display all the images and have the last image as the background of #last-img
You can do it like below:-
<?php
preg_match_all('/(<img [^>]*>)/', get_the_content(), $images);
preg_match_all('/src="([^"]*)"/i', get_the_content(), $images1);
$count = count($images[1]);
$count1 = count($images1[1]);
foreach($images[1] as $k=> $img){
if($k == $count-1){
$format = '<div id="last-img" style="background:url(%s)"> ... </div>'; // Or $format = "<div id='last-img' style='background:url(%s)'> ... </div>";
$image = $images1[1][$count1-1];
echo sprintf($format,$image);
}else{
echo $img;
}
}
?>
Or
<?php
preg_match_all('/(<img [^>]*>)/', get_the_content(), $images);
preg_match_all('/src="([^"]*)"/i', get_the_content(), $images1);
$count = count($images[1]);
$count1 = count($images1[1]);
foreach($images[1] as $k=> $img){
echo $img;
}
$format = '<div id="last-img" style="background:url(%s)"> ... </div>'; // Or $format = "<div id='last-img' style='background:url(%s)'> ... </div>";
$image = $images1[1][$count1-1];
echo sprintf($format,$image);
?>
Related
Here's my problem, I have to display array values (description) under pictures like this :
Instead it appears like this
I'm working on this problem, this is my current code :
if (preg_match_all('/<div id="description" class="description">([^<]*)<\/div>/', $content, $match)) {
for( $i = 0; $i < count($match[0]); $i = $i+1 ) {
$description[] = $match[0][$i];
}
}
$attachments =& get_children($args);
$arrayMatches = array();
if ($attachments) {
foreach(array_chunk($attachments, 2) as $img) {
echo '<div class="two_cols">';
foreach($img as $attachment) {
foreach($attachment as $attachment_key => $attachment_value) {
$imageID = $attachment->ID;
$imageTitle = $attachment->post_title;
$imagearray = wp_get_attachment_image_src($attachment_value, $size, false);
$imageAlt = get_post_meta($imageID, '_wp_attachment_image_alt', true);
$imageURI = $imagearray[0]; // 0 is the URI
$imageWidth = $imagearray[1]; // 1 is the width
$imageHeight = $imagearray[2]; // 2 is the height
?>
<div class="col_1_2">
<div id="attachment_<?php echo $imageID; ?>" class="wp-caption alignnone" style="width: 356px;">
<a rel="lightbox-0" href="<?php echo $imageURI; ?>"><img class="wp-image-<?php echo $imageID; ?> size-full" title="<?php echo $imageTitle; ?>" src="<?php echo $imageURI; ?>" alt="<?php echo $imageAlt; ?>" width="456" height="304" /></a>
<p class="wp-caption-text"><?php echo $imageTitle; ?></p>
<?php
$arrayMatches[] = $match[0][$j];
?>
</div>
</div>
<?php
break;
}
$j++;
}
foreach(array_chunk($arrayMatches, 2) as $desc) {
echo '<div class="description">';
foreach($desc as $item) {
echo $item;
}
echo '</div>';
}
echo '</div>';
}
}
I try so many solutions but no one was the good one.
Thanks for the help ;)
Try:
foreach(array_chunk($arrayMatches, 2) as $k => $desc) {
if($k < 1) continue;
echo '<div class="description">';
foreach($desc as $item) {
echo $item;
}
echo '</div>';
}
I'm using a jquery image slider that, display images 3 by 3. All the images are coming from database. This is my code:
<ul class="bxslider">
<?php
$data = [ my images array];
for($x = 0; $x < count($data); $x++) {
?>
<li>
<div class="service_images">
<?php
$y=0;
while($y < 3) {
if($data[$y] != '') {
$imgNew = $data[$y];
?>
<img src="<?php echo $imgNew;?>" alt="" />
<?php
}
$y++;
}
?>
</div>
</li>
<?php
}
?>
</ul>
And this code is displaying just 1 image, and it's repeating.
plz help me guys. thanks.
Here I got this working... displayed 3x3 and you can check source... each img src increments by one each time. so that will give you 3 X 3.
heres my code, just need to adapt it a little (remove the array I made and replace it with yours.
<?php
$datas = array(1,2,3,4,5,6,7,8,9);
$y=0;
echo "<li>";
foreach ($datas as $data)
{
if($data != "")
{
$y++;
echo "<img src=" . $data . " alt='' />";
if($y % 3 == 0)
{
if($y < count($datas))
{
echo"</li>";
echo "<li>";
}
else
{
echo"</li>";
}
}
}
}
?>
</ul>
if you need any help, please comment.
Try this,
<ul class="bxslider">
<?php
$data = [ my images array];
for($x = 0; $x < count($data); $x++) {
?>
<li>
<div class="service_images">
<?php
if($data[$x] != '') {
$imgNew = $data[$x];
?>
<img src="<?php echo $imgNew;?>" alt="" />
<?php
}
?>
</div>
</li>
<?php
}
?>
</ul>
I am using the below code on a WP site.
<?php
$images = array();
$images[] = $profile_user->banner_image_1;
$images[] = $profile_user->banner_image_2;
$images[] = $profile_user->banner_image_3;
$images[] = $profile_user->banner_image_4;
if(!empty($images[0]) || !empty($images[1])|| !empty($images[2])|| !empty($images[3])){
?>
<?php echo '<div class="slider2">'; ?>
<?php foreach($images as $img): ?>
<?php if(!empty($img)): ?>
<div>
<img src="
<?php
$image_id = $img;
$post_image_data = wp_get_attachment_image_src( $image_id, $size='profile_banner_img' );
echo $post_image_data[0];
?>" />
</div>
<?php endif; ?>
<?php endforeach; ?>
<?php echo '</div>'; ?>
<?php } ?>
What i need to do is use a "IF" or "array" statement or something that will see if only "banner_image_1" has been filled by user and display a different code.
In other words if banner_image_1 returns information but 2,3,4 dont i need remove the
<div class="slider2"> and the </div>
Try this:
<?php
$images = array();
for($i=1; $i<=4; $i++) {
if(!empty($profile_user->{"banner_image_$i"})) {
$images[] = $profile_user->{"banner_image_$i"};
}
}
$validPics = count($images);
if($validPics > 0) {
if($validPics > 1) echo '<div class="slider2">';
foreach($images as $img_id) {
$img_src = wp_get_attachment_image_src( $img_id, $size='profile_banner_img' );
echo '<div><img src=\"' . $img_src[0] . '" /></div>';
}
if($validPics > 1) echo '</div>';
}
quite new to PHP and I'm trying to get my page to show 3 blog entries, followed by 3 photos, followed by another 3 blog entries and so on and soforth.
I've been recommended using do while loops but having a hard time getting it working or even getting my head round it, have been more used to using foreach loops in the CMS.
This was my original code which would work but only if I explicitly added each loop by hand!
<?php // Show 3 blog entries
$entries = $page->children("sort=-sort, limit=3");
$count = 0;
foreach ($entries as $entry) {
$count++;
$class = "blog_box";
if ($entry == $entries->last()) {$class .= " blog_box_last"; }
if ($entry == $entries->first()) {$class .= " blog_box_first"; }
if (0 == $count % 2) { $class .= " blog_box_even"; }
?>
<div class="<?php echo $class; ?>">
<div class="blog_text">
<h3><?php echo $entry->title; ?></h3>
<h6><?php echo $entry->entry_date; ?></h6>
<p><?php echo $entry->body; ?></p>
</div><!-- /.blog_text -->
<?php if ($entry->image) {
$image = $entry->image->width(350);
?>
<img src="<?php echo $image->url; ?>" width="<?php echo $image->width; ?>" alt="<?php echo $entry->title; ?>" />
<?php } ?>
<div class="clear"></div><!-- /.clear -->
</div><!-- /.blog_box -->
<?php }
?>
// Show 3 blog images
<?php $blog_images = $page->get("image_uploads")->find("limit=3");
foreach ($blog_images as $img) {
$b_img = $img->size(200,140); ?>
<img src="<?php echo $b_img->url; ?>" width="<?php echo $b_img->width; ?>" height="<?php echo $b_img->height; ?>" alt="<?php echo $b_img->description; ?>" class="small_frame" />
<?php } ?>
The CMS developer kindly tried some code for me but I couldn't get it to work for me:
$entries = $page->children("sort=-sort");
$images = $page->get("/image_uploads/");
$cnt = 0;
do {
$cnt++;
$entry = $entries->shift();
if($entry) {
// output 1 entry
}
if($cnt == 3) {
while(++$cnt <= 6) {
$image = $images->shift();
if($image) {
// output 1 image
}
}
$cnt = 0;
}
} while(count($entries) && count($images));
I'm using ProcessWire.
Thanks in advance guys!
I have an array containing information about some images, which I am using to print a number of img html tags by a foreach loop as follows:
<?php foreach ( $images as $image ) : ?>
<img alt="<?php echo $image->alttext ?>" src="<?php echo $image->thumbnailURL ?>" />
<?php endforeach; ?>
I would like to wrap a div around every 10 images. The remainder should get a div as well.
I am thinking I need to use array_chunkon $images and wrap the above in another loop for each chunk. The little bit of math I did to start is as follows:
$pics_per_page = 10;
$imgcount = count($images);
$num_pages = ceil($imgcount/$pics_per_page);
$pages = array_chunk($images, $num_pages);
How do I proceed from here? How do I use the $images array correctly, if at all, in outputting my HTML?
Forgetting about the array_chunk method, I have the following way, but the array_chunk method seems cleaner.
for i from 1 to num_pages:
echo "<div>"
j = (i-1) * pics_per_page;
while j <= i * pics_per_page
echo "<img src = "$images[j]->thumbnailURL />";
endwhile;
echo "</div>"
Thanks for your help in advance,
Sepehr
You are using array_chunk [docs] wrongly. You just have to specify the size of each chunk:
$chunks = array_chunk($images, 10);
Then you need a nested for (foreach) loop:
<?php foreach($chunks as $chunk): ?>
<div class="someClass">
<?php foreach($chunk as $image): ?>
<img alt="<?php echo $image->alttext ?>" src="<?php echo $image->thumbnailURL ?>" />
<?php endforeach; ?>
</div>
<?php endforeach; ?>
You could use it without array_chunk too.
<?php
$imgTot = count($images);
echo '<div>';
for($i=0; $i<$imgTot; $i++)
{
if ($i % 10 == 0) {
echo '<div>';
}
echo '<img alt="'.$image->alttext.'" src="'.$image->thumbnailURL.'" />';
if ($i % 10 == 9) {
echo '</div>';
}
}
echo '</div>';
?>
See the working example here: http://codepad.org/FkdTEH91