Random divider image between posts - php

for my wordpress based website I would like to display a random image between posts, not having an image after the last post.
I thought I could combine an echo inside a php, but it would appear that this is impossible.
Any ideas how to accomplish this ?
<?php
if (($wp_query->current_post + 1) < ($wp_query->post_count)) {
echo '<div class="post-item-divider" align="center"><img src="http://v2.fortherestless.com/images/clouds/<?php echo rand(1,20);?>.png" alt="Random Image" /></div>';
}
?>

Store the number first in a variable then insert it to the image url.
<?php
if (($wp_query->current_post + 1) < ($wp_query->post_count)) {
$image_num = rand(1, 20);
echo '<div class="post-item-divider" align="center"><img src="http://v2.fortherestless.com/images/clouds/' . $image_num . '.png" alt="Random Image" /></div>';
}
?>

Related

Creating slideshow from a map with images

I have cms where I can upload pictures into a map.
I also have a slideshow where I have manually put some pictures in. But I want the slideshow to randomly take a picture that I have uploaded.
All my pictures that I upload start with "beeld_" followed with a random nummer
<div id="mygallery" class="stepcarousel">
<div class="belt">
<div class="panel">
<? echo'<img src="'.$root.'/cms/files/slider/fotos/'.'beeld_'. [?] .'.png" alt="" />'; ?>
</div>
<div class="panel">
<img src="<?=$root?>/cms/files/slider/fotos/beeld_2.png" />
</div>
<div class="panel">
<img src="<?=$root?>/cms/files/slider/fotos/beeld_3.png" />
</div>
<div class="panel">
<img src="<?=$root?>/cms/files/slider/fotos/beeld_4.png">
</div>
</div>
</div>
You can try some thing like rand(0, 10); (Note: number 10 can be replaced with highest number of image you have e.g. if your image name has beeld_50 you can use rand(0, 50 and no image sequence is missing. you can set value of $i for number of slides you want to display)
for ($i=0; $i<3; $i++){
echo '<div class="panel">';
echo '<img src="' . $root . '/cms/files/slider/fotos/beeld_'. rand(0, 10) .'.png" />';
echo '</div>';
}
As I said in the comments, you should just list all the images / files you have using scandir or an other function:
$images = array_diff(scandir($your_directory), array('..', '.'));
This gives you an array with all the files listed in that directory, after you did this, you could build your slidesshow panels again doing something like:
for ($i = 0; $i < $number_of_panels; $i++){
echo '<div class="panel">';
echo '<img src="' . $root . '/cms/files/slider/fotos/'. $images[rand(0, (count($images)-1)] .'" />';
echo '</div>';
}
Not that you need to do (count($images)-1) , if you don't it could be possible you would go out of the arrays bounds.. .

trying to show the same content in page and also in fancybox

Im trying to fill my articles with content that is coming from the database.
I have my articles with: title, image, date, content and with a link (read more) to open a fancybox that will show the same content of this article but in the fancybox.
So I have my div id="show-container" that corresponds to the div that shows the content in fancybox.
This div have display:none in css and it only appears when the user click in the link with #show href and class="fancybox", here:
<a class="fancybox" href="#show">Read more</a>
But I want to show the same content in fancybox so Im fill this "show" div with the same info that I put in the article.
My articles are working fine, each article is with right name,image and content.
But when I click to open the fancybox of each article all the fancyboxs have the same content, that is the content of my first article.
Anyone there know how I can fix this?
$readPost = $pdo->prepare("SELECT * FROM posts ORDER BY date DESC LIMIT 0,4");
$readPost->execute();
$folder = '../images/';
while ($readPostResult = $readPost->fetch(PDO::FETCH_ASSOC))
{
echo '<article id="loop-news">';
echo '<img src="'.$folder.$readPostResult['thumb'].'" title="'.$readPostResult['title'].'"/>';
echo '<h2>';
echo '<a href="#show" class="x" >'.$readPostResult['title'].'</a><br />';
echo '</h2>';
echo '<p>'.$readPostResult['content'].'<a class="fancybox" href="#show">Read more</a></p>';
echo '<div id="show-container">';
echo '<div id="show">';
echo '<h2>'.$readPostResult['title'].'</h2>';
echo '<br />';
echo '<img src="'.$folder.$readPostResult['thumb'].'" title="'.$readPostResult['title'].'"/>';
echo '<p>'.$readPostResult['content'].'<br /></p>';
echo '<a class="button" href="index.html">Back</a>';
echo '</div>';
echo '</div>';
echo '</article>';
}
?>
I think I need to pass the id of each news when I click in my a href:
echo '<p>'.$readPostResult['content'].'<a class="fancybox" href="#show">Read more</a></p>';
Do you know How I can do that?? Because Im already using "#show#" in my link to open the fancybox..
You have to use class for css instead of id
Your ID values are meant to be unique to the element. Because you're generate the content in a loop, you will have multiple duplicate ID values in your elements. Try changing it to this:
$i = 0;
while ($readPostResult = $readPost->fetch(PDO::FETCH_ASSOC))
{
echo '<article id="loop-news-' . $i . '">';
echo '<img src="'.$folder.$readPostResult['thumb'].'" title="'.$readPostResult['title'].'"/>';
echo '<i class="fa fa-download"></i>';
echo '<h2>';
echo '<a href="#show" class="x" >'.$readPostResult['title'].'</a><br />';
echo '</h2>';
echo '<span>'.date('d/m/Y H:i',strtotime($readPostResult['date'])).'</span>';
echo '<p>'.lmWord($readPostResult['content'],270).'<a class="fancybox" href="#show-' . $i . '" id="showFancy-' . $i . '">Read more</a></p>';
echo '<div id="show-container-' . $i . '">';
echo '<div id="show-' . $i . '">';
echo '<h2>'.$readPostResult['title'].'</h2>';
echo '<br />';
echo '<img src="'.$folder.$readPostResult['thumb'].'" title="'.$readPostResult['title'].'"/>';
echo '<p>'.$readPostResult['content'].'<br /></p>';
echo '<a class="button" href="index.html">Back</a>';
echo '</div>';
echo '</div>';
echo '</article>';
++$i;
}
You'll notice, I've created an $i variable outside the while loop, and it appends the value of $i to all your ID elements. Once at the end of the loop, it will increase $i by 1, so that all your IDs in your loop will be unique.

conditional logic in the header.php

So I am using Wordpress and I have to have a specific logo on a specific page. From research I have to use conditional logic to swap the existing logo with another depending on the current page. Everything I have tried seems to just break the theme.. Any help on guiding me in the correct direction? So basically every page except page_id=79 would have the same logo in the header.
<a id="logo" href="<?php echo home_url(); ?>">
<?php
if(!empty($options['use-logo'])) {
$default_logo_id = (!empty($options['retina-logo'])) ? 'id="default-logo"' : null;
echo '<img '.$default_logo_id.' alt="'. get_bloginfo('name') .'" src="' . $options['logo'] . '" />';
if(!empty($options['retina-logo'])) echo '<img id="retina-logo" alt="'. get_bloginfo('name') .'" src="' . $options['retina-logo'] . '" />';
} else { echo get_bloginfo('name'); }
?>
</a>
<?php if ( is_page(79) ) { ?>
What to displayed on page 79.
<?php } else { ?>
What will be displayed everywhere else.
<?php } ?>
This should work.
Try using get_queried_object_id();
<a id="logo" href="<?php echo home_url(); ?>">
<?php
if(!empty($options['use-logo']) && get_queried_object_id() != 79) {
$default_logo_id = (!empty($options['retina-logo'])) ? 'id="default-logo"' : null;
echo '<img '.$default_logo_id.' alt="'. get_bloginfo('name') .'" src="' . $options['logo'] . '" />';
if(!empty($options['retina-logo'])) echo '<img id="retina-logo" alt="'. get_bloginfo('name') .'" src="' . $options['retina-logo'] . '" />';
} else { echo get_bloginfo('name'); }
?>
</a>
The url of your logo image is contained within $options['logo']. You should be able to modify this in the admin section of your WordPress installation (try looking in "Appearance -> Header").

Order foreach results into 2 columns

I am attempting to style a list of results from a foreach into two columns, however I'm not too sure how to go about it without throwing off the PHP.
Currently, everything looks like below:
and I would like it to look so:
Currently, my foreach and CSS looks thus:
<p class="title">Reviews</p>
<section id="reviews">
<ul class="section_body">
<?php
foreach($reviews['reviews'] as $rv){
if ($rtmp++ < 10);
if ($rv['freshness'] == 'fresh') {
$image = "fresh";
}
else {
$image = "rotten";
}
echo '<img src="assets/images/' . $image . '.png" class="rating" title="Rotten" alt="Rotten" />';
echo '<li>' . $rv['quote'] . '</li>';
}
?>
</ul>
</section>
Thank you in advance to anyone who may be able to help! It will be very gratefully received.
I normally use css to do this kind of task to let the browser take care of stuffs
#reviews li
{
float:left;
width: 45%;
...
}
add those 2 lines to your css and let browser takes care of the arrangement. The idea is having each li take half of the container (50%). I made it 45% to take care of extra padding, margin and border
Also, your quote and image should be in the li
<li> <img src="..." /> <span>my quote here</span> </li>
Try below code
<section id="reviews">
<?php
$i=0;
foreach($reviews['reviews'] as $rv)
{
if($i++%2 == 0)
{
echo '<ul class="section_body">';
}
if ($rtmp++ < 10);
if ($rv['freshness'] == 'fresh') {
$image = "fresh";
}
else {
$image = "rotten";
}
$img = '<div><img src="assets/images/' . $image . '.png" class="rating" title="Rotten" alt="Rotten" /></div>';
echo '<li>' .$img . $rv['quote'] . '</li>';
if($i%2 == 0 || $i== count($reviews['reviews']))
{
echo '</ul>'
}
}
?>
</section>
You should put image and review text inside the li element.

unsure how to add bloginfo reference to images inside wordpress loop

I want to use the <?php bloginfo('stylesheet_directory'); ?> inside my wordpress loop to reference an image but unsure how to do this. My image code is as follows:
<?php
if (is_category('Events')) {
echo '<img src="http://localhost/mmj/wp-content/themes/child-theme/img/live-banner.jpg" class="live-holder-img" />';
} else if (is_category('News')) {
echo '<img src="http://localhost/mmj/wp-content/themes/child-theme/img/live-banner.jpg" class="live-holder-img" />';
} else {
echo '<img src="" class="default" />';
} ?>
I would rather replace http://localhost/mmj/wp-content/themes/child-theme with <?php bloginfo('stylesheet_directory'); ?> but Im aware that I cant include <?php inside <?php so I was wondering how I could do this?
You can use like this :
echo '<img src="'.get_bloginfo('stylesheet_directory').'/img/live-banner.jpg" class="live-holder-img" />';
Full code :
<?php
if (is_category('Events')) {
echo '<img src="'.get_bloginfo('stylesheet_directory').'/img/live-banner.jpg" class="live-holder-img" />';
} else if (is_category('News')) {
echo '<img src="'.get_bloginfo('stylesheet_directory').'/img/live-banner.jpg" class="live-holder-img" />';
} else {
echo '<img src="" class="default" />';
} ?>
In shortly,
I'm using get_bloginfo() instead of bloginfo() for getting stylesheet directory, not printing out. And then using it like this :
echo 'Some strings here ' . get_bloginfo() . ' another strings';

Categories