Adding highlights to Bear Blog
Background
I've been reading posts on Bear quite a lot (maybe too much?), have made pen pals from here, and absolutely love the platform and its ethos.
Piggy-backing off this post, I'd also love to be able to show that I really resonated with a specific part as well as give readers the chance to engage more than just upvote.
I don't really want comments (and Herman also opposes comments, for good reason), but I quite like the idea of highlighting parts that I enjoy and allowing others to do so.
So, I've made a script that does just that!
To see what it looks like in action, click the button below:
Popular highlights will appear more bold while less popular highlights are lighter. The highlights change boldness in real-time as readers click the highlight button.
To add a highlight (only works on desktop right now):
- Make sure that Show highlights button is clicked
- Highlight some text and click the highlight button
How to add to your blog
If you'd like to add this to your own blog, it's pretty simple!
Make sure you are upgraded on Bear
Add the following code to the head (Settings > Header and Footer Directives)
<link rel="stylesheet" href="https://highlight.cool/public/highlight.cool.css" type="text/css"><script defersrc="https://highlight.cool/public/highlight.cool.js"></script>Add this button somewhere on the page. It'll let your readers turn highlights on and off as they wish.
<button id="show-highlights">Show highlights</button>
And that's it!
I'm continuing to build it out, but wanted to share it with one of my favorite communities on the internet right now!
You can check out more details here, if you'd like.
If you have suggestions or questions, email me!