Add Post Thumbnail to custom container widget

Community Forums Forums Design Tips and Tricks Add Post Thumbnail to custom container widget

This topic is: resolved

This topic contains 1 reply, has 2 voices, and was last updated by  braddalton 1 year, 2 months ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #54084

    musicmeg
    Participant
    Post count: 5

    I created a custom widget container above my content. (Picture here: http://i1282.photobucket.com/albums/a537/singinglawlady/ScreenCaptureatSunAug4074157CDT2013.png~original)

    What I want to do is add the post thumbnail in each of the categories. So when a new post in that category is posted, the thumbnail automatically updates.
    Here is the code in my functions file:

    genesis_register_sidebar( array(
            'id'            => 'x_widget',
            'name'          => __( 'Homepage Below Menu' ),
            'description'   => __( 'This is below the bottom menu of the homepage.' ),
    ) );
    
    	add_action( 'genesis_before_content', 'widget_before_content' );
    	function widget_before_content() {
     	   echo '<div id="x_widget">';
    		echo '<a href="/blogtest/category/review/" class="feat_img"><div class="promo_sect"><div class="promo_sect_img" style="background-image: url(<?php echo $thumb_src[0];?> ) !important;"></div>BOOK REVIEWS</div></a>';
    		echo '<a href="/blogtest/category/cover-reveal/" class="feat_img"><div class="promo_sect"><div class="promo_sect_img" style="background-image: url( get_post_thumbnail_id($post->ID);"></div>COVER REVEALS</div></a>';
    		echo '<a href="/blogtest/category/GIVEAWAYS/" class="feat_img"><div class="promo_sect"><div class="promo_sect_img" style="background-image: url( get_post_thumbnail_id($post->ID);"></div>GIVEAWAYS</div></a>';
    		echo '<a href="/blogtest/category/Book-News/" class="feat_img"><div class="promo_sect"><div class="promo_sect_img" style="background-image: url( get_post_thumbnail_id($post->ID);"></div>BOOK NEWS</div></a>';
    		echo '<a href="/blogtest/category/cover-reveal/" class="feat_img"><div class="promo_sect"><div class="promo_sect_img" style="background-image: url( get_post_thumbnail_id($post->ID);"></div>COVER REVEALS</div></a>';
        	echo '</div>';
    }
    

    Is there an easier or different way to do this? I have the CSS styling done, but I can’t figure out how to make the post thumbnail show up without manually putting the image url inside the background-image: url ( field. I am clearly not a pro, so any and all help is appreciated.

    http://readingbookslikeaboss.com
    #54336

    braddalton
    Participant
    Post count: 10248

    Another option would be to create multiple widget areas side by side and drag in the Genesis featured posts widgets with the settings to display 1 post so only the latest post thumbnail displays.

    You could use existing code from another child theme which includes widgets side by side and add more widgets to the PHP code as well as modify the CSS.

    I did see what you have done and thinks its a great idea however there are different ways to code the same solution.

    How may thumbnails did you want to display in a horizontal row?


Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.