How to Make a Blog Button

Yay! It’s the return of Tech Tips. Today I’m going to show you how to make a blog button in both Wordpress and Blogger, and how to link that button to all sorts of fun stuff (like to your blog categories). Most of the ads in my sidebar are made this way (with a special link so I can count clicks), and when I was on Blogger my entire menu was made this way (there are extra steps in Wordpress for my current menu). Seriously useful and seriously easy.

HOW TO MAKE A BLOG BUTTON IN WORDPRESS

Open a new post and add your image.

Click on the image to get the edit image icon to pop up. Then click on edit image (looks like a picture of a mountain).

From another tab in your browser, copy the URL you want to link your button to. Then paste the URL where it says “Link URL”

If you need to resize your image, click on the “Advanced Settings” tab and resize. When you’re done, click “Update” to save.

Now click the “Text” tab instead of the “Visual” tab at the top of your post. You’ll see the HTML for your button. Highlight and copy it.

Next navigate to your Widgets. Drag a Text box into your widget area where you want the button to appear. Paste the HTML you copied from your post and save.

And now you can see my button on my blog sidebar. Scroll past the Blogger tutorial to learn how to link these buttons to categories or to track clicks.

 

 

 

HOW TO MAKE A BLOG BUTTON IN BLOGGER

Open a new post and insert your picture. Click on the picture and use the pop-up menu below to resize if needed. Then click the “Link” tab in the menu bar twice.

The second time you click the Link button, this box will pop up. Copy the link you want to link to from another tab in your browser, and paste where it says “Web address”

Click the “HTML” tab at the top of your post to see your HTML. Highlight and copy it.

Go to your Layout Screen. Click on “Add a Gadget” and scroll through the pop-up box to find “HTML/Java Script”. Click the plus sign to add this to your layout. Drag this HTML box to where you want it within your layout, then click it to open.

Paste your HTML for your button in this box and save. Voila, your button is done!

 

COOL THINGS TO DO WITH LINKS

Lets say you want your button to link to every post you’ve written with a certain tag or label. How would you do that? It’s easy.

Looking at your blog, click on the tag or label you want to link to. Here I want to see all my posts for Kids Clothing Week, so I’m clicking on my KCWC tag.

After you click on a label, your address bar will look something like this. Simply use this URL when you make your button and all your posts with that label will be linked to your button. This works the same way on Blogger, but the URL looks a little different.

This is a great way to link to a large category of posts for a menu, or without having to constantly update a Page with an HTML table.

Finally, if you’re curious how many clicks something is getting (like an ad) Bitly is an easy way to track this. You have to sign up for a free account, but then you paste the URL into their box and it will give you a link to use. Paste that link on your button (it just redirects to your original URL) and then from your Bitly dashboard you’ll be able to see how many times a button was clicked on. Cool, huh?

I have a few more tech tip ideas lined up for the month, but if there’s something you’re dying to know how to do, please leave a comment. If I don’t get to it this month, I’ll still have it saved for future tech tip posts.