Smartyart Posted September 4, 2020 Share Posted September 4, 2020 Site URL: https://cat-wedge-xh9c.squarespace.com/programs I'm trying to create a list of the programs and services that we offer at the Community Center where I work. We're a small non-profit which is why I am doing 20 jobs and learning them as I go. I want two buttons to appear inside each accordion drop-down. One that says "Learn More" and one that says "Volunteer". I've figured out how to get the button in there. I've even figured out how to make it look decent, but it is changing EVERY link/button on my page when I do that and making them all look crazy. Here is the code I was using. I don't even remember where I found it. (The button won't link to google, obv, I just haven't gotten very far yet.) The password to the website is: bft2020 <style> a:link, a:visited { background-color: #00B0B9; color: white; padding: 14px 25px; text-align: center; text-decoration: none; display: inline-block;} </style> <a href="https://google.com" target="_blank">Volunteer</a> laura-doval 1 Link to comment
tuanphan Posted September 4, 2020 Share Posted September 4, 2020 Add to Home > Design > Custom CSS div#block-yui_3_17_2_1_1599105038088_23671 a { background-color: #00B0B9; color: white; padding: 14px 25px; text-align: center; text-decoration: none; display: inline-block; } Smartyart and Takis 1 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
Smartyart Posted September 8, 2020 Author Share Posted September 8, 2020 This worked perfectly! Thank you SO much! Link to comment
Phil84vaive Posted December 9, 2021 Share Posted December 9, 2021 This worked perfectly for me too! I have styled mine to look exactly like the rest of my buttons, but I have one question - Can I add a hover colour as well, just like a normal button? Specifically, I would like to hover to be the same colour as the border #block-yui_3_17_2_1_1638482498070_17084{a:link, a:visited { background-color: black; font-size: 14px; color: rgb(220,255,32); padding: 12px 25px; border: 2px solid rgb(220,255,32); text-align: center; text-decoration: none; display: inline-block; }} Link to comment
tuanphan Posted December 12, 2021 Share Posted December 12, 2021 On 12/10/2021 at 2:12 AM, Phil84vaive said: This worked perfectly for me too! I have styled mine to look exactly like the rest of my buttons, but I have one question - Can I add a hover colour as well, just like a normal button? Specifically, I would like to hover to be the same colour as the border #block-yui_3_17_2_1_1638482498070_17084{a:link, a:visited { background-color: black; font-size: 14px; color: rgb(220,255,32); padding: 12px 25px; border: 2px solid rgb(220,255,32); text-align: center; text-decoration: none; display: inline-block; }} Just add :hover div#block-yui_3_17_2_1_1599105038088_23671 a { background-color: #00B0B9; color: white; padding: 14px 25px; text-align: center; text-decoration: none; display: inline-block; } div#block-yui_3_17_2_1_1599105038088_23671 a:hover { background-color: white !important; color: #00B0B9 !important; } Replace with your block id laura-doval 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
laura-doval Posted September 26, 2022 Share Posted September 26, 2022 Hi! I am not sure if anyone is still getting notifications for this thread, but I was wondering if it would be possible to do something like this, but allowing for buttons inside the accordion. Many thanks! Link to comment
tuanphan Posted September 27, 2022 Share Posted September 27, 2022 17 hours ago, laura-doval said: Hi! I am not sure if anyone is still getting notifications for this thread, but I was wondering if it would be possible to do something like this, but allowing for buttons inside the accordion. Many thanks! You can add link into accordion content, then we can give code to turn link to button laura-doval 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
laura-doval Posted September 27, 2022 Share Posted September 27, 2022 Thanks!! Is there another forum discussion that explains how to turn the link into a button? Link to comment
tuanphan Posted September 28, 2022 Share Posted September 28, 2022 On 9/26/2022 at 10:31 PM, laura-doval said: Hi! I am not sure if anyone is still getting notifications for this thread, but I was wondering if it would be possible to do something like this, but allowing for buttons inside the accordion. Many thanks! You can add a link then share link to page where you use accordion, we can give code to turn link to button. 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
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment