I don’t use infographics much, but this one stuck out to me as helps explain why your website needs to be responsive – that is, look good on mobile devices. Mine does, as it runs Headway, but does yours? If you’re selling something via your website (and you should) then take a look at the stats below.
I get a lot of emails asking me all sorts of questions, but at least once a week (often more) a potential client will say – “Please copy the look of this website….” or “I want my website to look very similar to….”.
My answer is always “Why?”.
Of course I know the answer. It’s because they like it, or they know it’s successful. I’ve had two requests this year already for sites like Yaro Starak’s Entrepreneur’s Journey.
But “Why?” is not really my question. It’s “Why would you want to be like someone else?”.
Be different, or be better but don’t be the same as anyone else. Case in point is a competitor to Headway Themes (that I use on my site and for many clients) – Ultimatum. Below are side-by-side screenshots.
While there is nothing really wrong with what they’ve done by being similar to Headway’s layout, again I always wonder why? They’re both drag and drop themes for WordPress (though work differently), so they’re already similar to Headway in that respect, so why have a similar website? Differentiate yourself, make it look better, unique, new.
There’s a difference between being inspired by someone and trying to emulate them, and being a lesser version of them.
The astute of you may have noticed I’ve added a Shop to my site. This runs on WooCommerce, an awesome free plugin with some paid extensions.
However a few premium themes don’t work with WooCommerce out of the box, so I previously fixed this myself using templates in my child theme. I was going to write a post about how to do that, but there’s no need anymore.
Simply install it like any plugin and it will make WooCommerce work seamlessly on your Headway powered site. I still use a lot of styling in my child theme to make it look better (and overcome some WC Multi Site issues) but now I can remove the template files and know the block is taking care of it.
A “responsive” WordPress theme is one that resizes and looks good on different devices. So on your desktop computer, a tablet or smartphone.
While the awesome Headway theme that I use has had a responsive option for a while now, due to the customizations I had made it didn’t work great out of the box. So I spent some time making my site look good on different devices. The screenshots below show how the site changes for different sizes, but if you want to see it in action, simply resize your browser and it will change for you.
There are quite a few things happening here and that the screenshots don’t tell. Blocks are removed, and in the mobile version the logo is significantly decreased in size and the navigation menu is replaced with a dropdown navigation. There is a great free plugin for this called Responsive Select Menu.
This means I no longer need a mobile plugin like Wptouch and means I have complete control over the way it all looks.
I haven’t worked on many mobile versions of sites but the amount of time (and cost) it takes in some themes isn’t worth it and a plugin is your best bet. For themes like Headway, by default you can get a great responsive looking site. After customization it can take a few hours to perfect and look good, but it was definitely worth it.
Let me know if you have any questions or need help making your site mobile friendly.
A few updates of my, admittedly, awesome WordPress child theme for Headway that allows you to have a full screen video background:
– It now allows users to hide the content to view the video full screen. – Color Picker now allows you to change links color as well as background color of the navigation menu, sidebar headings and homepage post dividers (WordPress 3.5+ only). – A few CSS updates and fixes.
If you already own the theme you can download it again from the email you got or your My Account page if you created one. If you haven’t altered any of the core files you can copy over the new ones via FTP replacing the ones there. If you have customized any files they will be lost so make a backup/note of changes before updating, and then reapply them. In future I’ll keep a proper changelog when version 1.0 is released.
It’s time to release my second Headway child theme. A child theme is like a sub-theme where it inherits everything from the parent, but where you specify any differences the child theme takes precedent. This way you can have your own theme and not worry about updating the parent theme and losing any changes.
In Headway a child theme does NOT inherit any layout, so installing a child theme does not change your layout. You can still have any blocks wherever you want or where you currently have them.
HeadStretch is a Headway child theme:
Allows you to set a full screen image background for the whole site
Image is “stretchy” and will remain a full background when you resize the browser. Give it a go on the demo and resize your browser.
If one image isn’t enough you can set up to six images to rotate (fade) in the background through the admin menu. Plus you can code more images easily if you know how.
You can control the fade speed and duration time on the background changes.
The background is semi-transparent so you can still see your images but this can be increased/decreased/removed via the style.css.
As many of you know I love using the Headway Theme for WordPress. My own site runs off a child theme for Headway. A child theme is like a sub-theme where it inherits everything from the parent, but where you specify any differences the child theme takes precedent. This way you can have your own theme and not worry about updating the parent theme and losing any changes.
In Headway a child theme does NOT inherit any layout, so installing a child theme does not change your layout*. You can still have any blocks wherever you want or where you currently have them. The colors and functionality changes though, and this is where my first child theme comes in…
HeadTube is a free Headway child theme:
Allows you to set a full screen YouTube video background on the homepage
Provides video controls (that can be hidden)
Can change the opacity/transparency of the content areas
Color Picker allows you to change the background color of the navigation menu, sidebar headings and homepage post dividers (WordPress 3.5+ only)
Single post page contains inbuilt social media links that can be hidden
a) Make sure Headway Base is installed under Appearance > Themes. It does not have to be activated.
b) Backup your site using a free or paid plugin like BackupBuddy.
Any current Headway layout/grid settings SHOULD be retained, but you have a backup in case anything is lost.
c) Under Themes > Install Themes upload the zip file (see below) and activate the theme. Once downloaded, see the enclosed README.txt for full usage instructions.
d) Options appear under Headway > Theme Options or on the WordPress admin bar as HeadTube Options.
This theme is provided “as is” and without any warranty, so use at your own risk. You must own a copy of Headway in order for this child theme to work.
*Headway’s latest version (3.4.1 at the time of writing) has introduced skins. These DO take alter your layout, you can save a layout(s) as a skin and import it into another Headway installation to replicate the layout. It also takes the Live CSS so in a lot of ways is similar to a child theme but doesn’t allow such functionality changes like this child theme.
Does this sound familiar? Often you have ideas for websites but not the time to set them up. So you register the domain for future and then leave your webhosts default parking page up there.
The problem with this is that you’re getting no benefit from this parking page. A way around this is to create a launch page. This is essentially a page with some details and an email address capture box. You can also hold competitions with prizes for people referring others to sign up on your site.
There are a few ways to do this.
LaunchRock started this idea (or at least made it mainstream). They provide a hosted launch page that allows you to create a page to collect email addresses, track stats of those signing up and allow people to gain credits for referring others with their link. This helps you build your database and can help build some anticipation if you have some cool prizes.
However this isn’t hosted on your own site, and can be a tiny bit tricky technically depending on your skill level to use your own domain name. However it is a great free solution and pretty quick.
If you want more control and are going to be using WordPress for the website once it’s ready, then you might as well use a WordPress theme. There are some free and paid for options out there.
LaunchPad is a great free WordPress theme. It creates a nicer looking parking page for your site, but the optin email is only done through Feedburner. If you want to use e.g AWeber, then you will need to hack the code to do that. It’s not that difficult to do, and it’s a simple and easy theme to use if you just want to use Feedburner and want to change things yourself. Hover it doesn’t include any social sharing or tracking options
Launch Effect Theme
Launch Effect is another free theme but with a paid-for premium option. It’s worth mentioning that the makers provided me a free copy of Launch Effect Premium so I could review it but that has no effect on my review (nor did they even insist on doing a review).
I’ve set up a demo here so you can see how it works – BulletproofBeer.com. The theme does the same as you would expect but allows to you easily change the options. So you can add your own background (which nicely resizes along with the browser), change the font types, colors, sizes and so on.
You can see on the a href=”http://bulletproofbeer.com/” target=”_blank”>demo I’ve added a Spotify music player but you can easily add a video, images or just have text. The “learn more’ link is optional, the color can be changed easily too, and the sub-pages have a standard sidebar widget area you can use. There are many options making it easy to change the look of the page without any coding – as part of the review I refused to do any coding (as tempting as it always is!) to see how flexible it is.
You can easily add a progress indicator and/or fancy countdown clock. Images have a lightbox photo gallery effect automatically (images appear in the same screen over the top of the page).
Some of these features are premium only, but what’s not is the AWeber, MailChimp and Campaign Monitor integration. As well as adding the email address to WordPress, you can sync it with e.g. an AWeber list and build your email list through there. Which is great!
Also the premium version allows you to have a full designed blog on the site too (with slide down tab at the top to sign up) and coming soon is Paypal integration to more easily allow selling of products on there.
The single site license is only $35 for lifetime updates which is pretty cheap, even if you only use it for a short period of time (which often turns into a long time if you’re anything like me!). The unlimited site version is $65.
In future they’re updating the mobile version and possibly creating it as a plugin to work with any theme rather than taking over your current one.
To me, Launch Effect seems an inexpensive and easy way to get a parking page up there and doing something for you. There are lots of controls and no coding or complex stuff required, you don’t even need a newsletter system, though it integrates with a few, it will still collect email address (and other fields if you have the premium version) right into WordPress.
As the year is flying past already, I thought it would be a good time to freshen up my blog design. If you haven’t stopped by my site for a while come and check it out.
I’m still using the awesome Headway theme, but this time it’s on the latest 3.0 version which has been completely rewritten to be even more powerful. It allows you to “draw” your own site by creating grids and boxes where you want things to be, and adding some graphics and you have what you see here. It takes a little getting used to ans is not an “instant theme” but you have so much more flexibility
I actually created a child theme for Headway. This is a good idea with almost any theme, all it is is keeping all my changes in a separate theme to the main Headway theme. Then when any changes/upgrades are made to the main Headway theme I don’t lose any changes to my own site.
Feel free to let me know what you think, I’ll be changing it as I go along.