Jump to content

Price and Title Hover

Go to solution Solved by tuanphan,

Recommended Posts

On 6/28/2021 at 1:50 PM, d_y_photography said:

The url doesn't exist. Can you check it again?

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • Solution
On 7/2/2021 at 3:43 PM, d_y_photography said:

Sorry about that, now the link is working.

https://www.dy-photography.com/theprints

Hi.

Add to Design > Custom CSS

/* product title price on hover */
section.grid-meta-wrapper {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: 0 !important;
    width: 100%;
    transform: translate(-50%,-50%);
    opacity: 0;
    transition: all 0.3s;
pointer-events: none;
}
.grid-item:hover section {
    opacity: 1;
    transition: all 0.3s;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 1 month later...
1 hour ago, d_y_photography said:

Hey Tuanphan

Sorry i am back to you again, what about if i want the line in white , could you give me the code to add ? please

Thank you

If you mean the one at the top of the page:

.products.collection-content-wrapper .nested-category-children::after {
border-color: white;
}

If you want something else, you'll need to be more specific as your question is very vague.

Also, when asking for help, please remove the "disable right click" code; it is a nuisance for the people trying to help you and really doesn't do anything. It's 2021, if someone wants to copy an image, they will do it.

Work With Me 🖥️💻📱

Please remember to tag me so that I get a notification and respond to your help requests.

If my answers have helped you, please drop a like and mark my answer as best to help other users find solutions quickly.

You can also thank me or make requests by buying me a coffee . (Caffeine fuels me to take more requests)

For Squarespace Tips & Tricks, visit @squareskills (Youtube 📺 Tutorials)

For Premium and FREE plugins, visit Squareskills (Plugin Store) 🧩

Some links may be affiliate/referral links.

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.