Jump to content

How to turn Event page "source link" URL into button

Go to solution Solved by tuanphan,

Recommended Posts

Source URL turns the title into an external link, is it that title that you want to turn into a button? (style it as a button?) CAn you share your website URL?

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 

🔌 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
Spark Plugin (Referral link) 

 Did I help? Buy me a coffee?

Link to comment
  • 2 weeks later...

Try this Custom CSS:

a.eventitem-sourceurllink {
  padding: 6px 12px;
  background: #f2c14e;
  border-radius:6px;
}

Please like and upvote if my comments were helpful to you. Cheers!

Zygmunt Spray
Squarespace Website Designer
Contact me: 
https://squarefortytwo.com 

🔌 Ghost Squarespace Plugins (Referral link)
📈 SEO Space (Referral link)
 SquareWebsites Plugins (Referral link)
Spark Plugin (Referral link) 

 Did I help? Buy me a coffee?

Link to comment

Thanks for the response, Ziggy! I added your CSS to the site so you can see the result. Is there a way to target the text that reads "Source" with a display:none to hide it and to change the display text for the hyperlink to "Learn More" or "Click Here" or something similar? 

Link to comment
On 8/10/2023 at 6:44 AM, j__ said:

Thanks for the response, Ziggy! I added your CSS to the site so you can see the result. Is there a way to target the text that reads "Source" with a display:none to hide it and to change the display text for the hyperlink to "Learn More" or "Click Here" or something similar? 

You can use this CSS code

/* learn more text */
.eventitem-sourceurl {
    visibility: hidden;
}

.eventitem-sourceurl a {
    visibility: visible;
    margin-left: -50px;
}

.eventitem-sourceurl:before {
    content: "Learn more ";
    visibility: visible;
}

 

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
  • 3 weeks later...

This is great @tuanphan! I've added that CSS so you can see the result. Is there anyway to make the URL display as the "Learn More" or "Purchase Tickets" rather than having that text display before the full (complex) link? 

Link to comment
  • Solution
On 8/26/2023 at 9:14 PM, j__ said:

This is great @tuanphan! I've added that CSS so you can see the result. Is there anyway to make the URL display as the "Learn More" or "Purchase Tickets" rather than having that text display before the full (complex) link? 

Change to this code

.eventitem-sourceurl {
    visibility: hidden;
}

.eventitem-sourceurl a {
    visibility: visible;
    margin-left: -50px;
    margin-top: -30px;
    opacity: 0;
    display: block;
}

.eventitem-sourceurl:before {
    content: "Purchase tickets:";
    visibility: visible;
    padding: 6px 12px;
    background: #f2c14e;
    border-radius: 6px;
}

 

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

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.