brendanpeer Posted January 17, 2022 Share Posted January 17, 2022 Site URL: https://uk.thenueco.com/pages/survey Hi Does anyone know if it's possible to have customs buttons like the below example? https://uk.thenueco.com/pages/survey Thanks Link to comment
Beyondspace Posted January 17, 2022 Share Posted January 17, 2022 55 minutes ago, brendanpeer said: Site URL: https://uk.thenueco.com/pages/survey Hi Does anyone know if it's possible to have customs buttons like the below example? https://uk.thenueco.com/pages/survey Thanks Do you mean this effect when hovering this menu? BeyondSpace - Squarespace Website Developer 🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox) 🗓️ Delivery Date Picker (Squarespace Date format) 💫 Animated Buttons (Referral URL) 🥳 Sparkplugin Customisations Browsers (Browse +100 Spark plugin customisations) 🥳 Elfsight Template Browsers (Browse +1000 Elfsight widget Templates) If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you! Link to comment
brendanpeer Posted January 17, 2022 Author Share Posted January 17, 2022 Hi, Yes exactly, the hand drawn scribble rollover Thanks Link to comment
brendanpeer Posted January 17, 2022 Author Share Posted January 17, 2022 Or id even take just the custom border with out the roll over of that's easier Link to comment
tuanphan Posted January 19, 2022 Share Posted January 19, 2022 On 1/17/2022 at 11:13 PM, brendanpeer said: Or id even take just the custom border with out the roll over of that's easier Possible. If you share link to page where you want to apply effect, we can tweak above code on your site 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
brendanpeer Posted January 19, 2022 Author Share Posted January 19, 2022 Hi Tuanphan Thanks for replying. the site is www.heydaysworkshops.com password creative23 Thanks again Link to comment
tuanphan Posted January 20, 2022 Share Posted January 20, 2022 15 hours ago, brendanpeer said: Hi Tuanphan Thanks for replying. the site is www.heydaysworkshops.com password creative23 Thanks again For Learn More button or all buttons in main content? 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
brendanpeer Posted January 20, 2022 Author Share Posted January 20, 2022 Hi, For all buttons site wide Thanks Link to comment
tuanphan Posted January 21, 2022 Share Posted January 21, 2022 20 hours ago, brendanpeer said: Hi, For all buttons site wide Thanks Try add to Design > Custom CSS (header button) a.btn:hover:before { content: ""; position: absolute; top: -25px; left: -35px; right: -40px; bottom: 0; display: block; background-image: url(//cdn.shopify.com/s/files/1/0253/3661/0863/t/61/assets/icon-sketch-circle.svg?v=1365897…); background-size: 100% 100%; background-repeat: no-repeat; background-position: center center; } a.btn:hover { background-color: Transparent !important; color: black !important; border: none !important; } 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
brendanpeer Posted January 21, 2022 Author Share Posted January 21, 2022 Hi, No, unfortunately that hasn't worked? Thanks Link to comment
tuanphan Posted January 22, 2022 Share Posted January 22, 2022 On 1/21/2022 at 6:39 PM, brendanpeer said: Hi, No, unfortunately that hasn't worked? Thanks I see it worked here 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
brendanpeer Posted January 22, 2022 Author Share Posted January 22, 2022 Oh yeah amazing, can it be site wide? Thanks so much for your help here Link to comment
Solution tuanphan Posted January 25, 2022 Solution Share Posted January 25, 2022 On 1/22/2022 at 7:37 PM, brendanpeer said: Oh yeah amazing, can it be site wide? Thanks so much for your help here It just a test code for header button. Use this new code for header button, button blocks button a.btn:hover:before, .button-block a:hover:before { content: ""; position: absolute; top: -25px; left: -35px; right: -40px; bottom: 0; display: block; background-image: url(//cdn.shopify.com/s/files/1/0253/3661/0863/t/61/assets/icon-sketch-circle.svg?v=1365897…); background-size: 100% 100%; background-repeat: no-repeat; background-position: center center; } a.btn:hover, .button-block a:hover { background-color: Transparent !important; color: black !important; border: none !important; } .button-block a { display: inline-block; position: relative; } Currently I only see these 2 types of buttons on your site. If you use other types (list button, image block button, input button..) you can share link to page where you added them, I can check code eaiser 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
brendanpeer Posted January 28, 2022 Author Share Posted January 28, 2022 THAT WORKED! thank you so much for your help with this 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