In anticipation for .blog domains going live on November 21st, I’ve been thinking about changing the look of this blog.

After stumbling upon the Ecto theme last week, I knew what I wanted the site to look like. Unfortunately, that theme has been retired on the WordPress.com themes list. I was lucky enough to grab a copy before it was retired though. 🙂

A few modifications

By default, the sidebar is hidden in Ecto until a user clicks a button. While this does help a website stay “clean”, I’m not a big fan in hiding the menu behind a click. So, I decided to show the sidebar for screens wider than 1200px.

new-site-main

I did that with this CSS:

@media only screen and ( min-width: 1200px ) {
    #page.site {
        left: 0;
        width: 75%;
    }

    #slide-menu-toggle {
        display: none;
    }

    #slide-menu {
        display: block;
        right: 0;
        visibility: visible;
    }

    #infinite-footer .container {
        float: left;
        width: 75% !important;
    }
}

That actually turned out to be a much simpler task than I thought it’d be. I’m sure I’ll figure out that I’ve missed something here in the near future. ¯_(ツ)_/¯

The next thing I did was not to show featured images in the archive view. Since most of my posts are images that are imported from Instagram, it didn’t make sense to show the image above the title and then show it again in the content.

Compare to the old

My previous site was a modification of the TwentySixteen theme. While I was a fan of its simplicity, I was ready for something different.

old-site

4 thoughts on “New site design

  1. I like that sidebar trick. I’ve actually stayed away from many themes that otherwise looked great, just because of I’m not a fan of the hidden sidebar. I’ll definitely consider your idea next time I switch themes!

    Unfortunately, that theme has been retired on the WordPress.com themes list.

    It will always be here for those who really want it:
    https://wpcom-themes.svn.automattic.com/ecto/

    😉

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.