How to get the WordPress post thumbnail (featured image) URL? - php

I am using this function to get the featured images:
<a href="#" rel="prettyPhoto">
<?php the_post_thumbnail('thumbnail'); ?>
</a>
Now I want to get the full featured image on click on the anchor tag for which I need a featured image URL in
<a href="here" rel="prettyPhoto">
How can I fix this?

Check the code below and let me know if it works for you.
<?php if (has_post_thumbnail( $post->ID ) ): ?>
<?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'single-post-thumbnail' ); ?>
<div id="custom-bg" style="background-image: url('<?php echo $image[0]; ?>')">
</div>
<?php endif; ?>

If you want JUST the source, and not an array with other information:
<?php $url = wp_get_attachment_url( get_post_thumbnail_id($post->ID), 'thumbnail' ); ?>
<img src="<?php echo $url ?>" />

// Try it inside loop.
<?php
$feat_image = wp_get_attachment_url( get_post_thumbnail_id($post->ID) );
echo $feat_image;
?>

Easy way!
<?php
wp_get_attachment_url(get_post_thumbnail_id(get_the_ID()))
?>

This perfectly worked for me:
<?php echo get_the_post_thumbnail_url($post_id, 'thumbnail'); ?>

I think this is the easiest solution and the updated one:
<?php the_post_thumbnail('single-post-thumbnail'); ?>

This is the simplest answer:
<?php
$img = get_the_post_thumbnail_url($postID, 'post-thumbnail');
?>

You can try this:
<?php
$feat_image = wp_get_attachment_url(get_post_thumbnail_id($post->ID));
echo $feat_image;
?>

Try this one
<?php
echo get_the_post_thumbnail($post_id, 'thumbnail', array('class' => 'alignleft'));
?>

I had searched a lot and found nothing, until I got this:
<?php echo get_the_post_thumbnail_url( null, 'full' ); ?>
Which simply give you the full image URL without the entire <img> tag.
Hope that can help you.

You can try this.
<?php
$image_url = wp_get_attachment_url( get_post_thumbnail_id($post->ID) );
?>
<a href="<?php echo $image_url; ?>" rel="prettyPhoto">

You can also get it from post_meta like this:
echo get_post_meta($post->ID, 'featured_image', true);

You can also get the URL for image attachments as follows. It works fine.
if (has_post_thumbnail()) {
$image = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), 'medium');
}

You will try this
<?php $url = wp_get_attachment_url(get_post_thumbnail_id($post->ID), 'full'); ?> // Here you can manage your image size like medium, thumbnail, or custom size
<img src="<?php echo $url ?>"
/>

<?php
if (has_post_thumbnail( $post->ID ) ):
$image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'single-post-thumbnail' );
?>
<img src="<?php echo $image[0]; ?>">
<?php endif; ?>

If the post is an image and we already know what the image is, it's possible to get the thumbnail URL without too much hassle:
echo pathinfo($image->guid, PATHINFO_DIRNAME);

Simply inside the loop write <?php the_post_thumbnail_url(); ?> as shown below:-
$args=array('post_type' => 'your_custom_post_type_slug','order' => 'DESC','posts_per_page'=> -1) ;
$the_qyery= new WP_Query($args);
if ($the_qyery->have_posts()) :
while ( $the_qyery->have_posts() ) : $the_qyery->the_post();?>
<div class="col col_4_of_12">
<div class="article_standard_view">
<article class="item">
<div class="item_header">
<img src="<?php the_post_thumbnail_url(); ?>" alt="Post">
</div>
</article>
</div>
</div>
<?php endwhile; endif; ?>

if you want to fetch full image size from post thumbnail you can use this code.
$img_url = wp_get_attachment_image_url(get_post_thumbnail_id(get_the_ID()), 'full');
<img src="<?PHP echo $img_url?> ">
here, get_the_ID() is post id.

Use:
<?php
$image_src = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), 'thumbnail_size');
$feature_image_url = $image_src[0];
?>
You can change the thumbnail_size value as per your required size.

You can also get the URL for image attachments as follows:
<?php
"<div>".wp_get_attachment_url(304, array(50,50), 1)."</div>";
?>

You can get image src for specific size by wp_get_attachment_url function.
<?php
$url = wp_get_attachment_url( get_post_thumbnail_id($post->ID), 'full' );
?>
<img src="<?php echo $url ?>" />

<img src="<?php echo get_post_meta($post->ID, "mabp_thumbnail_url", true); ?>" alt="<?php the_title(); ?>" width ="100%" height ="" />

Related

Get featured image alt text wordpress

I'm trying to simple display the alt text for an image that is set in our WP library.
I tried this
<?php $image_id = get_post($id); ?>
<?php $image_alt = get_post_meta($image_id, '_wp_attachment_image_alt', true); ?>
<img class="photo" src="<?php echo the_post_thumbnail_url() ?>" alt="<?php echo $image_alt ?>"/>
But it isn't displaying the alt text when I do that. Anything I'm doing wrong?
If the image is the featured image and you see it correctly, try this:
<?php
$thumbnail_id = get_post_thumbnail_id( $post->ID );
$thumbnail_alt = get_post_meta( $thumbnail_id, '_wp_attachment_image_alt', true );
?>
<img class="photo" src="<?php echo the_post_thumbnail_url() ?>" alt="<?php echo $thumbnail_alt ?>"/>
Let me know if you can solve it
THIS WORKED FOR ME
The complete code I used to display the featured image with its alt text
<img src="<?php echo get_the_post_thumbnail_url(); ?>" alt="<?php echo get_post_meta( get_post_thumbnail_id(), '_wp_attachment_image_alt', true); ?> "/>
For the image src
<?php echo get_the_post_thumbnail_url(); ?>
For the alt text
<?php echo get_post_meta( get_post_thumbnail_id(), '_wp_attachment_image_alt', true); ?>
PS. Make sure you actually give your featured image some alt text in the backend.
Hope it helps someone in the future.

