Updated My Website, New WordPress Child Theme for Twenty Eleven

Since WordCamp Atlanta 2012 I’ve had the itch to create a new theme for this website.

A direct comment about my last theme choice from Mr. Mullenweg might have been that itch… either way it was way paste due and I am looking forward to this update.

I’ve been wanting to create a sleek child theme that I could offer for other people to download and use.

On that note, this weekend I decided to take the plunge, and as you can see, have made some progress. Here is a quick overview.

What Do I Need And Want?

Minimalist Clean Theme

A super clean theme with minimal distraction from content. This is good for me because I would like readers to focus on my content.

Graphics do make websites look great, but as I am not a designer, nor are most people downloading and using free themes, I don’t have that option.

What I can do though is post pictures in my content that look great, which will make my site look great, on this slick white background.

Feature Box on Home Page

Add a custom widget area at the top of the home page to be used as a Feature Box.

Instead of hard coding this content into a custom template, I wanted it to be dynamic so that I could make changes easily. Using the Title and the Body of a standard Text Widget gives me great flexibility.

Sidebars on all POSTS

Twenty Eleven does not have sidebars on POSTS by default. This is in an effort to showcase the content and be less distracting.

I want my sidebars!!

Sidebar Width

Something else Twenty Eleven could change by default is the sidebar width. They allow a tiny area where everything gets smooshed. There is plenty of padding and margin available for content, so I am going to use it.

Share Buttons

I am not a big fan of the ‘share on ALL SITES buttons’ plugins that are available. I only want to make it easy to share my content for the main social networks at this time.

Automatic Facebook Preview Image

When sharing a link on Facebook, it will try to offer a preview image based on the images it finds on your site.  We have a way to specify what that images is in our header data.

To make it really easy, I want to specify the image in this order

Use Featured Image, else use First Image, else use Default Image.

Why a Twenty Eleven Child Theme?

The main reason I am all for Twenty Eleven is the responsive design. Easily allowing any platform to view my website and my content is a must…and I do not want to design two websites(browser and mobile).

I’ve not yet, but would like to start using the new Post Formats.  As these are already built in, I will have to do minimal customization to get started using them.

The Twenty Eleven theme comes default with all WordPress installations which means there is no need to purchase a premium theme framework. Everyone will be able to use this theme right away.

In keeping with the mantra of work smarter not harder, I would like to continue utilizing the built in WordPress functionality. Things like menus, header image, link and page background color, galleries, etc.

Most of what I want is already available in the default theme, but I want to customize that and make it my own unique website.

What Have I Done So Far

I’ve done a good bit so far and my ‘child theme’ has 7 files now. My main objective was to strip away as much of what I did not need as possible, then start adding.

Starting with the CSS changes, I minimized graphics and maximized my use of space. Then started working on adding the functionality I needed. Adding the widgets was a breeze and I already had the code for some of the other functions.

CSS styling affected the following:

• content and sidebar width
• padding and margins
• sidebar titles
• navigation bar
• post comment bubble

Added functions to do the following:

• sidebars on all POSTS by default
• Widget area in place of Search form field
• Widget area for Custom Message on home page
• specify first image in content is Facebook preview thumbnail

The share buttons were easy using the Sharing part of Jet Pack, which let’s me use plugins hosted by WordPress.com.

The real fun part was getting everything set up so that my website automatically sent a link out to Twitter and Facebook ONLY when the post was ‘published’ from my phone…which is why the auto generation of the Facebook preview thumbnail is important.

Now, that is all automated and I’ll be shoot more pics and videos to this site where you’ll see them in your social media streams first.

So What’s Next?

Over the next few weeks I will be tweaking this theme to my liking. Once most of the kinks are worked out, I plan to release it for free download.

Most of the remaining tasks are styling. As I need functionality I will add it, but do not want to bloat this child theme. I want to facilitate the bare minimum for showcasing great content and converting readers.

Before I do release this, I want to make sure that it is easy for someone other than myself to understand and work with.

Keep your eyes peals and let me know if you have any suggestions. 🙂