how to get url ONLY of featured image in wordpress - php

I'm using timthumb.php and need to be able to get the url of the featured image of a post, when I use functions like the_post_thumbnail it does more than just the url.
Here is the code so, the capital letters is where I need to insert the exact url, any help would be great, thanks.
<a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">
<img src="<?php bloginfo('template_url'); ?>/wp-content/themes/limerickfc/timthumb.php?src=<?php URL OF FEATURED IMAGE ?>&h=760&width=474" alt="" title="<?php the_title(); ?>" />
</a>

If your "thumbnail" images are large enough to do what you need:
<?php wp_get_attachment_url(get_post_thumbnail_id($post->ID)); ?>
Otherwise you'll need to go for something like:
<?php $src = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), array(300, 300), false, ''); echo $src[0]; ?>
EDIT: The array(300, 300) bit is the image size you'd like to fetch. WP will substitute any image it has that is at least as large as what you asked for. You can also use 'thumbnail', 'medium', 'large' or 'full' to select one of the pre-configured sizes, as well as any name defined by add_image_size() in your template or plugins.

First get the id of the featured thumbnail image:
$thumb_id = get_post_meta( $post_id, '_thumbnail_id', true );
One way to do it:
$thumb = get_post($thumb_id);
$thumb_url = $thumb->guid;
Another way would be:
$thumb_url = wp_get_attachment_url( $thumb_id );
Be careful about what is stored in the GUID and what is returned by get_attachment_url. The attachment url (depending on configuration) can be the page where the attachment is visitable (not the raw file URL but the page where attachment.php is used).

Related

ACF & Wordpress Media Library

I've got an ACF 'options page' with a placeholder image within, to fall back to if a client removes the image from the post/page by mistake. And I'm using the following code to handle this situation happening.
<?php
// Variables
$banner_image = get_field('banner_image');
$fallback_banner_image = get_field('fallback_image', 'options');
?>
<?php if ( $banner_image ): { ?>
<img class="hero-content" src="<?php echo esc_url( $banner_image_src[0] ); ?>" srcset="<?php echo esc_attr( $banner_image_srcset ); ?>" sizes="100vw" alt="<?php echo $banner_image_alt_text ?>">
<?php } elseif ( empty( $banner_image ) ): { ?>
<img class="hero-content" src="<?php echo esc_url( $fallback_banner_image_src[0] ); ?>" srcset="<?php echo esc_attr( $fallback_banner_image_srcset ); ?>" sizes="100vw" alt="<?php echo $fallback_banner_image_alt_text ?>">
<?php } endif; ?>
This works fine once pages or posts are saved.
However
The issue I have is if the page/post has been previously saved with an image and then a user deletes the image from the Media Library directly, the field doesnt become 'empty' so the content just disappears, rather than falling back to the placeholder image that I would like it to.
Any advice on how to handle images directly removed from the Media Library?
Thanks.
You can use attachment_url_to_postid. Using this function you can get post id from image url. if post id is not exists , user deleted the attachment before. so based on the result of this function you can actually test of attachment is deleted or not and use placeholder instead.
I've solved this issue using onerror for anyone with similar concerns.
I placed a folder, with a simple light grey placeholder image in it, in the root of my theme directory, so it can never be deleted by a user.
Then added the following to the end of my image tag. Seems to work perfectly when ever the media library images are removed by mistake.
<img src="<?php echo esc_url( $image_src[0] ); ?>" srcset="<?php echo esc_attr( $image_srcset ); ?>" sizes="(min-width: 1050px) 25vw, (min-width: 750px) 33.333vw, (min-width: 500px) 50vw, 100vw" alt="<?php echo $image_alt_text ?>" onerror="this.onerror=null;this.src='https://www.domain-name.co.uk/fallback-folder/missing-placeholder-img.jpg';">

Get post thumbnails in Wordpress

This is the code to get the image for post thumbnail, but the image is not found on the page.
Please suggest some ideas.
<?php
add_theme_support( 'post-thumbnails' );
the_post_thumbnail();
set_post_thumbnail_size( 50, 50);
echo get_post(get_post_thumbnail_id())->post_excerpt; ?>
Try this one to get image path and then after pass that path to image scr.
<?php
$image_id = get_post_thumbnail_id($post->ID);
$image_url = wp_get_attachment_image_src($image_id,'large', true); ?>
<a href="<?php the_permalink(); ?>"><img src="<?php echo $image_url[0]; ?>" />
</a>
<?php
}
?>
Try to used
get_the_post_thumbnail( $post_id, 'thumbnail' );
If you want to get thumbnail with custom width and height then used below code
get_the_post_thumbnail( $post_id, array( 100, 100) );
In array first element for width and second for height.
try to pass post id in function
$post_id = get_the_ID();
get_the_post_thumbnail( $post_id, 'thumbnail' );
Try this bro
First Method:
<?php
$imgId = get_post_thumbnail_id($post->ID);
$imgUrl = wp_get_attachment_image_src($imgId,'your image size', true);
?>
<img src="<?php echo $imgUrl[0]; ?>" />
Second Method:
$post_id = get_the_ID();
get_the_post_thumbnail( $post_id, 'your image size' );
Hope you find your solution