How to create my own custom image size for a ACF gallery

I'm using Advanced Custom Fields to create an image gallery. At the moment I have the image size set to thumbnail I tried setting it to medium but it didn't work so I don't know if I'm missing something. But I would like to create my own image size anyway. So how would I do this? I was looking on the ACF site but it seems to have gone down.
<div class="container">
<div class="row">
<div class="col-md-12">
<?php
$image_ids = get_field('gallery', false, false);
$shortcode = '[gallery ids="' . implode(',', $image_ids) . '"]';
echo do_shortcode( $shortcode );
?>
<?php
$images = get_field('gallery');
if( $images ): ?>
<ul>
<?php foreach( $images as $gallery_images ): ?>
<li>
<a href="<?php echo $gallery_images['url']; ?>">
<img src="<?php echo $gallery_images['sizes']['thumb-nail']; ?>" alt="<?php echo $gallery_images['alt']; ?>" />
</a>
<p><?php echo $gallery_images['caption']; ?></p>
</li>
<?php endforeach; ?>
</ul>
<?php endif; ?>
</div>
</div>
</div>
Generally, thumbnail is written 'thumbnail' and not thumb-nail. Maybe this is it ?
Also, to create a custom image size in Wordpress, you need to add it to your functions.php file. Something like add_image_size( 'my-new-size', 220, 180, true );
see https://developer.wordpress.org/reference/functions/add_image_size/
<?php
$images = get_field('immagine');
if( $images ): ?>
<?php foreach( $images as $image ): ?>
<li><img src="<?php echo $image['sizes']['large']; ?>" alt="<?php echo $image['alt']; ?>"></li>
<?php endforeach; ?>
<?php endif; ?>

Return Featured Image for Each Post? (Wordpress)

I'm looking for some assistance in returning the featured image URL for each post on my website. The code I'm currently using only returns the value of the first post on the page.
Here's what I'm working with:
<?php if (has_post_thumbnail( $post->ID) ): ?>
<?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID), 'single post thumbnail'); ?>
<div class="comments-bg-image" style="background-image: url('<?php echo $image[0]; ?>'" </div>
<?php endif; ?>
Any help would be much appreciated, thanks!
WordPress' wp_get_attachment_image_src only takes specific string keywords for the $size parameter, which are:
thumbnail
medium
large
full
See below:
<?php if (has_post_thumbnail($post->ID)) : ?>
<?php $image = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), 'large'); ?>
<div class="comments-bg-image" style="background-image: url('<?php echo $image[0]; ?>'"></div>
<?php endif; ?>
At a glance, I noticed the closing > on your div.comments-bg-image element was missing, although I doubt that's the cause of the issue you're having. ;)
Resources:
Function Reference/wp_get_attachment_image_src

Wordpress featured image as div background image

How can I set the featured images on all my posts to be outputted as a background image to a div. For example
<div class="postimg" style="background-image:url('https://s3.amazonaws.com/ooomf-com-files/8jLdwLg6TLKIQfJcZgDb_Freedom_5.jpg')"></div>
Currently the featured image is being outputted as a regular image using this helper <?php the_post_thumbnail( 'wpbs-featured' ); ?>
I would suggest simply something along the lines of this
Get post featured image URL and echo it out accordingly:
<?php
$img = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), "full");
$img = $img[0];
?>
<div class="postimg" style="<?php if($img){echo 'background:url('.$img.');';} ?>">
</div>
Use this
<div style="background-image:url('<?php echo wp_get_attachment_url( get_post_thumbnail_id() );?>')"></div>
Try this...
<?php if (has_post_thumbnail( $post->ID ) ): ?>
<?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'single-post-thumbnail' ); ?>
<div id="custom-bg" style="background-image: url('<?php echo $image[0]; ?>')">
</div>
<?php endif; ?>

Turning a submitted image from frontend into a link to its own source

This is a wordpress related question. I want to turn an image that was submitted via frontend submission form where you provide the external url into an image that links to its own source. For ex. http://i.imgur.com/7qmFBPa.jpg would be the end result of clicking on the image link. Heres what the php looks like at the moment:
<?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'single-post-thumbnail' ); ?>
<?php if ( has_post_thumbnail() ) { ?>
<div class = 'span4 reddit-image-single pull-left'>
<img src = "<?php echo $image[0]; ?>" width = "700px" class="img-rounded">
</div>
<?php }else{ ?>
<div class = 'span4 reddit-image-single pull-left'>
<img src = "<?php echo get_post_meta( $post->ID, 'wpedditimage', true ); ?>" width = "700px" class="img-rounded">
</div>
<?php } ?>
how do i go about modifying the above code? I'm fairly new to PHP.
wrap the image in tags with the url as the href
<?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'single-post-thumbnail' ); ?>
<?php if ( has_post_thumbnail() ) { ?>
<div class = 'span4 reddit-image-single pull-left'>
<img src = "<?php echo $image[0]; ?>" width = "700px" class="img-rounded">
</div>
<?php }else{ ?>
<div class = 'span4 reddit-image-single pull-left'>
<img src = "<?php echo get_post_meta( $post->ID, 'wpedditimage', true ); ?>" width = "700px" class="img-rounded">
</div>
<?php } ?>
This is the main line you want to look at
<img src = "<?php echo $image[0]; ?>" width = "700px" class="img-rounded">

Categories