bathtubgems Posted March 7, 2022 Share Posted March 7, 2022 Hi there, I'm looking to create this overlay / hover effect with price and product title for my products in a 7.1 version template: https://indigo-demo.squarespace.com/ Is this possible? Thanks in advance for your help Link to comment
tuanphan Posted March 10, 2022 Share Posted March 10, 2022 Yes. Possible. Can you share link to shop page on your site? We can check & give the code to create effect easier 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
bathtubgems Posted March 11, 2022 Author Share Posted March 11, 2022 I'm in the process of building my site (so still on a free trial). Not sure if this link will work: https://lily-yellow-zwzc.squarespace.com/config/ Link to comment
tuanphan Posted March 13, 2022 Share Posted March 13, 2022 Your site is private. Can you setup password & share url? 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
bathtubgems Posted March 14, 2022 Author Share Posted March 14, 2022 yes, here is the url https://lily-yellow-zwzc.squarespace.com/config/ And the password is 'bathtub' Link to comment
tuanphan Posted March 15, 2022 Share Posted March 15, 2022 16 hours ago, bathtubgems said: yes, here is the url https://lily-yellow-zwzc.squarespace.com/config/ And the password is 'bathtub' Add to Design > Custom CSS section.grid-meta-wrapper { position: absolute; top: 50%; left: 50%; width: 100%; transform: translate(-50%,-50%); z-index: 9999; opacity: 0; } section.grid-meta-wrapper * { text-align: center !important; } figure.grid-image:after { content: ""; background-color: rgba(255,255,255,0.9); position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 999; opacity: 0; } .grid-item:hover section.grid-meta-wrapper { opacity: 1; } .grid-item:hover figure:after { opacity: 1; } 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
bathtubgems Posted March 16, 2022 Author Share Posted March 16, 2022 Wow, thank you so much!!! That worked perfectly. Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment