I'm creating my first wordpress theme, I can't figure out why the post thumbnails aren't showing. it just does nothing(no errors). Here is my code:
<?php
$args = array( 'posts_per_page' => 3, 'category' => 6);
$postslist = get_posts( $args );
foreach ( $postslist as $post ) :
setup_postdata( $post );
?>
<div class="col-xs-12 col-sm-4">
<h4><?php the_title(); ?></h4>
<?php get_the_post_thumbnail('small'); ?>
<p><?php the_excerpt(); ?></p>
</div>
<?php
endforeach;
wp_reset_postdata();
?>
I'm using HTML5Blank Theme. And it supports thumbnails. this is the code for it in my functions.php file:
add_theme_support('post-thumbnails');
add_image_size('large', 700, '', true);
add_image_size('medium', 250, '', true);
add_image_size('small', 120, '', true);
add_image_size('custom-size', 700, 200, true);
You need to echo it like this echo get_the_post_thumbnail('small');get_ functions store the data, they don't actually return it which is why you have to echo. They are useful in many cases like you could store it in a variable like $thumb-small = get_the_post_thumbnail('small'); and reuse it throughout the page.
I think this is a small typing error:
samll -> small
the the_post_thumbnail function also used for get post image you can also do by this way.
<?php
if ( has_post_thumbnail() ) {
the_post_thumbnail('small');
}
?>
Related
I need to decrease the height of the image attached in the wordpress page. i had tried several methods but i am unable to solve it.It is not getting any change when i am adding image size Topbannerimg in img src.
my wp_query to dispaly image
<?php
$homepage = get_page_by_title('Top Banner');
$attachments = get_posts( array(
'post_type' => 'attachment',
'posts_per_page' => -1,
'post_parent' => $homepage->ID,
) );
if ( $attachments ) {
echo '<section class="topBanner">';
foreach ( $attachments as $attachment ) { ?>
<a href="<?php if($attachment->post_excerpt){echo $attachment->post_excerpt;}else{echo "#";}?>">
<img src="<?php echo wp_get_attachment_url($attachment->ID); ?>">
</a>
<?php }
echo '</section>';
}
wp_reset_postdata();?>
size mentioned in functions.php
add_image_size( 'TopBannerImg', 1800, 500, true );
You can use wp_get_attachment_image function to display image. Please refer: https://developer.wordpress.org/reference/functions/wp_get_attachment_image/.
Pass image thumbnail name as second paremeter.
Checkout this code:
First parameter for width and second for height.
<?php the_post_thumbnail( array( 480, 277 ) ); ?>
I have created a very simple plugin for my Wordpress site to display links to my most recent posts with the use of a shortcode ([recentposts]). The plugin works so far but I am struggling with finding a way to display the featured image for each post that is called in the <div> tags for each post link.
Can you please advise how I may do this. The code for my plugin is as follows:
<?php
/*
Plugin Name: Blog Display Blocks
Description: Plugin to display blog posts in block with shortcode
Author: Chris Brosnan
*/
function RecentPosts() {
$recent_posts = wp_get_recent_posts(6);
echo '<div class="blog-contain">';
foreach( $recent_posts as $recent ){
echo '<div class="third-box">' . $recent["post_title"].' </div> ';
}
};
echo '</div>';
add_shortcode('recentposts', 'RecentPosts');
register_activation_hook( __FILE__, array( 'Blogdisplay', 'plugin_activation' ) );
register_deactivation_hook( __FILE__, array( 'Blogdisplay', 'plugin_deactivation' ) );
?>
What would I need to do in order to show the featured image alongside the corresponding link for each post that is called?
Through trial and error combined with some further searching I have now found the solution to my question.
<?php
/*
Plugin Name: Blog Display Blocks
Description: Plugin to display blog posts in block with shortcode
Author: Chris Brosnan
*/
add_image_size( 'featured-thumb', 300, 200, true ); // (cropped)
function RecentPosts() {
$rPosts = new WP_Query();
$rPosts->query('showposts=6');
while ($rPosts->have_posts()) : $rPosts->the_post(); ?>
<?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'featured-thumb' ); ?>
<?php $image_url = $image[0]; ?>
<a href="<?php the_permalink(); ?>">
<div class="third-box" style="background-image: url(<?php echo $image_url; ?>);">
<p><?php the_title();?></p>
</div>
</a>
<?php endwhile;
wp_reset_query();
};
add_shortcode('recentposts', 'RecentPosts');
register_activation_hook( __FILE__, array( 'Blogdisplay', 'plugin_activation' ) );
register_deactivation_hook( __FILE__, array( 'Blogdisplay', 'plugin_deactivation' ) );
?>
Within your code by using wp_get_recent_posts() you will get the post id($recent["ID"]), then you can use any one of following,
just add this in your code where you want to show the featured image.
$image = wp_get_attachment_image_src( get_post_thumbnail_id( $recent["ID"] ), 'single-post-thumbnail' );
or can use
echo get_the_post_thumbnail($recent["ID"], 'featured-image');
I m new to wordpress and using 4.2.2 version. I need to show mouse over background color with text on image. The given text and images are generating dynamically from the admin panel. I have given the below images for your reference, first image right now im having my site, and next image I need to do like that.
Thanks in advance!
You can use this function for wordpress
<?php wp_get_attachment_image( $attachment_id, $size, $icon, $attr ); ?>
or
<?php wp_get_attachment_metadata( $attachment_id, $unfiltered ); ?>
Here is the codex
https://codex.wordpress.org/Function_Reference/wp_get_attachment_image
https://codex.wordpress.org/Function_Reference/wp_get_attachment_metadata
With this u can get the name of the image and show like the Sagar said
You'll use this in your page, not in yout functions.php
U won't be this in the functions, you'll use this in your page, like this
<?php
$my_query = new WP_Query('post_type=eventos&category_name=galeria_evento&posts_per_page=1');
while ($my_query->have_posts()) : $my_query->the_post();
?>
<?php
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
$args = array(
'post_type' => 'attachment',
'post_parent' => $post->ID,
'numberposts' => -1,
'paged' => get_query_var('paged'),
'exclude' => get_post_thumbnail_id()
);
// making the list of the attachments
$attachments = get_posts( $args );
if ( $attachments ) {
foreach ( $attachments as $attachment ) {
// getting the image and title of the attachment
echo "<div class='item-slide'><p class='title-slide'>".apply_filters( 'the_title', $attachment->post_title )."</p>".wp_get_attachment_image( $attachment->ID, 'full' )."</div>";
}
}
?>
<?php endwhile; ?>
I have this PHP Wordpress Loop which is getting articles from a tag
<?php
// Fetch all posts relating to a certain tag then display 4 of them
$args = array('numberposts' => 4, 'tag_slug__and' => array('tomb-raider'));
$postslist = get_posts( $args );
foreach ($postslist as $post) : setup_postdata($post);
?>
<?php
//Get the Thumbnail URL
$src = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), array( 720,405 ), false, '' );
?>
<li class="promo-list-item" style="background-image: url(' <?php echo $src[0];?> '); background-repeat: no-repeat; background-size: cover;"> </li>
<?php endforeach ?>
For some reason having this on the webpages causes all the other PHP below it to stop working. Removing this code makes the other PHP work again.
Also do you know a way of getting using a tag attached to a post as the tag to search for in the tag-slug array? Trying to get it more dynamic than having to manually enter a tag slug.
Your missing the ; at the end of your last endforeach statement.
Probably causing an error.
Fixed:
Just for others that might have the same issue.
I forgot to reset the post data using this at the end of the loop after the .
<?php
// Fetch all posts relating to a certain tag then display 4 of them
$args = array('numberposts' => 4,'tag_slug__in' => array('tomb-raider'));
$postslist = get_posts( $args );
foreach ($postslist as $post) :
$src = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), array(
720,405 ),false, '' );
echo '<li class="promo-list-item" style="background-image:
url("'.$src[0].'"); background-repeat: no-repeat; background-size: cover;">
</li>';
endforeach; ?>
I am using advanced custom fields in Wordpress. Without going into the details of how it works, I have a "repeater field" which lets the users add as many images to an aera of the backend as they please. To show these images, I use the following code (inside wordpress loop)
<?php if(get_field('slider_images')): ?>
<?php while(the_repeater_field('slider_images')): ?>
<?php
$attachment_id = get_sub_field('work_slider_image');
$size = "homepage";
$image = wp_get_attachment_image_src( $attachment_id, $size );
echo $image[0];
?>
<?php endwhile; endif; ?>
The goal here is to create an array of image URLS and to only display the FIRST one. On other pages they will all be used, but on this page, I want to grab ONLY the first image, hence the echo $image[0];
For some reason, it is showing all of the uploaded images, and when I print the variable $image, it returns:
Array ( [0] => http://sitename.com/agsinfo/wp-content/uploads/2012/07/1.jpg [1] => 392 [2] => 165 [3] => )
After seeing this, it would make sense to me that echo $image[0]; would work, but for some reason its not. Any ideas?
<?php if(get_field('slider_images')): ?>
<?php while(the_repeater_field('slider_images')): ?>
<?php
$attachment_id = get_sub_field('work_slider_image');
$size = "homepage";
$image[] = wp_get_attachment_image_src( $attachment_id, $size );
?>
<?php endwhile;
echo $image[0];
endif; ?>