Title: Using the_post_thumbnail() inside inline css
Last modified: August 20, 2016

---

# Using the_post_thumbnail() inside inline css

 *  [contactaidandelaney](https://wordpress.org/support/users/contactaidandelaneygmailcom/)
 * (@contactaidandelaneygmailcom)
 * [13 years, 9 months ago](https://wordpress.org/support/topic/using-the_post_thumbnail-inside-inline-css/)
 * Hi, I want to call the the_post_thumbnail() feature image on specific page templates
   as a css div background. I am doing this inside my functions.php inside a child
   theme. I need to call a different background image inside a banner section of
   the page template for different pages.
 * My code is:
 *     ```
       function venuebanner() { ?>
   
       <div id="banner-var" style="background: #333 url(<?php the_post_thumbnail();?> ) no-repeat center top;">
       <div id="wrap" class="container">
       <?php myvenue_navbar(); ?>
       </div> <!--id="wrap" class="container" -->
       </div> <!--banner -->
   
       	<? }
       ```
   

Viewing 4 replies - 1 through 4 (of 4 total)

 *  [Michael](https://wordpress.org/support/users/alchymyth/)
 * (@alchymyth)
 * [13 years, 9 months ago](https://wordpress.org/support/topic/using-the_post_thumbnail-inside-inline-css/#post-2975970)
 * [http://wordpress.org/support/topic/getting-post-thumbnail-url?replies=12](http://wordpress.org/support/topic/getting-post-thumbnail-url?replies=12)
 *  Thread Starter [contactaidandelaney](https://wordpress.org/support/users/contactaidandelaneygmailcom/)
 * (@contactaidandelaneygmailcom)
 * [13 years, 9 months ago](https://wordpress.org/support/topic/using-the_post_thumbnail-inside-inline-css/#post-2975977)
 * Thanks alchymyth!
 * That has somewhat fixed my problem, but thrown up its own set of issues. I have
   amended to code to set the_post_thumbnail inside a variable and I call that variable
   inside the css:
 *     ```
       function venuebanner() {
       $url = the_post_thumbnail();
       ?>
       <div id="banner-var" style="background: #333 url(<?=$url?>) no-repeat center top;">
       	<div id="wrap" class="container">
       		<?php myvenue_navbar(); ?>
       	</div> <!--id="wrap" class="container" -->
       </div> <!--banner -->
       ```
   
 * But it has caused the rest of my CSS to misbehave; the navigation I’m calling:
   <?php myvenue_navbar(); ?> is acting as if it is not inside the parent div: <
   div id=”banner-var” >
 * You can see the issue here:
    [http://www.dinnri.com/wordpress/index.php/brooks-cafe-bar/](http://www.dinnri.com/wordpress/index.php/brooks-cafe-bar/)
 *  Thread Starter [contactaidandelaney](https://wordpress.org/support/users/contactaidandelaneygmailcom/)
 * (@contactaidandelaneygmailcom)
 * [13 years, 9 months ago](https://wordpress.org/support/topic/using-the_post_thumbnail-inside-inline-css/#post-2975987)
 * Actually, on closer inspection it appears that what I had done was call the the_post_thumbnail();
   rather than put it inside a variable. I amend the code and all is working perfectly.
   Many thanks alchymyth. For anyone interested this is my completed code:
 *     ```
       function venuebanner() {
       $thumb = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'thumbnail_size' );
       $url = $thumb['0'];
       ?>
       <div id="banner-var" style="background: #333 url(<?=$url?>) no-repeat center top;">
       	<div id="wrap" class="container">
       		<?php myvenue_navbar(); ?>
       	</div> <!--id="wrap" class="container" -->
       </div> <!--banner -->
   
       	<? }
       ```
   
 *  [Michael](https://wordpress.org/support/users/alchymyth/)
 * (@alchymyth)
 * [13 years, 9 months ago](https://wordpress.org/support/topic/using-the_post_thumbnail-inside-inline-css/#post-2975997)
 * be aware when using php shorttags `<?` that they might work ok in your server,
   but they are not supported by all servers.

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Using the_post_thumbnail() inside inline css’ is closed to new replies.

## Tags

 * [the_post_thumbnail](https://wordpress.org/support/topic-tag/the_post_thumbnail/)

 * In: [Everything else WordPress](https://wordpress.org/support/forum/miscellaneous/)
 * 4 replies
 * 2 participants
 * Last reply from: [Michael](https://wordpress.org/support/users/alchymyth/)
 * Last activity: [13 years, 9 months ago](https://wordpress.org/support/topic/using-the_post_thumbnail-inside-inline-css/#post-2975997)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics