Display Thumbnails on Wordpress with get_post_thumbnail - php

I'm struggling to display a few post thumbnails on a Wordpress page. I'm using advanced custom fields where I select those featured articles. The featured articles have a featured image. I can display the title and link to the articles correctly, but I'm struggling with the featured images.
<?php
if (is_page('reviews')) {
$featured_articles = get_field('featured_articles');
$id = $featured_articles[0];
echo "<div class='row blog-first'><div class='small-12 columns'><div class='row blog-teaser'>";
echo "<div class='small-8 columns'>";
if ( has_post_thumbnail($id) ) {
echo "<a href='".get_permalink($id)."' class='thumb'>";
echo get_the_post_thumbnail( $id, 'teaser-thumbnail' );
echo "</a>";
}
echo "</div>";
echo "<div class='small-4 columns col-text'>";
echo "<div class='d'></div>";
echo "<a href='".get_permalink($id)."'><h3>".get_the_title($id)."</h3></a>";
echo get_field('text_excerpt',$id);
echo "</div>";
echo "</div></div></div>";
echo "<div class='row'>";
echo "<div class='small-12 medium-8 columns'>";
echo "<h2 class='h2 hc f2'> Our best reviews</h2>";
for ($i=1; $i < 4; $i++) {
$id = $featured_articles[$i];
echo "<div><div class='row blog-teaser'>";
echo "<div class='small-6 columns'>";
if ( has_post_thumbnail($id) ) {
echo "<a href='".get_permalink($id)."' class='image'>";
echo get_the_post_thumbnail( $id, 'teaser-thumbnail' );
$image_large = wp_get_attachment_image_src( get_post_thumbnail_id($id), 'teaser-thumbnail');
echo "</a>";
}
echo "</div>";
echo "<div class='small-6 columns col-text'>";
echo "<div class='d'></div>";
echo "<a href='".get_permalink($id)."'><h3>".get_the_title($id)."</h3></a>";
echo "</div>";
echo "</div></div>";
}
echo "</div>";

Try this:
$featured_articles=get_field('featured_articles');
foreach($featured_articles as $single_feature){
$img_arr=wp_get_attachment_image_src($single_feature,'medium'); //thumbnail,full,medium
if(!empty($img_arr)){
echo '<img src="'.$img_arr[0].'" alt="image">';
}else{
echo '<img src="" alt="NO image">';
}
}

Related

how to make image as clickable to submit image id to a php file?

I have something like this
while($row = $result->fetch(PDO::FETCH_ASSOC)){
echo '<div class="container">';
$i=0;
while($i<3){
echo '<div class="row">';
echo '<div class="col-sm-4">';
echo '<div class="panel panel-primary">';
echo '<div class="panel-body"><img src="';
echo $row['imageurl'];
echo '"class="img-responsive" style="width:250px" style="height:250px" alt="Image"></div>';
echo '<div class="panel-footer">';
echo $row['name'];
echo '</div></div></div>';
$i++;
}
}
I want to click the image so that it calls a new PHP file with the image id.
To view the output http://csedu.cf/test.php
Try to put your image tag in a tag.
while($i<3)
{
echo '<div class="row">';
echo '<div class="col-sm-4">';
echo '<div class="panel panel-primary">';
echo '<div class="panel-body"><a href="test.php?id=image_id"><img src="';
echo $row['imageurl'];
echo '"class="img-responsive" style="width:250px" style="height:250px" alt="Image"></div>';
echo '</a><div class="panel-footer">';
echo $row['name'];
echo '</div></div></div>';
$i++;
}

Carousel String Offset in a button

I am trying to create a carousel with button "Read More" in every slide, it should be redirect to an image however it is not fetching the data instead it shows an error when im trying to put the button Illegal string offset (image2) -"image2 is the row in my sql table"
This is the carousel script.
<?php
include "db.php";
$query = "select * from carousel1 order by id desc limit 10";
$res = mysqli_query($con,$query);
$count = mysqli_num_rows($res);
while($c=mysqli_fetch_array($res)){
$titlee = $c['titlee'];
$konten = $c['konten'];
$gbr = $c['image'];
$gbr2 = $c['image2'];
if($counter==0)
{
echo"<div class='item active'>";
echo "<a href=''>";
echo "<img src='images/$gbr'>";
echo "</a>";
echo "<div class='container'>";
echo "<div class='carousel-caption left-caption style='background-color:#EE0930'>";
echo "<a href=''> <font color=#ffffffff style='font-family: Verdana,Arial,Helvetica,Georgia; font-size: 13px;'>";
echo "<h5 class='text-left'>".$titlee."</h5></font>";
echo "</a>";
echo "<a class=\"btn btn-primary btn-sm\" href=\"{$gbr2["image2"]}\">Read More</a>";
echo "</div>";
echo "</div>";
echo "</div>";
}
else
{
echo "<div class='item'>";
echo "<a href=''>";
echo "<img src='images/$gbr'>";
echo "</a>";
echo "<div class='container'>";
echo "<div class='carousel-caption left-caption style='background-color:#EE0930'>";
echo "<a href=''> <font color=#ffffffff style='font-family: Verdana,Arial,Helvetica,Georgia; font-size: 13px;'><h5 class='text-left'>".$titlee."</h5></font>
</a>";
echo "<a class=\"btn btn-primary btn-sm\" href=\"{$gbr2["image2"]}\">Read More</a>";
echo "</div>";
echo "</div>";
echo "</div>";
}
$counter++;
}
echo"</div>";
echo "<a class='left carousel-control' href='#myCarousel' data-slide='prev'>‹</a>";
echo "<a class='right carousel-control' href='#myCarousel' data-slide='next'>›</a>";
echo"</div>";
echo"<!-- End Slider Caraousel-->";
?>
The value of image2 is already being stored in $gbr2 ($gbr2 = $c['image2'];) . And then you're trying to use $gbr2["image2"] to get the value
Replace $gbr2["image2"] with $gbr2

Thumbnails not aligning in a single row

I'm trying to create a row with 3 thumbnails on it, the problem is it is not aligning in a single row, but instead every thumbnail goes in different row.
echo "<table>";
echo "<tr>";
echo "</tr>";
while($row=mysqli_fetch_array($result)){
echo "<div class=\"container\">";
echo "<div class=\"row-fluid\">";
echo "<div class=\"col-md-4\">";
echo "<div class=\"thumbnail\">";
echo "<img alt=\"News\" src=\"images/{$row["image"]}\">";
echo "<div class=\"caption\">";
echo "<h3>{$row["title"]}</h3>";
echo "<p>{$row["caption"]}</p>";
echo "<p align=\"right\">";
echo "<a class=\"btn btn-primary\" href=\"{$row["newsupdate"]}\">Read More</a>";
echo "</p>";
echo "</div>";
echo "</div>";
echo "</div>";
echo "</div>";
echo "</div>";
try this it might work
echo "<table>";
echo "<tr>";
while($row=mysqli_fetch_array($result)){
echo "<img alt=\"News\" src=\"images/{$row["image"]}\">";
echo "<div class=\"caption\">";
echo " <td> <h3>{$row["title"]}</h3> </td> ";
echo "<td><p>{$row["caption"]}</p></td>";
echo "<td> <a class=\"btn btn-primary\" href=\{$row["newsupdate"]}\">Read More</a>";
echo "</td>";
}
echo "</tr>";
echo "</table>";

Using while ($row = $stmt->fetch(PDO::FETCH_ASSOC)) to display images from database but only 1 image is shown

I try to fetch all image from database but only one image is shown.
this is my code:
<?php
$query = "SELECT id, name, image, price FROM products ORDER BY name";
$stmt = $con-> prepare ( $query );
$stmt->execute();
$num = $stmt->rowCount();
if($num>0){
//some html code
this is my while loop:
while ($row = $stmt->fetch(PDO::FETCH_ASSOC))
{
extract($row);
echo "<div class='inner'>";
//creating new table row per record
echo "<ul>";
echo "<li>";
echo "<a class='thumb' href='images/{$image}'>";
echo "<div class='product-id' style='display:none;'>{$id}</div>";
echo "<span class='hoodnamecarousel'>{$name}</span>";
echo"</a>";
echo "</li>";
echo "</ul>";
echo "</div>";
echo "</div>";
This is second part of displaying image after click on any image:
echo "<div id='thumbs2' style='display:none;'>";
echo "<div class='inner'>";
echo "<ul>";
echo "<li>";
echo "<a class='thumb' href='images/{$image}'></a>";
echo "<div class='product-id' style='display:none;'>{$id}</div>";
echo "<span class='hoodnamecarousel'>{$name}</span>";
echo "<br />";
echo "<span class='price'>{$price}</span>";
echo "<br />";
echo "<a href='add_to_cart.php?id={$id}&name={$name}' class='button btn btn-primary'>";
echo "افزودن به سبد <span class='glyphicon glyphicon-shopping-cart'></span>";
echo "</a>";
echo "</li>";
echo"</ul>";
echo "</div>";
echo "<div id='closeBtn'>بستن</div>";
}
echo "</div>";
echo "</div>";
}
else {
echo "محصولات در حال بروزرسانی می باشند.";
}
?>
this code only display 1 image and doesn't show other images from database
please help me!

PHP Counting With Related Articles

my goal is to display related articles below a post (check if available, then loop through the ones that are there). It works fine if I have 3 or 6 setup but if I have only 5, it displays automatically the original post as the sixth related article.
echo "<div class='related-posts'>";
$related_articles = get_field('related_articles', false, false);
$id = $related_articles[0];
if($id) {
echo "<h5 class='related-posts_h'>Ähnliche Artikel, die du lesen musst</h5>";
echo "<ul class='related-posts_list clearfix'>";
for ($i=1; $i <= 6; $i++) {
$id = $related_articles[$i-1];
if ( has_post_thumbnail($id) ) {
echo "<li class='related-posts_item'>";
echo "<figure class='featured-thumbnail thumbnail large'>";
echo "<div class='hider-page'></div>";
echo "<a href='".get_permalink($id)." title='".get_the_title($id)."'>";
echo get_the_post_thumbnail( $id, 'medium-thumb' );
echo "<span class='zoom-icon'></span>";
echo "</a>";
echo "</figure>";
} else {
"<figure class='thumbnail featured-thumbnail'>";
echo "<div class='hider-page'></div>";
echo "<a href='".get_permalink($id)."' title='".get_the_title($id)."'>";
echo "<img src='".get_template_directory_uri()."/images/empty_thumb.gif' alt='".get_the_title($id)."' />";
echo "</a>";
echo "</figure>";
}
echo "<h6><a href='".get_permalink($id)."'>";
echo get_the_title($id);
echo "</a>";
echo "</h6>";
echo "</li>";
}
echo "</ul>";
echo "</div><!-- .related-posts -->";
Try this.. check after the for loop whether the related Post ID is not equals to the original post ID then only display the related Posts
that is
$id = $related_articles[$i-1];
if(get_the_ID() != $id){
//then do the stuff
}
I Hope you are in the details or single.php page so you will get the ID of original post by get_the_ID()
echo "<div class='related-posts'>";
$related_articles = get_field('related_articles', false, false);
$id = $related_articles[0];
if($id) {
echo "<h5 class='related-posts_h'>Ähnliche Artikel, die du lesen musst</h5>";
echo "<ul class='related-posts_list clearfix'>";
for ($i=1; $i <= 6; $i++) {
$id = $related_articles[$i-1];
if(get_the_ID() != $id){
if ( has_post_thumbnail($id) ) {
echo "<li class='related-posts_item'>";
echo "<figure class='featured-thumbnail thumbnail large'>";
echo "<div class='hider-page'></div>";
echo "<a href='".get_permalink($id)." title='".get_the_title($id)."'>";
echo get_the_post_thumbnail( $id, 'medium-thumb' );
echo "<span class='zoom-icon'></span>";
echo "</a>";
echo "</figure>";
} else {
"<figure class='thumbnail featured-thumbnail'>";
echo "<div class='hider-page'></div>";
echo "<a href='".get_permalink($id)."' title='".get_the_title($id)."'>";
echo "<img src='".get_template_directory_uri()."/images/empty_thumb.gif' alt='".get_the_title($id)."' />";
echo "</a>";
echo "</figure>";
}
echo "<h6><a href='".get_permalink($id)."'>";
echo get_the_title($id);
echo "</a>";
echo "</h6>";
echo "</li>";
}
}
echo "</ul>";
echo "</div><!-- .related-posts -->";

Categories