How to Create Cute Sidebar Widget Titles

widget-title-customization.png

Hi everyone! Today I'm going to quickly walk you through how to easily create cute title images for your blog's widgets using Canva. ("Widgets" can mean a few different things, but for this tutorial, it'll refer to the different sections your blog's sidebar, e.g. "archives", "popular posts", etc.)

In the second part of this tutorial, I'll be teaching you how to install your images into Blogger, so stay tuned for that in the very near future! Let's get started!

1. Determine Sidebar Dimensions

This step is really important to complete before you can move on to create your images. If you host your blog using Squarespace, images in the sidebar will be automatically re-sized to the right width; if you use Blogger, however, you'll need to manually make sure that your images are going to fit. 

My sidebar width on my Blogger test site is set to 310 px, so I'm setting my dimensions to 250 x 60 px in Canva just to make sure nothing is too crowded. 

2. Open Canva and Set Image Width and Height

As I mentioned above, I'm setting my template dimensions to 250 x 60 pixels. To do this, open Canva and click "Use Custom Dimensions" towards the top right of the screen, then type in your dimensions and click "Create!"

3. Set Background Colors

  • Now that your template is ready to be designed, it's time to pick some colors! You could choose to make each image the same color, use complimentary colors, or do an ombre effect. It's totally up to you, and there's a bunch of different ways to tailor it to your blog's design and your own personal taste. I decided to use different shades of teal and light blue for mine.
  • To add a background color to your template, click "Background" on the left menu and select a random color option from the top. If you want to use a different color, click the template, select the plus (+) button, and either select a shade from the color wheel or type in the hex color code below.  

4. Add Text & Make Copies

  • Once your original image is the color you want it to be, go ahead and add some text to it by clicking "Text" in the left menu and then "Add text". From there, choose your font, size, and color, and type what you want your title to be. 
     
  • Now, to make life easier on yourself, click the icon to the right of your design that looks like two pieces of paper stacked on top of one another. This will make an exact copy of your design; so go ahead and click that button for however many widget titles you want to put on your blog. I wanted to make 4 titles, so I made 3 copies of my original design. (Let's pretend that all made sense...)
     
  • When you have all your copies made, now you can edit the background colors and text for each of your images. I changed mine to say "Follow", which I'll place above my social media buttons, "Popular", which will be above my popular articles, "Archives", which will be above an expandable list of all of my articles, and "Topics", which will go above all the tags on my blog. 

5. Save Your Designs

All done! Time to save your designs and get ready to upload them to your blog! To save your images, click "Download" on the top menu, then click "Save as image".  (Click here to see my test blog in action!)

  • Note: If you use Blogger, you'll need to upload the images you just created onto a photo hosting website (e.g. Flickr, Photobucket, etc.) before you can add them to your blog. 

Thanks for reading! Check back soon for part 2 of this tutorial, which will walk you through how to upload your widget title images to your blog's sidebar. As always, feel free to leave a comment or question down below, and I'll do my best to help you!