DIY Design: Make a Back-to-Top Button for Blogger

Okay, first a disclaimer: I am not an expert coder. If you ask me how to code anything on your website or blog, I will probably send you somewhere else, especially if it involves CSS. But HTML I can handle in small doses. And when I recently figured out how to make a back-to-top button without crazy coding, I just had to show you how I do it!

In case you have no idea what I'm talking about, a back-to-top button is the little button that appears in the corner of my blog and if you press it, you'll be catapulted back to the top of the page. For really long pages like archives, a long homepage or even a post with a lot of comments, this is super nice to have. 

First, make a small button. You can do this in Picmonkey or Photoshop, depending on your skill set (or I can make you one!). I made mine a circle, about 80 pixels in diameter. Upload the photo either in a post or in Flickr/Photobucket and then copy the image URL. If you upload it into a post, flip over to HTML first to find the image URL.

Then, open up your blog dashboard and go to Layout. Make a new gadget in a sidebar (or in a footer if you don't have sidebars) for simple HTML--it's called HTML/Javascript. Simply copy/paste this HTML into the box, add in your image link + admire! Look at you go, you HTML wizard.

<a style="display:scroll;position:fixed;bottom:5px;left:5px;" href="#" title="Back to Top"><img src="YOUR IMAGE LINK" /></a>

If you need to change your margins, just change the number before 'px' and that will change how many pixels of margin you have between your button and the top and left sides of the screen. This code will automatically put the button on the left side, but you can easily switch it to the right side by putting 'right' in instead of 'left'. I chose to do that + I also changed my position to 34 pixels from the right side so that it wasn't half on gray, half on white (at least on my computer). 

Let me know if you have any issues! I probably won't be able to help but I'll try ;) If you enjoyed this tutorial, I'd lurvvv if you would pin the image up top! I'd love you even more if you pin it from the actual post page, not my homepage!

Easy Peasy SEO (for Blogger!)

Alright, today's one of those days when if you're not a blogger, just come back tomorrow. In general, I try not to write just for the blogging community, but today I just want to share some stuff for bloggers. 

Okay, I'll be honest. SEO (search-engine optimization) is scary stuff. There are books bigger than my head about how to optimize your blog or website to get the most attention from search engines. But the nice part is, there are a couple super easy things that you can do that will help boost how high your blog is shown on search engines + get you more traffic!

Customize your Permalinks

When you're writing your post, there's a spot on the right-hand column where you can do a bunch of things to help your SEO. Hopefully, you're already adding keywords under the label category for your readers to look through all your awesome posts! Anyways, if you double-check that your permalink has your complete post title, that'll help search engines find the keywords for that post. Like instead of yourwebsite.com/2014/2/10, change it to something with the title of your post in it.

Add a search description to every post.

This is what'll pop up on Google when someone searches for your blog/blog post! Go into Settings > Search Preferences and click yes next to enable search description. Now, every time you write a post, go to that same right hand column in the post editor and write a sentence or two about your post.

Remember to add no-follow tags on links.

Anytime you link to another site that's significantly less popular/lower ranked than yours, check the box that says Add 'rel=nofollow' attribute. This'll make sure that it doesn't lower your ranking on a search page.

Title your images effectively.

I'll admit, I kind of suck at this one. Whenever you're making images for your blog, title them with a keyword or your post title. I tend to just save mine with a letter or number because I'm lazy like that. But if I call the above image 'seo-tips-for-blogger' instead of 'asdf', my post is more likely to show up on an image search engine.

Anchor your links wisely

Yeah, I also suck at this one. 'Anchor text' is simply the text that a link is attached to. You can easily improve your SEO by changing your anchor text to something descriptive instead of 'click here' or something like that. For example, saying 'my blog is Call Me Sassafras' is better than 'here's my blog'.

Interlink.

Part of your ranking on search engine comes from how many times your blog is linked to. Thankfully, when you link to yourself, it still counts! In your posts, look for ways to link to other posts. This will not only raise your ranking, but your readers may start poking about! I know that when I'm reading blogs and they keep interlinking/linking to themselves, I find myself getting sucked into the good-blog-black-hole!

Resize images before putting them in Blogger

Yeah, I know it's tempting to resize your images in Blogger if you know any html (or want one of their automatic small/medium/large/xl sizes). But huge images resized still take just as long to load on your page, which may drive away readers! It's easy enough to resize your images in Photoshop or on Picmonkey.

Write at least 300 words. 

Short posts and super super long posts don't rank as well on search engines. Not to mention, readers like having a bit of substance to read but not a week's worth of reading in one post. I aim to write between 500-700 words in each post. You can use an online word count tool to check (did you catch my good anchor text there?!), just by copying and pasting! And this post is 661 so it's about time to sign off ;)

Do you focus on SEO? What are your tips for having an SEO-friendly blog?