The Complete List of Resources I Used To DIY My Blog Design

Affiliate links and non-affiliate links are used throughout this post. For any affiliate link you click on, a commission or fee will be paid to WMSB if you make a purchase. No additional cost will be passed to you and everything in this post was actually used by me or almost used by me. Thank you for your support.

It’s official! My blog design is finished!

I decided to try it myself because I didn’t know exactly what I wanted yet, and I also didn’t want to spend a lot of money on it. I’m a few months away from paying off my credit cards (I’d be done next month if I hadn’t bought a new macbook or a flight home, but both of those were totally worth it). For these reasons I couldn’t see spending $300, $500 or even $1,500 on a whole new blog design.

Back in the day of live journal and blogger I wasn’t too bad at designing graphics and basic HTML. I am totally out of practice, and a lot has changed since then, but I figured I would dedicate some time and energy to a DIY blog design, and if it was horrible then I’d go back to my original one while I saved for a professional’s help.

I am so pleased to tell you right now that I’m OBSESSED with my new design! A little later in this post I’m going to share with you where I got every element, but first, let’s walk down memory lane.

I started Where My Soul Belongs in December of 2012 after re-branding and moving from Blogger. This is what it looked like:

In the beginning I didn’t have the ad above my “About Me” image, and the menu items have changed here and there, but it was otherwise basically the same. I have always loved that design. It was done by my friend Jac who no longer does blog design, but we met IRL at the first Influence Conference so that has always felt really special to me. I have a thing for butterflies and that style has represented me for a long time. But lately I’ve felt like it was time for a change.

Like I said before, I really didn’t know what I wanted. I liked the floral water color look, and the swatch-y water color look. I also loved my colors and didn’t want to have to go through and rebrand all of the photos, so I stuck to design ideas that were the same colors. So the first couple hours of my design process went into brainstorming what I really wanted from a design.

Ultimately, I determined that not only did I want to upgrade my header and graphics, I no longer loved the layout of the blog itself. I saw so many fancy sites out there and I wondered how much coding went into making them. That’s when Stephanie taught me about Themes. I know WordPress emails me about Themes, and there are Themes settings. But I had no idea what they were or what their purpose was. (If you don’t either, it’s like the format of your layout, basically. You can learn more about themes here.) She told me about all of the ones she’s saved from Creative Market’s free weekly goods, so I started peeking around at them. I couldn’t believe that a whole new blog layout was that easy!

Stephanie also told me that once I found one I liked, she could help me install it, but that it was super easy. I didn’t believe her, until I finally found THE ONE and read the directions. It really so easy! It’s a little too easy, in fact, because then I rushed to install it last weekend without having a graphic design done that I loved. But I didn’t even care.

I got to work on a new graphic design. I created one that was OK. I liked it, but I didn’t love it. So I installed it for awhile while I really dedicated myself to finding the “THAT’S THE ONE” design like I found in the theme.

You can see I added the flower to my signature and had planned to incorporate it into my graphics in other ways as well.

But since I still wasn’t totally in love, I went back to the internet.

I spent a few more hours perusing Creative Market, Pinterest and Google, looking at what was available, deciding what I wanted, and trying to imagine what it would look like in my head. You can see all of the resources I’ve “favorited” while looking for the right elements here.

Finally, I found EXACTLY what I wanted. Read more below to see the final reveal (if you’re not already viewing this in your full web browser)!

How to Setup a Blog on WordPress

First, I highly recommend switching to WordPress. I was on Blogger for years, and yes it’s an easy-to-use interface. However, WordPress gives you so much more functionality AND you own your content vs. Google owning your content. I’ve witnessed those horror stories you hear with my own eyes as friends had their sites shut down for breaking some Blogger rule that Google didn’t even tell them about. It took me a couple weeks to get used to WordPress and get over the fear of making the wrong choice, and now I’d never look back!

You will then need hosting. For most of my time blogging, I used SiteGround. I LOVED it. They have incredible customer service and I really wish I had bought the longest plan possible to take advantage of their new customer rate. Unfortunately, I did not. As long as you sign up as a new customer, it’s only $3.95 a month!

I currently use Bluehost. I made the switch about 6 months ago when SiteGround wouldn’t price match their new customer rate (I heard at a conference that they will regularly do this and it was frustrating to me that they wouldn’t) and I could no longer justify the expense of a fancier hosting that I actually didn’t need. As it turns out, even in hosting you really get what you pay for. But now that I’ve gotten past the setup on my own, aka with J’s brother’s help, (BlueHost charges for that, SiteGround doesn’t) and through the kinks, my only issues are that it’s really hard to edit within your cPanel so I can’t change the max image load size and I can’t figure out how to change the return address when emails are sent from my blog in reply to comments, etc. One day I’ll figure those things out. Anyway, if you’re looking for a shorter term host, or one that will still be cheaper at the end of your hosting subscription, check out Bluehost. Just be aware that if you need a lot of customer service, they’re going to charge you and you’d be better off with SiteGround.

How to Do Your Own Blog Design on WordPress

OK, onto the pretty parts! Let’s talk about this particular design!

The Theme

I spent hours on each step, but I’m so glad I did. First, it took me a couple of days of searching to find just-the-right-theme. You can buy themes all over the place, including etsy. But I really liked the setup of Creative Market so I started there. I found a variety of of themes that I liked, but suddenly, one night, I came across Felicity. And I literally shouted out loud to an empty house, “This is it! This is the one!” You can also use Felicity on Blogger if you don’t want to make the switch.

