Community Forums › Forums › Archived Forums › Design Tips and Tricks › Add Post Thumbnail to custom container widget
Tagged: custom sidebar, functions, post thumbnail
- This topic has 1 reply, 2 voices, and was last updated 10 years, 7 months ago by Brad Dalton.
-
AuthorPosts
-
August 4, 2013 at 6:49 am #54084musicmegMember
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.comAugust 5, 2013 at 10:58 pm #54336Brad DaltonParticipantAnother 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?
-
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.