1. PROMO Upgrade to Pro Membership @ $99 / Lifetime & access all our 16+ premium Divi extensions: Divi Block, Carousel Toolkit, etc.LEARN MORE
Dismiss Notice
NEW Divi.Help Pro Carousel AI Toolkit - Magically turn your Divi design into carousel, simply by using our online toolkit. No plugins needed. Now it works with Divi 5 as well!Try our carousel AI toolkit
BEST Divi Block - A revolutionary drag & drop tool to easily mix & match 960+ premade blocks (Light & Dark) to kick start your Divi site design. Special module designs are included as well. Also newly added AI generator & color. Now it works with Divi 5 as well!
Learn More About Divi BlockFree Version ~ 340+ Free Blocks

Solved Overlay Post Title on Featured Image

Discussion in 'Free Divi Community Forum' started by Ken Segall, Dec 11, 2024.

  1. Ken Segall

    Ken Segall New Member

    My home page features my most recent blog post. I would like the post title to overlay on the featured image with large type (lower left corner) and a translucent background to aid in readability. This would be for the home page only—the actual blog post would be styled in a more traditional way. I've googled my little heart out trying to do what I thought would be relatively simple, but ... no luck. Could someone suggest what CSS code to add and where? Truly appreciate the help!
     
    1. PRO MEMBER PERKS Divi Ultimate Blog Plugin - Easily set awesome default design for your Divi single blog page:Learn More
  2. Jolo

    Jolo New Member

    Hello, are you able to link to the page you want help with?
    Alternatively, post a picture on someone else's page that has the solution you want, this would make it easier to understand exactly what you mean.
     
  3. Ken Segall

    Ken Segall New Member

    Here is the effect I'm looking to create. The latest blog post would appear at the top of the home page—just the featured image with the blog post title layered on top, with a 40% black tone behind it. No other information at all. Totally clean. Thanks for whatever help you might offer.
     

    Attached Files:

    1. PRO MEMBER PERKS Divi Ultimate Header Plugin - Custom Divi Builder header on desktop + default slide in / fullscreen menu on mobile:Learn More
  4. Divi Booster

    Divi Booster Divi Expert

    Hey Ken,

    You could do this with the Blog module, like so:

    1) Set "Blog Settings > Content > Content > Post Count" = 1
    2) Disable everything except the featured image in the "Blog Settings > Content > Elements" settings section.
    3) Add the following into "Blog Settings > Advanced > Custom CSS > Module Elements > Title":

    Code:
    Log In or Sign Up to view this code.
    You'll probably need to play around with the margins / padding in that CSS to position it the way you want, but it will hopefully get you close to what you need.

    Hope that helps!
     
  5. Ken Segall

    Ken Segall New Member

    That did the trick! THANK YOU!
     
    1. PRO MEMBER PERKS Divi Powerful Child Theme - Power up your Divi sites with tons of new functionalities & premade elements:Learn More
  6. Divi Booster

    Divi Booster Divi Expert

    You're welcome, Ken!