Jump to content

Change Read More button for blogs

Go to solution Solved by tuanphan,

Recommended Posts

  • Replies 6
  • Created
  • Last Reply

Top Posters In This Topic

4 hours ago, tarar said:

Site URL: https://mackerel-arugula-fyyy.squarespace.com/scaffolding-services

How do I change the Read More button for blogs?

I have tried adding this code but doesn't seem to have worked:

.sqs-block-summary-v2 .summary-read-more-link {
  font-size: 0;
  }

.sqs-block-summary-v2 .summary-read-more-link::before {
  content: "Find out more";
  font-size: 14px;
}

Password is - testingsquare1234

try 

.blog-more-link {
  visibility: hidden;
  position: relative;
}
.blog-more-link:before {
  content: 'Find out more';
  visibility: visible;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
  width: 200px;
}

image.thumb.png.2b37737c8bc81d592e3767ee92f72307.png

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
On 5/18/2021 at 4:30 AM, tarar said:

That works, thanks!  Is there anyway to make it a button like the ones on this page - https://mackerel-arugula-fyyy.squarespace.com/equipment-hire

PWD - testingsquare1234

Incorrect password. 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 5/22/2021 at 11:35 AM, tarar said:

I have reset it, testingsquare1234 should work.

Add to Design > Custom CSS

.blog-more-link {
    visibility: hidden;
    position: relative;
    margin-top: 30px !important;
}
.blog-more-link:before {
    content: 'Find out more';
    visibility: visible;
    position: absolute;
    left: 50%;
    transform: translatex(-50%);
    bottom: 0;
    width: 200px;
    font-family: orpheus-pro;
    font-weight: 500;
    font-style: normal;
    text-transform: none;
    letter-spacing: .04em;
    color: #fff;
    background-color: #a8a6a1;
    border-color: #a8a6a1;
    line-height: normal;
    padding: 1.2em 2.004em;
}

 

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.