Themes that were in my “I really like this!” pile were also: Stephanie; Alexandra; Enamored; and Zarya. You can see that they had some similar features to Felicity, but when I looked at Felicity it had all of the different elements I loved from each one. I am still so thrilled about it!

Next, I started looking for design elements that would make WMSB stand out.

The Fonts

I was shocked at how opinionated I was about fonts. Thankfully, font sites these days allow you to preview common words you use. It turns out that I prefer rounded W’s. I narrowed my choices to Wilfur and Reusk. To choose, I asked a non-blogger, but blog-reader, what she thought. Together, we selected Wilfur. I bought the font and now I’m not allowed to look at fonts anymore because they’re so temping and I can’t redesign everything just to change my font haha. I also downloaded the free google font Raleway, as that’s a key font in this theme, and I liked the way they looked together.

The Graphic Elements

Like I said, I liked the water color flower design, but I couldn’t find exactly what I wanted. I eventually learned that you can change the colors of overlays in picmonkey. Simply pick “Use Your Own” overlay in that section of PicMonkey and then change the color. Now I no longer had to look for elements that were the exact colors I wanted to use! Bam!

I bought this set of hand drawn design elements for $5 and that’s how I came up with Design Option 1. It was OK, but not perfect.

Again, I went back to the “drawing board” and decided to try out some free elements I discovered on Pinterest before I spent more money. I hoped I would either find something perfect or at least have a better idea of what I wanted. I found this free cacti illustration set and LOVED it, but it didn’t fit my brand.

I grew up in the desert but I write about the PNW now and I thought it might confuse readers and new visitors to see cacti in my header, and then read about boating. You can download these free Cacti elements, and more gorgeous freebies, at Gold and Berry.

I went back to Creative Market and began searching overlays for pacific-northwest-friendly terms. That’s when I found this geometric design set by Hannah! It was basically exactly what I wanted, but the mountain here is a volcano, so it looks slightly different. I decided to contact her directly and talk about a semi-custom illustration. I’m so glad I did!! She did an incredible job capturing Mount Rainier and was wonderful through the process while I decided what colors to use. I instagram about Mt. Rainier all the time so you’ve probably seen it before. I would highly recommend her illustration, logo and design services! In the end, I chose colors that were similar, but slightly different, than the last ones. And when she sent me the final illustrations I actually became a bit emotional! I’d found it!

Once I received her final images, I got to work in PicMonkey creating the header. After 42 (literally) versions, moving the wording all around, changing the size of Mt. Rainier, and adding and deleting a tag line, I asked J his opinion and then came to a perfected design.
I literally spent 3 hours on this stage alone, but knowing I had EXACTLY what I wanted without also torturing some poor designer (and incurring extra design draft fees), it was totally worth it!

Social Media Templates for Pinterest Friendly Images

Then I started looking up how to create a template for my post header/feature images that will make creating pinterest-friendly images even easier. That’s when I found Holly McCaig! She has AMAZING templates on Creative Market and I insist that you go check them out! I found some free resources on her blog that helped me create my own. I’m currently using a free trial of Pixelmator, which is .psd friendly. After a lot of moving overlays around, changing colors, and choosing how I wanted the fonts to look, I came up with a few templates that I’ll use to create a consistent look around WMSB! I started with the carosel photos on top of the design and am working my way backwards through the archives.

After 4 hours of figuring out how to make these overlays, finding a software that is Mac & .psd Friendly and won’t break the bank (HELLO 30 day free trial!), and choosing how I wanted them to look, I can now update the photos in a matter of seconds. Seriously, seconds. Holly charges about $25 for a full pack of designs, but now has smaller options for only $5. If she had those $5 packs available two weeks ago, I would have bought them for sure and saved myself the headache. But if you have a shop or want a bigger variety of options, the larger packs are also a steal. The consistent image alone is priceless and I feel like it has transformed WMSB from a standard lifestyle blog to more of a magazine format.

Here’s an example of one such image:

At that point, I was officially done with my design!!

So without further ado, here is the final product!

Homepage

Topic Archives

You can see that I have not updated all 360 of my post images, but I’ll get there!

Archives by Date

I chose a different layout by date because I figured this was more appropriate for scrolling, whereas if someone is searching for posts on a specific topic, that layout is more friendly for a quick glance.

Work With Me Page

I felt like this new design created a cleaner, crisper work with me page as well!

So that’s it! I hope this was helpful to all of you who are curious about doing a blog design on your own! In the end I’m certain I saved money by not outsourcing it, but the time I spent was time that took away from writing on my blog. As a childless person it was easier for me to set aside the time on Saturday and Sunday mornings to work on things. And like I said above, I may have paid for the design if I wasn’t so close to paying off my credit cards. There are a LOT of great reasons to use a professional for this sort of thing, but if you’re just not able to right now, please know it’s possible to have an awesome looking blog on a budget!

I’d absolutely love to hear your thoughts, opinions, constructive criticsm or if you’ve found anything that just doesn’t work properly. Let me know in the comments or send me an email. Thank you!

Also, until April 30, 2016, celebrate 100,000 page views with me and enter to win one of two Starbucks gift cards by filling out the reader survey!