How to add Title Attribute to Wordpress Image on Attachment Page in TwentyEleven Theme?

This is a WP/SEO question related to adding the title attribute to the on an attachment page. We are using the twentyeleven theme and default image.php code, as below.
We want to pull in the title tag (or even automatically set the title for all images, so user doesn't have to individually set, or just use post title for the title - any of these).
The html from View Source looks like this:
The image.php code:
<a href="<?php echo esc_url( $next_attachment_url ); ?>" title="<?php the_title_attribute(); ?>" rel="attachment"><?php
$attachment_size = apply_filters( 'twentyeleven_attachment_size', 848 );
echo wp_get_attachment_image( $post->ID, array( $attachment_size, 1024 ) ); // filterable image width with 1024px limit for image height.
?></a>
I also wanted all my attachments to automatically have a title attribute, so I wrote the following PHP code:
<?php if(wp_attachment_is_image($post->id)) : $att_image = wp_get_attachment_image_src($post->id, "full"); ?><p class="attachment"><a class="show_image" rel="bookmark" href="<?php echo wp_get_attachment_url($post->id); ?>" title="<?php echo get_the_title(); ?>"><img class="img-responsive attachment-medium" src="<?php echo $att_image[0]; ?>" height="<?php echo $att_image[2];?>" width="<?php echo $att_image[1];?>" alt="<?php echo get_the_title(); ?>"></a></p><?php endif; ?>
This PHP code has been tested on WordPress 3.7.1. A live example of this code being used on a custom WordPress image.php file can be found on my Web Development & Design Blog

Wordpress gallery displays all the images attached to a post/page

Wordpress galleries have a strange way to work, in my opinion. I explain:
Wordpress gallery shows in the post ONLY the images that have been
uploaded in the current post. If you add in the gallery an image that
already was in Media library, it will not be showed!
After having create a gallery, if I remove an image from the gallery
it will be showed anyway
The gallery displays all the images attached to the post (also
featured thumbnail and embedded images) although these images were
not included in the gallery
I'd call all of this a bug.
The question: Is it possible to show in the post ONLY the images (both the uploaded ones and the ones that already was in Media libray) that are included in the gallery?
Notice: without using the shortcode [gallery exclude="..."] and without uploading the images directly from Media library?
P.S. To display the gallery in the post I'm using this script:
<ul>
<?php $images = get_children('post_type=attachment&post_mime_type=image&post_parent=' . $post->ID . '&orderby=menu_order&order=ASC');
foreach( $images as $img_id => $img_r ) :
$thumb = wp_get_attachment_image_src( $img_id, 'thumb', true );
$full = wp_get_attachment_image_src( $img_id, 'full', true ); ?>
<li>
<a href="<?php echo $full[0] ?>">
<img src="<?php echo $thumb[0] ?>" alt="<?php echo get_the_title( $img_id ) ?>" title="<?php echo get_the_title( $img_id ) ?>">
</a>
</li>
<?php endforeach; ?>
</ul>
That is not a bug, that's just how the gallery works. It will only display images attached to a post, if you want to add an already-uploaded image to the gallery then you'll need to attach the image to the post from the Media menu.
You can use gallery shortcode to display the images or alternatively you can use the codes on http://www.wpcodesnipps.com/display-images-attached-post/ to display the images.

PHP foreach echo as soon as image has loaded

I currently have some php code which gets the thumbnail of random Wordpress posts but the problem is when I run it none of the images show until every image has been downloaded. I was wondering if there is a way to echo the image then go to the next one. Thanks.
<?php
$args = array( 'numberposts' => 25, 'orderby' => 'rand' );
$rand_posts = get_posts( $args );
foreach( $rand_posts as $post ) : ?>
<?php $url = wp_get_attachment_url( get_post_thumbnail_id($post->ID) );?>
<li id="photo-<?php the_ID(); ?>" class="visible scroll-content-item ui-widget-header"><img width="80" height="80" src="<?php echo $url; ?>" class="attachment-small-grid wp-post-image" alt="<?php the_title(); ?>" title="<?php the_title(); ?>" /> </li>
<?php endforeach; ?>
PHP cannot tell you when an image has downloaded, as it is a server side language. You have to use javascript to write code based on browser based events, like images loading.
www.farinspace.com/jquery-image-preload-plugin/
That jQuery plugin will let you execute functions based on each image loading, and then on all images loading... I might start there.

Categories