Sridhar Katakam

Genesis and WordPress Tutorials

Themes

  • Home
  • About
  • Archive
    • By Child Theme
  • Membership
    • FAQ
  • Forums
    • Members-only
      • Tutorial Requests
    • Paid Support
  • Contact
  • Login

Custom Excerpts Overlay on Featured images below Header on Pages and Posts in Genesis

February 13, 2017 by Sridhar Katakam Leave a Comment Favorited: 7 times

In the comments section of Full width responsive Featured image below header in Genesis with a fallback tutorial, a user asked:

I use the above code often, excellent thank you. Do you have a tutorial or a bit of code where I can add some text over just the home image – Im using Genesis Sample theme. I don’t mind it being hard coded in functions.php – although Widget better of course. ….( actually using an excerpt to deliver different text on different pages…but that’s something else!) Many Thanks

This article provides the steps to display an entry summary section showing the custom excerpt (if present) overlayed on top of the featured image on static Pages and single Posts in Genesis. If a Post or Page does not have a featured image, the section will not appear.

Screenshots:

When there is no custom excerpt:

When there is a custom excerpt:

Summary of steps:

  • In a function hooked to genesis_after_header
    • if we are not on a static Page or Post page, abort.
    • if there's no featured image, abort.
    • display entry summary inside div.entry-summary > div.wrap while defining entry-summary context.
  • In a function hooked to genesis_attr_entry-summary filter (this hook will work because we have defined the custom context)
    • if we are not on a static Page or Post page, abort.
    • if featured image is present, add style attribute with background-image set to URL of the featured image
    • if a custom excerpt is present, add has-excerpt class else add no-excerpt class.
  • Add support for the custom excerpt on static Pages

Step 1

Add the following in child theme's functions.php:

To view the full content, please sign up for the membership.

Already a member? Log in below or here.

 
 
Forgot Password

Filed Under: Featured, Genesis, Premium Content Tagged With: Custom Excerpt, genesis_attr

Recent Comments

  • Sridhar Katakam on BrowserSync in Laravel Valet
  • Bharti on How to add a new website in Google Analytics
  • Chuck Smith on BrowserSync in Laravel Valet
  • arunkumar on BrowserSync in Laravel Valet
  • Craig Simpson on BrowserSync in Laravel Valet
  • Sridhar Katakam on BrowserSync in Laravel Valet
  • arunkumar on BrowserSync in Laravel Valet
  • Vajrasar on BrowserSync in Laravel Valet
  • fatcatdesign on Multiple Rotating Background images with Ken Burns Effect in Altitude Pro
  • admin@heyitsfree.net on How to load Font Awesome 5 in WordPress

Subscribe to Blog via Email

Enter your email address to subscribe to this blog and receive notifications of new tutorials by email.

Join 1,042 other subscribers

Categories

Tags

ACF ACF Pro Agency Pro Altitude Pro Background Video Backstretch Centric Pro CPT CSS Grid Digital Pro dynamik equal heights featured image fixed Fixed header Flexbox font awesome footer footer widgets Genesis Sample grid header Infinity Pro Isotope jQuery lightbox Masonry Metro Pro minimum-pro Monochrome Pro Outreach Pro page template parallax Parallax Pro portfolio pre_get_posts responsive search Showcase Pro slider Soliloquy sticky Video Background widget area WooCommerce
Follow @srikat

Recent Posts

  • BrowserSync in Laravel Valet
  • How to dynamically load posts on click using Ajax in Genesis
  • Multiple Rotating Background images with Ken Burns Effect in Altitude Pro
  • Secondary logo on scroll in Business Pro
  • Site Title – Custom Menu – Primary Menu in Genesis
  • Rotating Background Images for Page Header section using Featured Galleries and Backstretch in Business Pro
  • Header Right widget area in Genesis Sample 2.6.0
  • Utility Bar in Genesis Sample
  • CSS Grid with Float Fallback
  • Font Awesome 5 SVG icons above menu items in Genesis

Find my tutorials helpful and wish to donate?

© 2018 · Genesis Sample Theme on Genesis Framework