When I set out to make my first Thesis skin I wanted to keep things simple (and free).
I also wanted to create a design that put the emphasis on content and conversion.
The result is Kickstarter, a clean, simple skin that lacks clutter and gets you past the ‘out-of-the-box’ Thesis look and feel.
In coming up with the design, I asked myself what were some of the features I look for in a blog design as well as what were people asking for help with in the DIYthemes forums.
Features
Here are some of the features Kickstarter comes with:
- Custom styled Feedburner opt-in box
- Custom styled landing pages
- A widgetized footer for your copyright text
- Built in styling for Gravity Forms
And when I looked at some of the design customizations people were asking for help with in the forums, here are few popular requests I found:
- Nav menu displayed inline with the header
- Colored sidebar that runs the length of the theme
- Boxed hover effect over sidebar links
Although these features are relatively simple, non-coders often struggle to achieve them and that’s why I chose to include them in Kickstarter.
And by keeping the overall design simple and neutral, you have the opportunity to change the look of your site simply by changing the primary link color and/or the nav bar colors.
Out of the box Kickstarter comes in a nice red (#B81919), but you could easily change it to the Thesis default blue (#2361A1) or a nice green (#539C0f).
Designed for Conversion
The two most important features are the baked in styles for the Feedburner opt-in box and custom landing pages because they should help improve your conversion.
A well designed opt-in box that integrates seamlessly into your site is important for building trust and looking professional. Unfortunately the default code that Feedburner supplies creates a form that often looks un-styled and out of place. Kickstarter solves this with styling that makes your Feedburner widget look great in your sidebar.
Landing pages are also “mission critical” when you want people to take a desired form of action. Whether you’re trying to cash in with a sales page or grow your list with an email opt-in page, conversion improves with a focused design that does away with the regular sidebars and other distractions.
With Kickstarter you can activate a custom landing page simply by selecting ‘No Sidebars’ from the ‘Template’ drop-down when editing a page in WordPress.
So if you’re in the market for a Thesis skin and want a de-cluttered look that puts the emphasis on content and conversion, then Kickstarter will get you up and running quickly.
Plus it’s free 
.
Click the button below to download Kickstarter now:
Running Thesis 1.81? Please use this thesis-all-options.dat file instead of the one included in the download above which is for Thesis 1.8. Installing Kickstarter is quick and easy: Reminder: replacing the ‘Custom’ folder will cause you to lose any existing customizations you’ve made to your custom.css and custom_functions.php files. The optimal height for your header image is 100 pixels high. The maximum width of your header will depend on the number of tabs in your nav menu but you should be ok with an image 500 pixels wide or less. To upload your header, go to Thesis » Header Image » Upload in your WordPress dashboard. Adding an email opt-in form from your Feedburner account is easy. First, in your Feedburner account make sure you’ve activated email subscriptions by going to Publicize » Email Subscriptions and clicking ‘Activate’. Next, add a Text Widget to your WordPress blog sidebar in Appearance » Widgets. Paste the following code into the text widget: Make sure you replace both areas in the code snippet where XXXXXX appears with your Feedburner feed title which you can find at the end of your feed URL. You can also change the call to action text to whatever you want. Click save and you’re all set. Here’s how to take advantage of the built in landing page styling that comes with Kickstarter. Click save or publish and that’s it! And don’t forget Kickstarter’s landing pages come with custom styling for Thesis’ built in ‘alert’ class. If you want to add a sharp looking opt-in form to your landing pages, simply paste the same Feedburner code snippet above into your landing page but add before the code and after the code. Make sure you’re in the HTML editor, not the Visual editor when you’re pasting in code You can see an example in action on the live demo landing page. To edit the copyright text in your footer, go to Appearance » Widgets and add a new text widget to the ‘Footer Copyright’ widget area. Leave the title of the widget blank and add your copyright text to the body of the text widget and click save. Get started with Kickstarter now: Running Thesis 1.81? Please use this thesis-all-options.dat file instead of the one included in the download above which is for Thesis 1.8. If you need help with installation, customization or opt-in form integration for services like Aweber or Mailchimp, make sure you check out my support packages. And if you have any questions about using Kickstarter, please leave them in the comments below.
Installing Kickstarter
Adding a header image
Feedburner Email Integration
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=ContentConverts', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><p>Get updates delivered straight to your email inbox:</p><p><input id="emailinput" type="text" style="width:220px" name="email"/></p><input type="hidden" value="ContentConverts" name="uri"/><input type="hidden" name="loc" value="en_US"/><input id="emailsubmit" type="submit" value="Get updates!" /></form>
Using Landing Pages
First create a new page in WordPress. On the right-hand side of the page under the Page Attributes » Template drop-down select “No Sidebars”. Adding Feedburner Opt-in forms to your landing pages
<div class="optin">
</div>
Widgetized Footer Copyright
Does this skin have the same landing pages that contentconverts has?
Yes, more or less the same.
Mark,
Is this set up for Thesis 1.8.2 as well?
I dropped the files into my site yesterday and it looks completely messed up!
Hi Mark,
Thanks for making this skin available for free. Loading it up on my test site now.
I dabble in thesis coding myself, can you recommend any guides for learning a bit more about it? and css?
Thanks,
Chris
Chris,
W3 School CSS tutorials are always a good place to start.
You can also try grabbing some example CSS from some of the customization tutorials in the DIYthemes support forums and user’s guide and then paste it into your test site, refresh your site and analyze the changes and the CSS in your browser with a tool like Firebug (which is a crucial tool).
Great thanks. Just need to spend some quality time without distractions learning!
Possible to make a quick update on the Thesis-all-options.dat file for new Thesis 1.8.1 ? thx ever so much =)
Nicholas,
I’ve made the update – you can download the .dat file for Thesis 1.81 above.
wow..great sharing dude..
now im using a free skin too..but i will use your skin in my new niche blog..my friend reccommend this skin for me..thanks dude
Thanks Haru,
Let me know when you get it set up.
Mark,
LOVE this Thesis skin!! Just set it up on my site today – and it looks great!! I especially love how the buttons look with Gravity forms – very nicely done!
Glad to hear Lance,
Looks good!
Hi
I already download and use this skin,it`s very smooth and clean
thanks for your cool skin
Not sure what I’m doing wrong. Followed the instructions exactly, but under design and site options it says:
ATTENTION! Your /thesis/custom/layout.css file is not writable by the server, and in order to work the full extent of its magic, Thesis needs to be able to write to this file. All you have to do is set your layout.css file permissions to 666, and you’ll be good to go. After setting your file permissions, you should head to the Design Options page and hit the save button.
Those files don’t exist after replacing the custom folder, and the skin is broken?
Hmmm strange. Your saying the layout.css file doesn’t exist on your server after replacing the custom folder?
If so, try moving the individual files inside the Kickstarter custom folder over to your server one at a time rather than the entire folder at once.
And make sure your layout.css file permisions to 666.
Not sure what I’m missing, but if I’m replacing a folder with a folder that does not have layout.css, how is it supposed to be there?
Okay, so I did what you said but the nav menu is still the same. Here’s a screenshot. Thanks.
http://img35.imageshack.us/img35/7168/screenshot20110624at100.png
After refreshing multiple times, Chrome managed to update the style sheet. The only thing that confused me was the new ‘custom’ folder which does not contain the layout.css file. I did delete the original custom folder entirely at first (maybe that was it), as I’m not all too familiar with how a folder is replaced through an ftp program. Thought maybe it would just replace the folder entirely with only the new files in the skin folder, but I guess that’s not how it works? Thanks again, and for the great theme.
Ya – you shouldn’t delete the original custom folder. That was it.
The Kistarter custom folder only contains the files that are customized – not the entire contents of the original Thesis custom folder.
Sorry for any confusion.
Hey There,
It says “Whoa there! The All Options you attempted to upload are from version 1.8 and are not compatible with Thesis 1.8.1.” when trying to bring this in.
Any ideas?
Caleb
Caleb, if you’re running Thesis 1.8.1 then you need to use the Thesis 1.8.1 All Options file that I supplied under the download button above where it says “Running Thesis 1.81? Please use this thesis-all-options.dat file instead of the one included in the download above which is for Thesis 1.8.”
Mark – do you know if your skin works with Gravity Forms? Doesn’t want to display a form in my case. It also shows a somewhat different than usual behavior (dialog boxes) when editing/saving a form, yet that part seems OK overall. The form shows within the Gravity plugin test buttom. But when I insert the form in the page, it’s like it is not there at all.
Other than that I like the skin design very much!
This sounds like it could be a caching issue (unrelated to the skin). Try clearing your browser’s cache. Beyond that, I suggest getting support from the Gravity Forms folks.
Thanks for the suggestion, Mark. I did clear cache, but no change
I certainly do not expect you to provide support for free skin, I simply wanted to know if you have used Gravity Forms without problems with it.
I do not use any cache plugins, and to troubleshoot I went to my other (Thesis) site, loaded Gravity Forms, created a similar form, and it displayed just fine. So based on this I was thinking that Kickstarter_10 may have not been compatible with GF?
Another interesting thing is that when I view a page after editing it in WP/Thesis/Kickstarter, it doesn’t show this “new” WP-style dashboard on top of the page/screen…
Hey Mark, very cool and clean looking skin busy setting it up right now. I love the detailed setup instructions, keep up the good work!
Thanks Jacques, let me know how it goes.
Done – very nice – great fun installing it.
It’s a keeper.
Now, what am I going to write on the site? Oh yes, that’s where the blogging starts.
Follow up question: How to make full width strip across the top like you have done? It is not the header area, just a strip within the header area – very nice but how to do it?
awesome thesis skin, gonna try this, thanks
Hello,
I am using these 1.8.2
I’m following your instructions for text widget but after Killer Recent Entries – nothing below it will move. I can’t drag them, though I can drag all of the items above.
I also created a landing page per instructions but the page tab doesn’t show up on my site after publish.
Thanks in advance
Hi Rick,
I’m not sure I follow you here. Can you clarify?
If you want your landing page to appear in your navigation menu then you have to add it either in the Thesis Site Options area under ‘Navigation’, or if you’re using the WordPress menu system, in Appearance»Menus.
Hi Mark,
If you go to Appearance, then to Widgets there is a list of available widgets. Beginning with Archives, which I can drag as well as all the widgets down to Killer Recent Entries. However, when I try to drag any widget after that – like Links widget or Text widget, it just highlights the text under the tab but won’t drag.
I’m not sure why you can’t drag certain widgets but that sounds like a problem with WordPress in general rather than the skin.
Sorry. I suggest asking for help in the DIYthemes forums for that one.
Hi Mark,
What is the easiest way to revert back to the beginning pre-kickstarter? There isn’t exactly an uninstall Kickstater button
Do I simply replace the custom file again with the Thesis version? I will start over from the beginning and see if it works prior to the changes.
Thanks in advance,
Rick
Yes, you should replace the custom file with the default Thesis one.
Hi Mark,
Just in case anyone else has the issue with Widgets not working, this is a simple temp fix that I found on DIYthemes.com forum:
>In the widgets section, go to the top right, click on Screen Options and >activate accessibility mode. Then manage widgets by clicking add…
Maybe a Browser or Java problem on the server or the like?