Jump to content

Custom highlight color for text, need text to change color when highlighted

Recommended Posts

I changed the highlight color to be more attune to my sites palette but the black font is now hard to see, I would like for it to change color when highlighted as shown in the picture. Can anyone help with custom CSS to achieve this? Thank you!

*Password to view site is 'private'

Screenshot 2023-01-16 at 4.53.30 PM.png

Link to comment
  • Replies 6
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

56 minutes ago, blakelyhi said:

I changed the highlight color to be more attune to my sites palette but the black font is now hard to see, I would like for it to change color when highlighted as shown in the picture. Can anyone help with custom CSS to achieve this? Thank you!

*Password to view site is 'private'

Screenshot 2023-01-16 at 4.53.30 PM.png

How can you set this highlight color? Text change + text effect?

Can you provide your URL so we can take a look?

Greeting, it's BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Lightbox Studio plugin
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment
14 hours ago, blakelyhi said:

Custom css to alter the highlight color, need to change text color only when highlighted... 

url: https://caterpillar-ranunculus-pm6a.squarespace.com/

I can not find the text you mentioned before. Can you share the link to this page?

By the way, have you tried changing the individual text yet? This is the standard feature of squarespace

image.thumb.png.1ba3f505247e564fac9e0266df1a5489.png

Greeting, it's BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Lightbox Studio plugin
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment

I don't want it highlighted always, just when you drag the mouse over text to highlight for the text to change colors so it's visible... like the photo in my initial post above. It's black text but when highlighted changes to white. 

Link to comment
2 minutes ago, blakelyhi said:

I don't want it highlighted always, just when you drag the mouse over text to highlight for the text to change colors so it's visible... like the photo in my initial post above. It's black text but when highlighted changes to white. 

You can try adding to Home > Design > Custom Css

::selection {
  color:#fff;
  background: #ccc; /*if you want custom the selected text*/
}

Support me by pressing 👍  or marking as solution if this useful for you

Greeting, it's BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Lightbox Studio plugin
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment

My testing

image.thumb.png.ade2c992ac85bd7bbb1e3475e442f690.png

Greeting, it's BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Lightbox Studio plugin
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

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.