The below code pulls in all the thumbnails of posts in a category when you are viewing one of the posts in that category. I need to link the title of the post to the image.
<div id="workSlider" class="flexslider">
<ul class="slides">
<?php while (have_posts()) : the_post(); ?>
<?php $workthumb = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ),'full' );
if( $workthumb && $currentID != $post->ID ) {
echo '<li><img src="'. $workthumb[0].'" ></li>';
}
?>
<?php endwhile; ?>
</ul>
</div>
Try echo '<li><img src="'. get_the_title() .'" ></li>'; I think this will work.
Related
I am displaying product images on product page using ACF. Only permalink and title is displaying and product pictures are not displaying instead of that broken thumbnails are displaying. My field type and return format is post object and here is my code:
<div class="col-md-12">
<?php
$featured_posts = get_field('products_images');
if( $featured_posts ): ?>
<ul>
<?php foreach( $featured_posts as $featured_post ):
$permalink = get_permalink( $featured_post);
$title = get_the_title( $featured_post);
$image = get_field('products_images');
?>
<li>
<?php
if ( !empty($image) ); ?>
<img src="<?php echo $image['url']; ?>" />
<?php echo esc_html( $title ); ?>
</li>
<?php endforeach; ?>
</ul>
<?php endif; ?>
</div>
So I have the below code that loops through my posts and displays posts in a list format. Here is the code that I'm using:
<?php while (have_posts()) : the_post(); ?>
<div class="one-sixth first"><?php the_post_thumbnail(); ?></div>
<div class="five-sixths"><?php the_title(); ?></div>
<?php endwhile; ?>
Here is the image with the thumbnail:
Here is when no post thumbnail is available, it just leaves an empty space:
If check thumbnail if have displayed otherwise display placeholder image. Hope this help you.
<?php
// Must be inside a loop.
if ( has_post_thumbnail() ) {
the_post_thumbnail();
}
else {
echo '<img src="' . get_bloginfo( 'stylesheet_directory' )
. '/images/placeholder.jpg" />';
}
?>
I'm trying to use a Wordpress slider and change the link on the thumbnail to the category URL instead of the permalink (while still pulling the thumbnail from the post). I started with a slider that used a permalink and the post thumbnail like so:
<li id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<a href="<?php echo the_permalink(); ?>" class="listing-link">
<?php
if ( true == $thumbnail ) {
// if the post has a feature image, show it.
if ( has_post_thumbnail() ) {
the_post_thumbnail( $thumbsize );
// else if the post has a mime type that starts with "image/" then show the image directly.
} elseif ( 'image/' == substr( $post->post_mime_type, 0, 6 ) ) {
echo wp_get_attachment_image( $post->ID, $thumbsize );
}
}
?>
<div class="title">
<?php the_title(); ?>
</div>
</a>
</li>
Using Wordpress Codex and tips from this related post, I've gotten as far as to change the title beneath the thumbnail correctly, but I can't seem to find the correct combination on the <a href="" piece to call the thumbnail's category URL. Is there a way to correctly do this? Here's where I'm at at this point:
<li id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<a href="<?php $categories = get_categories(); foreach ($categories as $cat) { $category_link = get_category_link($cat->cat_ID); } echo esc_url( $category_link ); ?>" class="home-category-link">
<?php
if ( true == $thumbnail ) {
// if the post has a feature image, show it.
if ( has_post_thumbnail() ) {
the_post_thumbnail( $thumbsize );
// else if the post has a mime type that starts with "image/" then show the image directly.
} elseif ( 'image/' == substr( $post->post_mime_type, 0, 6 ) ) {
echo wp_get_attachment_image( $post->ID, $thumbsize );
}
}
?>
<div class="title">
<?php the_category(); ?>
</div>
</a>
</li>
This is the closest I've gotten, but the URL is now pulling a category URL unrelated to the post. Not sure what I'm missing but any help is appreciated. Thanks!
How to assign links to thumbnail images. I have portfolio with thumbnail images of different websites and i have to add link to them.
<div class="showcase-image">
<?php
$thumbnail = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'large' );
if(has_post_thumbnail()): echo '<img src="'.$thumbnail[0].'"/>'; else: ?>
<?php endif; ?>
</div>
Try this
<div class="showcase-image">
<?php
$thumbnail = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'large' );
if(has_post_thumbnail()): echo '<a href="'.$thumbnail[0].'" > <img src="'.$thumbnail[0].'"/></a>'; else: ?>
<?php endif; ?>
</div>
When I add a image with either feature image or advanced costume fields on each blog post but the images also appear on my default blog page (index.php).
So my blog has 4 posts. My default blog page is showing the 4 blog posts it also displays the image set to each blog post.
Here's my in the header that displays the image:
if (have_posts()) : while (have_posts()) : the_post();
$attachment_id = get_field('banner_image');
if( get_field('banner_image') ):
$image = wp_get_attachment_image_src( $attachment_id, 'banner' );
?><img src="<?php echo $image[0]; ?>" alt="" width ="<?php echo $image[1]?>" height ="<?php echo $image[2]?>" /><?php
endif;
endwhile;
endif;?>
And then the code printing all my blog posts in index.php:
if (have_posts()) : while (have_posts()) : the_post(); ?>
<div class="news-artical">
<?php the_title('<h1>', '</h1>');
the_excerpt();
//var_dump($post);
?> <hr>
</div> <?php
endwhile;
Would really appreciate some help.
All right. The code in your header loops through all displayed posts on each page. If you want to display the image in header only on single post page, you have to wrap it into condition if ( is_single() ) : or if ( is_singular() ) : if you want to display header image also on single page.
if ( is_single() && have_posts()) : while (have_posts()) : the_post();
$attachment_id = get_field('banner_image');
if( get_field('banner_image') ):
$image = wp_get_attachment_image_src( $attachment_id, 'banner' );
?><img src="<?php echo $image[0]; ?>" alt="" width ="<?php echo $image[1]?>" height ="<?php echo $image[2]?>" /><?php
endif;
endwhile;
endif;?>