How to get opaque image rollover effect

  • Resolved msusans

    (@msusans)


    6 years, 3 months ago

    Hi, I have used the Genesis Featured Page widget for 3 page links on my homepage. One of my links isn’t a page though. So I installed Genesis Featured Page Advanced so I can use a link instead of a page. However, I don’t know how to get the same opaque rollover effect that I have on the other links. I want the first link to look the same as the 2nd one.

    The page I need help with: [log in to see the link]

Viewing 9 replies - 1 through 9 (of 9 total)
  • Plugin Author Nick Diego

    (@ndiego)

    Hi msusans,

    Are you still using the Featured Page Advanced widget on this page, I don’t see it.

    Thanks!

    Thread Starter msusans

    (@msusans)

    Yep! It’s the “Manage Your Sensitivity” image link that has the title showing and no rollover effects. I want it to look like the “Manage Your Sensitivity” image next to it. Here’s the link again: https://st.susansezgin.com/ It’s just above the testimonials section.

    Thanks!

    Plugin Author Nick Diego

    (@ndiego)

    Ahh I see. It looks like you are using the generic Title for the FPA widget but have the Page Title enabled for the FP widget. If you remove the generic Title from the FPA widget and enable the Show Custom Page Title and enter in the title you want, it should work for you. Let me know if you run into issues.

    Thread Starter msusans

    (@msusans)

    Hey Nick!

    It’s getting closer, but I’m still not getting the default rollover effect on the FPA (the first one) widget as I am on the FP (the second one) widget. Maybe I missed a step?

    https://st.susansezgin.com/

    Plugin Author Nick Diego

    (@ndiego)

    Hi msusans,

    Sorry this is a tricky one. In the FP widget, it is adding a class to the widget container called has-post-thumbnail. This class however is not actually in the main FP widget. My FPA widget is built off of the main FP widget, which is why it also does not have this class.

    Therefore, I am wondering if your theme is adding it somehow. All of that on hover styling is generated off of that class, so the FPA widget would also need it to have the same look. There is a way to get around this, but that will be the last resort.

    Can you look in your functions.php file and search for the text has-post-thumbnail? IF you find any code that is using this, can you copy and paste it here? If there is nothing there, I am baffled and we will go to plan B.

    Thanks,
    Nick

    Thread Starter msusans

    (@msusans)

    Hi Nick,

    I didn’t see “has-post-thumbnail” in the functions.php file. Here’s a link to the file if it’s helpful for you to look by yourself…

    https://drive.google.com/file/d/1iFR9xmG7y5zkYgfm3KpyGV9zrymOQO2U/view?usp=sharing

    Thread Starter msusans

    (@msusans)

    I did find “has-post-thumbnail” in my style.css file. Here’s a link to that too, if it’s helpful: https://drive.google.com/file/d/1Jy6iyPyVSHpNAvEvEXuZdgS4gyhyEsAb/view?usp=sharing

    Plugin Author Nick Diego

    (@ndiego)

    Hi msusans,

    I ultimately had to push an update to fix this issue. You should see the upgrade prompt for version 1.9.6 of the plugin on your site’s plugin page. That should resolve everything for you. Basically, I had to dynamically add this class to all widgets that were featuring a custom image or custom link. Let me know if you run into any further issues.

    Thanks,
    Nick

    Thread Starter msusans

    (@msusans)

    Wow! Thanks Nick…. it works great now ??

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘How to get opaque image rollover effect’ is closed to new replies.