WordPress

How to Get WordPress Post Featured Image URL & Post Thumbnail

Featured-Image-URL-WordPress

Nowadays developer needs the direct URL of featured image and it is mostly possible when the featured image is used as a header or the post background image.

Place the following code snippet in the files including single.php, post.php, and template.php to get the URL:

<?php
$blog_fetrdimg = wp_get_attachment_url( get_post_thumbnail_id($post->ID) );
?>
<div class="blog-featured-image"
<?php if( $blog_fetrdimg ) : ?>
style="blog-featured-background-image: url(<?php echo $blog_fetrdimg; ?>);"
<?php endif; ?>
>
</div>

Use the following CSS snippet to style the featured image:

. blog-featured-image {
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: cover;
width: 100%;
}

Get Single Post Thumbnail

For enabling the support for the featured image in post and pages use the following snippet code. The snippet will be enabled in single.php

<?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=" blog-featured-image: url('<?php echo $image[0]; ?>')">

</div>
<?php endif; ?>

 

Related posts

How to Create Gutenberg Block Templates in WordPress

WPiTech

7 Best Managed WordPress Hosting Providers [2019]

WPiTech

Enable Gutenberg Editor in Custom Post Types

WPiTech