How to tweak Bear Blog
The documentation for Bear blog (that this blog is published on), can be a bit on the technical side. Here's a non-technical article so you can set your blog up, how you want to.
There's been a couple of things that I wanted to change on my blog, once I'd chosen my theme.
buymeacoffee.com
If you look at my footer, you'll see a link to my 'buy me a coffee' page, I really don't expect a lot (if anything), but I am curious to see if anyone will! You will obviously first need to sign up to either 'buy me a coffee 'or perhaps www.ko-fi.com, if that's your preference.
Once you've signed up, then you need to look for what's called a 'html link' for your page. As bear blog doesn't allow javascript, then this html option is the only one that will work. Once you've found that (pro-tip: it's in the 'settings' page towards the bottom), next you'll need to logon to bear blog and then navigate to 'settings', and then click-on 'header and footer directives'. You need to paste your html 'buy me a coffee' link, and wrap it within some html, so that it looks like this:
<a href="https://www.buymeacoffee.com/Chilli.blog"> feel free to buy me a coffee! </a>
everything after the first > is free text so feel free to write whatever you want to. Please change the URL to point to your buy me a coffee page! Finally, click on save once you've added the above html snippet. it should then be live on your site; so go have a look!
Letterbird.co
From what I understand then people that blog either do, or don't want their readers to contact them. If you simply add or include your email address somewhere on your blog then I can guarantee that one thing will happen: you'll get spammed. Letterbird solves this issue by offering a free html contact form on your site enabling your readers to get in touch. Letterbird acts as an intermediary, and simply forwards the message to your email address you used when you signed up for the service. Just like in the 'buy me a coffee' scenario above, then we need to wrap the link into a html tag for bear blog to do something useful with it. Here's how I did mine:
Want to <a href="https://letterbird.co/james"> email me </a> about something that I've written?
Again, change the above html code to display the text that you want to say, paste it into your 'header and footer directives' on bear blog, and click save once you're happy with it. Your website will update immediately.
Pro-Tip! You can change the colours on your letterbird page, so that the colours match those on your website, which will make it a bit more consistent for your readers. If you're on a Mac, then you can use the Digital Color Meter application, to find out your theme colours, and then tweak them on letterbird.co.
Toast/upvote button
I couldn't find anything in the documentation on this, but at the bottom of each blog post then there's a little button for your readers to click-on to give your article a big thumbs-up. A novel and simple way to see if anyone has positive feedback on your blog article. It looks like this:
After reading the documentation I simply couldn't find out how to enable it. The actual answer is that it's enabled by default on every page, so it'll appear once you've published your first blog post. If you want your upvote button to look different, then I can recommend this blog post .
Pages vs Posts
At first I found this to be a bit confusing; what's the difference between a blog page and a post? I think it's perhaps easier to think about it like this; If you want a new menu item e.g. 'about me', 'home', or 'useful stuff', then it's going to be a page, everything else is going to be a post.
If you by mistake create a page, when it should be a post, it's simple to change! Just open up the post, and at the very top of your edit box, add the following to your frontmatter: is_page: false By setting is_page: true you can make a post into a page. Clever, huh?
Frontmatter
Frontmatter is helpful and useful because it allows you to define metadata for your blog posts or pages in a structured way. This metadata can include things like the title, description, author, date, tags, and categories, among other things. So, you know when you start to write a new blog post, and you see this thing at the top of the page called 'attributes'? If you copy and then paste them into the top of your post, then they'll be included. If you want to know what they mean, and why they're important for your website; then this is what they do:
title: I like Bears
Mandatory. Quite simply this is the name, or title if you prefer, of your blog post. It's what readers will see when they look in your blog section of your blog.
link: i-like-bears
Optional. This is the relative link of your blog page. If it's blank, then it will use the title to set this, which is what I suggest you do, unless you understand what you're doing here.
alias: 2012/01/02/cool-post.html
Optional. Ignore this unless you know what you're doing! If you or your readers are getting a 404 (page not found) error for a specific blog post, then you can put in the correct path to your page here, so that the 404 error goes away.
canonical_url: https://example.com/bears
Optional. Ignore this unless you know what you're doing! If you do use this with a URL, at the bottom of each post and page you’ll find a link called ‘view original’. There’s no way to remove this link, unless you remove this canonical-url frontmatter tag!
published_date: 2022-12-30
Optional. Defaults to now, so no need to do anything further with this. You want to post a blog page at a future date then enter the future date, in the YYYY-MM-DD format, and it shall be done.
is_page: false
Optional. Defaults to False, meaning that by default every post you create is a blog post. Read the section above for more information about the difference between a post and a page.
meta_description: Look for the bear necessities.
Optional. If you want search engines e.g. Google etc to know what your blog post is about, then you'd best fill this in. You have exactly 160 characters, and yes, each space and punctuation marks counts as a separate character. Want to write more than 160 characters? Of course you can, but nb every search engine will truncate it to be 160 characters long; so don't waste your time. The more descriptive this can be, the better.
meta_image: https://example.com/image.jpeg
Optional. When you share a blog post on either social media, or a messaging app then this is the image that will be included with your link.
lang: en
Optional. The language of the blog that you're writing.
tags: Bearblog, How-to, degoogle, review, tech
Optional. if you want hashtags at the end of your blog post, then add them in here. I suggest that you have a think about 10-15 hashtags that you want to use on your blog. The good thing with hashtags is that if a reader clicks on them it will show all blog posts containing the same hashtag. So, in my opinion this is a very useful thing to use.
make_discoverable: true
Optional. defaults to true. Want your blog post to be shown in the bear blog discovery feed then set this to be true.
So looking through the above, then I think you only need to have 3-4 of them for every blog post that you create, and they are:
- title:
- meta_description:
- tags:
- make_discoverable:
All other front matter tags will, if necessary, be created automatically when you post your blog post. Logon to your bear blog account, and then click on Posts. On the right hand side of your screen, you'll see a button called 'edit template';Click on it. Copy over the frontmatter tags that you want at the start of every blogpost, add 3 underscores at the end of your list, and then click the save button. When you next go to start a new blog post, those tags will be pre-populated at the start of your blog post editing page.
I hope that you found this useful! I'll keep updating this page, as I come across anything else that I think would be useful to add.