Control the content on hover

Hello,
Currently on my category pages, when I hover over a product, I see several lines of text (Spec Sheet, IES Files and a portion of Specification & Features). I’d like the hover to show only the Spec Sheet. Is it possible to control what a user sees on the hover, please?
Thank you!

Hello,

Please provide me with some relevant screenshots of the specific area to check it myself and help you out accordingly.

And the link you provided is password protected please provide the password to visit the link.

Best Regards.

My apologies for the password protection…we were migrating our site & that got added accidentally. Here is the link: https://pemcolighting.com/product-category/fixtures/wall-surface-mounts/

On the hover, I’d like to only be able to see Spec Sheet, not IES Files or Specifications & Features. Screen shot is attached.

Thank you

Attachments:

You must be logged in to view attached files.

Hello,

I saw the screenshot you attached and visited your website.

Sorry but there is no option that you can hide specific content from the hover content from the product grids.

Best Regards.

Thank you, Aizaz.
Is there a work-around? Perhaps if I made the grid smaller?
It looks very cluttered currently. I don’t like the look of it at all and since the links are all on one line, when a user tries to click one link, many times he’s taken to the wrong one.
Do you have any suggestions other than switching themes?
Thank you.

Hello,

To decrease the size of the hover content try adding the following Custom CSS in the Global Custom CSS area under Theme Settings >> Custom CSS.

.woodmart-hover-base.hover-ready:hover .fade-in-block {
overflow: hidden;
height: 48px;
}

.product-grid-item .content-product-imagin {
	height: 315px;
}

Regard’s.
Xtemos Studios.

Thank you.
That worked.
There’s still a bit more there than I want to see on the hover (ideally, I’d only see Spec Sheet), but it’s better than before.
Is there a way I can tweak the code to see only the Spec Sheet link?

Thank you for your time & tenacity!

Hello,

You are Most Welcome.

With the CSS code, I provided the link is displaying as you mentioned on hover. You can also try setting the height of the block according to your needs.

Best Regards.

Thank you. Changing the height helped.
One more related question, please: is there a way to designate where the hover content comes from or does it have to use the short description content?
I’m not using the long description field. I was thinking if I could use the long description as the hover content, I could format it the way I want without it affecting my short description.
Thank you for your help!

Hello,

You are Most Welcome.

Sorry but there is no such option to display the long description on product hover.

It requires customizations and this is beyond our limitations and support policy.

Best Regards.

[Author]

Posts