Empfire is now responsive!

25th June 2015

Empfire.info new layout

One of my new years resolutions was to create a responsive WordPress theme. Here it is!

Since I’ve been unemployed I’ve been buffing up my coding skills, and I like to think it has paid off. I know I change my layouts quite frequently, but I my aim is to keep this one up for a while.

Despite this layout being responsive it is not mobile friendly, and so I will be sticking with the mobile friendly theme powered by Jetpack. This is because I still need to learn how to make mobile friendly websites (my next design challenge), especially now Google is so damn picky about mobile friendliness.

I have a few things to say about the new layout.

First of all, as it is the first responsive layout I’ve ever coded, there maybe issues. If you have any problems at all navigating or using the blog, please do tell me.

And, as with every new layout I make, I’ll be making changes over the next couple of days to get everything looking perfect.

Another point I need to make is about the “Subscrive via email” section in the sidebar. Previously when you entered your email address you’d be subscribed to the email system powered by Jetpack, and this automatically sent an email to your account each time I posted a new blog. If you signed up, you will still received these emails.

However, if you sign up now, things will have changed. The subscribe section is now powered by MailChimp, which means if you add your email address to the mailing list you will still receive an email in your inbox containing the latest blog post but it will be delivered via MailChimp.

Obviously this is more work for me. I have to manually transfer the blog post into the MailChimp system to be sent. However, I think it will be worth it because I really don’t like the format that Jetpack uses for it’s automatic emails.

If you like this system or absolutely hate it let me know. I can only improve the blog if I get feedback from you guys.

I really hope you like the new layout, because I’m quite happy with it. As I say, expect a few changes over the next few days, and keep your fingers crossed that I don’t mess up any of the code!

P.S. The top image is not representive of my computer choice. I’m a Windows/PC girl all the way!

Enjoyed this post? Why not share it...

  1. Danielle

    Love the colors that you chose!

  2. Awesome work Holly! Glad you put your spare time to good use, and you should be proud of your work! 🙂

    Digging the new logo design too. I would probably suggest making the logo a little smaller on mobile, too.

    I really wanted to start my own newsletter that included more than just my blog posts. I don’t like the way Jetpack displays posts either, but I have chosen to keep it for now, because it works quite well and does mean less work. If I feel up for it, like you, I might try using MailChimp or Campaign Monitor to update subscribers of new blog posts or maybe just news for my blog in general. I’m subscribed to your blog with Jetpack, but feel free to toss my email into your MailChimp campaign… 😀

    I’ll let you know if I have any suggestions or run into any issues on the way, but if there is anything you would like me to help out with or specifically provide feedback for, I’m just an email away 🙂

    PS. Just realised it may be necessary to remove the “notify me of new posts / follow-up comments” from under the comment form if you aren’t going to be using Jetpack anymore.

    • Holly

      Thank you so much! It really means a lot of receive such positive feedback. 🙂

      I’m glad you like the new layout. I’m no graphic designer so I just kept it super simple.

      And thank you for the recommendations. I’ll definitely make the logo a more suitable size for mobile devices, and I’ve just removed the options at the bottom at the post.

      I recently applied for a job that wanted someone with MailChimp experience, so this is another reason why I’ve decided to switch. I can make really simple and clean looking email campagin that looks so much better than the Jetpack one. Plus I find it easier to manage my subscribers.

  3. Susanne

    It looks good!! However, to make it mobile friendly isn’t that hard. I set mine with media queries smaller than and larger than 767px and everything below 767px would be both content and sidebar width 100%. You’ll need to check that the sidebar comes after the content in the php code first, otherwise the sidebar will be on the top.
    Having too much time on your hands can be a good thing actually!

    • Holly

      Thank you for the advice! I’ve actually done this (took me ages to work out how to get my sidebar to move below!) but I think there’s a problem with the font sizes and other features. I think I need to use ’em’ for the text. I’ll look into it!

      Yes! There are many benefits to have extra free time. Keeping busy is key!

  4. Girl, it looks great!

    I love the blue colour scheme you have going here. Everything looks clean and legible. I also love how you alternated the colours in your navigation! Just, wow! I’m impressed! Congrats on making a responsive theme! I wish you luck with your next step of making it mobile-friendly!

  5. Congrats!!! I like the new design and it’s great you made it responsive.

  6. It looks amazing, all your hard work was definitely worth it! Xx

  7. Simplicity in web design and development is beautiful I really like this layout it looks great! I tried it on my iPad and it looks awesome there too! Congrats on using your spare time in a great way

    • Holly

      Thank you for taking the time out to test it for me! It means a lot.

      I’m so glad you like the new layout.

  8. Cat

    Nice job on the layout! I like the choice of blues. It’s very soothing and easy on the eyes. Congrats on making your first responsive layout too! I noticed that as you size down the browser width, the search bar starts to overlap your site logo. Looks great otherwise though 🙂

    • Holly

      Thank you. That’s exactly what I was aiming for with the colour scheme.

      Thanks for the heads up. I will certainly look into fixing this. 🙂

  9. Jamie

    I absolutely LOVE the new design. I was wondering when a new design would be put up. I loved the old one as well. Like you, I’ve had some time to learn Responsive Web Design, but I am still trying to master it. I’ve purchased books on the subject, and bugged many a people about it. But, I still don’t understand it, so I’m giving up on it for now. But I really love the colors. Like you, I made a new layout as well. I have a lot of time on my hands, despite having to read dialogues from several books for my Philosophy class, but still.

    • Holly

      Thank you!

      I had a rough idea how to made a responsive theme before I started coding this one, but I spent a lot of time Googling any issues that came up. There was a lot of trial and error!

      I’d love to write some tutorials one day when I’ve completely mastered it myself. I’m still learning!