Showing posts with label Design. Show all posts
Showing posts with label Design. Show all posts

Is your blog too cluttered? Too much information for one sidebar? Then you should try one of these free 3 column WordPress themes. From clean and minimal to graphic and creative templates to use on personal, corporate or magazine style blogs, this selection of 20 of the best 3 column WordPress templates will definitely help you make the right choice.
Please visit their authors’ sites, available at the “Info & Download” link, to learn more about each of these themes.
Elements of SEO
ElegantBlue
Simple Balance 2.0
Pride
Silhouette
Grid Focus
Neoclassical
Fervens
MassivePress
Agneka Simple
Sans-Serif Racer
WP Imagination
Dilectio
DailyPress
Unbound
Woodtastic
Bird
Dark Zen
Lorem Ipsum
Rainbow Circles

Your business’ blog doesn’t have to look boring or childish. If you’re going to use your blog as a tool to promote your business, you need it to have a clean, professional, corporate look. Here’s a round up of 20 of the best free corporate WordPress themes available. Preview them and if you find one of your taste, go ahead and download it.
While some of them are free for personal use, others may be subject to a small one time fee for professional use. Please visit their authors’ sites, available at the “Info & Download” link, to learn more about each of these themes.
Several3
Modern
Gluttony
Whitespace
d’sanctuary
Brown Bound
Brown Magic
Yellow 3
PointSpace
Basic
Zoxengen
Timeline Digest
SunRise
Corporate Sandbox
The Morning After
Deadwood Lite
PolarLight
Natural Power
Copyblogger
Evolution

These days I’ve been working on a new project and I needed an RSS icon that is simple and elegant, and after designing one to use in my project, I decided to create a few variations and release them as a pack for those who might need it.
Feedsessive features 50 free RSS icons, split into 2 two design styles (basic and outlined), each with 25 color variation.
All the RSS icons are available in 3 formats:
- EPS (vector) format
- PDF format
- Transparent PNG format at 300dpi
* Packed size: 2.22 Mb
Here’s a preview of all the icons in the set:
* Packed size: 2.22 Mb
By popular demand, I decided to publish a short tutorial on how to add your own logo to the Simple Balance WordPress theme.
So, in order to achieve this we’ll walk through the following steps:
As you can see on the live demo, I’ve used a .gif image for logo, and basically, this is what you are about to achieve with your own blog too.
Once you’ve saved your image, upload it to the “img” folder inside the Simple Balance theme folder (wp-content/themes/simplebalance/img). From here, we’ll link to it later.
Open the file with a text editor (a basic Notepad should suffice) and look for this lines of code:
The ‘display’ and ‘text-indent’ properties are meant to ensure the correct display of your logo, so you should not worry about those, but keep them. They are important.
Once you finish the editing, save the file and reupload it to your server. Et voila, the logo should be there the next time you check you blog.
If you have any questions, i’ll be happy to answer in the comments section of this post.
[More]
So, in order to achieve this we’ll walk through the following steps:
- The logo image guidelines and instructions;
- Files to update;
- Code explanation.
The logo requirements
In order to achieve the best implementation quality of your logo, you should consider saving you logo with a transparent background. A .gif file will work well, and if you’re using a software like Adobe Photoshop to edit your images, when saving the image (File > Save for Web & Devices…), setting the Matte to white would be good. This will ensure that the margins of your transparent background logo will look good on Simple Balance’s light background color.As you can see on the live demo, I’ve used a .gif image for logo, and basically, this is what you are about to achieve with your own blog too.
Once you’ve saved your image, upload it to the “img” folder inside the Simple Balance theme folder (wp-content/themes/simplebalance/img). From here, we’ll link to it later.
Quick tips
- Save your logo with transparent background;
- Save it with a white matte;
- Keep the width below 200 pixels, as that’s the maximum space reserved for the logo;
- Write down the size of the image (width and height), as we’ll use them later.
Adding the logo in your CSS stylesheet
Now that you have uploaded the logo on your FTP, it’s time to add it to the design. There’s only one file you’ll need to update, and that is style.css, which is located in the root folder of the theme.Open the file with a text editor (a basic Notepad should suffice) and look for this lines of code:
.topLogo h1 a, .topLogo h2 a {
text-decoration: none;
color: #d90202;
}Select the whole block and replace it with the following code:.topLogo h1 a, .topLogo h2 a {
text-decoration: none;
color: #d90202;
display: block;
width: 156px;
height: 42px;
background: url(img/name-of-your-logo-file.gif) no-repeat;
text-indent: -9999px;
}Be careful
… and don’t forget to replace the values in this new block of code with the real values of your image, as follows:width: 156px;The ’156′ value should be the actual width of your image. ’156′ is only a width I used as an example. Do not delete the ‘px’ text as it defines our measuring unit.
height: 42px;The ’42′ value should be the actual height of your image. ’42′ is only a width I used as an example. Again, be careful with the ‘px’.
background: url(img/name-of-your-logo-file.gif) no-repeat;Replace ‘name-of-your-logo-file.gif’ with the actual name of your logo file.
The ‘display’ and ‘text-indent’ properties are meant to ensure the correct display of your logo, so you should not worry about those, but keep them. They are important.
Once you finish the editing, save the file and reupload it to your server. Et voila, the logo should be there the next time you check you blog.
A good idea…
…would be to go to the Simple Balance Control Panel (WP administration > Design > Simple Balance 2.1/2.0 CP) and uncheck the box that displays the blog description. Of course, only if you think it affect the design, or the new logo in a bad way.If you have any questions, i’ll be happy to answer in the comments section of this post.
One technique that is most common with WordPress magazine or news style themes is the display of an archive of the latest posts by category, as simple titles or with post excerpts. This is useful for the previously mentioned theme styles, but not only. It can be used to set up custom blog homepages, 404 pages, landing pages or even a special archive page.This tutorial will help you build a ‘Latest Posts by Category Archive‘ in a very easy way. The widths in the CSS styling presented below have been calculated based on the default WordPress theme, assuming that is the most common theme available to anyone.
If you are looking for a plugin to generate such an archive, please check out: WP Plugin: Latest Posts by Category Archive.
Setting up the page template
Open up you favorite code editor and create a blank document. Save the document as ‘category-archive.php’ (or any other name you’d prefer) in the default WordPress theme directory (wp-content/themes/default).The first step is to asign our new template a name and a page-like structure, so based on the default theme’s page template, the code you should paste in your new document is:
01.<?php02./*03.Template Name: Category Archive04.*/05.?>06. 07.<?php get_header(); ?>08. 09.<div id="content" class="narrowcolumn">10. 11. <?php if (have_posts()) : while (have_posts()) : the_post(); ?>12. <div class="post" id="post-<?php the_ID(); ?>">13. <h2><?php the_title(); ?></h2>14. <div class="entry">15. <?php the_content('<p class="serif">Read the rest of this page »</p>'); ?>16. 17. <?php wp_link_pages(array('before' => '<p><strong>Pages:</strong> ', 'after' => '</p>', 'next_or_number' => 'number')); ?>18. 19. </div>20. </div>21. <?php endwhile; endif; ?>22. 23. <!-- Category Archive Start -->24. <!-- Category Archive End -->25. 26.</div>27. 28.<?php get_sidebar(); ?>29. 30.<?php get_footer(); ?>Adding the archive’s PHP code
Simply put, the code below will cycle through the first-level categories of your blog (parent categories), check for the ones that are not empty and if this condition is met, return an unordered list of the latest 5 post from each category. Empty categories will not be displayed.01.<?php02./*03.Template Name: Category Archive04.*/05.?>06. 07.<?php get_header(); ?>08. 09.<div id="content" class="narrowcolumn">10. 11. <?php if (have_posts()) : while (have_posts()) : the_post(); ?>12. <div class="post" id="post-<?php the_ID(); ?>">13. <h2><?php the_title(); ?></h2>14. <div class="entry">15. <?php the_content('<p class="serif">Read the rest of this page »</p>'); ?>16. 17. <?php wp_link_pages(array('before' => '<p><strong>Pages:</strong> ', 'after' => '</p>', 'next_or_number' => 'number')); ?>18. 19. </div>20. </div>21. <?php endwhile; endif; ?>22. 23. <!-- Category Archive Start -->24. <ul class="catArchive">25. <?php26. $catQuery = $wpdb->get_results("SELECT * FROM $wpdb->terms AS wterms INNER JOIN $wpdb->term_taxonomy AS wtaxonomy ON ( wterms.term_id = wtaxonomy.term_id ) WHERE wtaxonomy.taxonomy = 'category' AND wtaxonomy.parent = 0 AND wtaxonomy.count > 0");27. 28. $catCounter = 0;29. 30. foreach ($catQuery as $category) {31. 32. $catCounter++;33. 34. $catStyle = '';35. if (is_int($catCounter / 2)) $catStyle = ' class="catAlt"';36. 37. $catLink = get_category_link($category->term_id);38. 39. echo '<li'.$catStyle.'><h3><a href="'.$catLink.'" title="'.$category->name.'">'.$category->name.'</a></h3>';40. echo '<ul>';41. 42. query_posts('cat='.$category->term_id.'&showposts=5');?>43. 44. <?php while (have_posts()) : the_post(); ?>45. <li><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>"><?php the_title(); ?></a></li>46. <?php endwhile; ?>47. 48. <li><a href="<?php echo $catLink; ?>" title="<?php echo $category->name; ?>">More <strong><?php echo $category->name; ?></strong></a></li>49. </ul>50. </li>51. <?php } ?>52. </ul>53. <!-- Category Archive End -->54. 55.</div>56. 57.<?php get_sidebar(); ?>58. 59.<?php get_footer(); ?>The PHP code explained
The first thing we do is to set up a database query to cycle through the non-empty parent categories:1.$catQuery = $wpdb->get_results("SELECT * FROM $wpdb->terms AS wterms INNER JOIN $wpdb->term_taxonomy AS wtaxonomy ON ( wterms.term_id = wtaxonomy.term_id ) WHERE wtaxonomy.taxonomy = 'category' AND wtaxonomy.parent = 0 AND wtaxonomy.count > 0");Let’s say that you’d like the archive to exclude the categories with IDs 2, 5 and 6. Your query would become:
1.$catQuery = $wpdb->get_results("SELECT * FROM $wpdb->terms AS wterms INNER JOIN $wpdb->term_taxonomy AS wtaxonomy ON ( wterms.term_id = wtaxonomy.term_id ) WHERE wtaxonomy.taxonomy = 'category' AND wtaxonomy.parent = 0 AND wtaxonomy.count > 0 AND wterms.term_id NOT IN (2,5,6)");1.$catQuery = $wpdb->get_results("SELECT * FROM $wpdb->terms AS wterms INNER JOIN $wpdb->term_taxonomy AS wtaxonomy ON ( wterms.term_id = wtaxonomy.term_id ) WHERE wtaxonomy.taxonomy = 'category' AND wtaxonomy.parent = 0 AND wtaxonomy.count > 0 AND wterms.term_id IN (2,5,6)");Next, we set up a category counter which will be incremented each time a category will be displayed. Based on this counter, the code adds a ‘catAlt‘ class that you can use to style differently consecutive categories. In our case, we’ll use it to shift the categories into two columns. This is were the alternate classes are assigned:
1.$catCounter++;2. 3.$catStyle = '';4.if (is_int($catCounter / 2)) $catStyle = ' class="catAlt"';1.foreach ($catQuery as $category) {2. /* Code used to retrieve and display the latest posts */3.}1.echo '<li'.$catStyle.'><h3><a href="'.get_category_link($category->term_id).'" title="'.$category->name.'">'.$category->name.'</a></h3>';1.query_posts('cat='.$category->term_id.'&showposts=5');?>2. 3.<?php while (have_posts()) : the_post(); ?>4. <li><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>"><?php the_title(); ?></a></li>5.<?php endwhile; ?>6. <li><a href="<?php echo $catLink; ?>" title="<?php echo $category->name; ?>">More <strong><?php echo $category->name; ?></strong></a></li>Styling the archive
Find the style.css file in your default theme’s directory, open it and scroll down to the end of the file. Now copy the code below and paste it in your file.01./* Latest posts by category styles */02. 03..catArchive {04. width: 450px;05. overflow: hidden;06. margin: 20px 0 0 0;07. padding: 0;08. list-style-type: none;09.}10. 11..catArchive h3 {12. font: normal bold 18px sans-serif;13. border-bottom: 1px solid #666;14. margin: 0;15. padding: 0 0 3px 0;16. display: block;17.}18. 19..catArchive li {20. display: block;21. float: left;22. width: 210px;23. margin: 0 30px 30px 0;24.}25. 26..catArchive ul {27. margin: 0;28. padding: 0;29.}30. 31..catArchive li li {32. border-bottom: 1px solid #ddd;33. margin: 0;34. padding: 4px 0;35.}36. 37..catAlt {38. margin-right: 0 !important;39.}Note: Keep in mind that column sizes have been calculated based on the available space (450 pixels) in the default theme’s content area. So, our columns should each be 210 pixels wide, with a 30 pixels spacing between them.
Since the column shifting is done with the help of float, I’ve set the overflow to hidden to stretch the list full height. This can only work with a fixed given container width, which in our case is 450px set on .catArchive.
If your new to “floating”, Sarah has posted a fairly easy to understand article about the float property on BloggingTips.com.
You can download an archive containing both source files: Download.
By now, you should know that I’m a WordPress fan. While most people regard it as a simple blogging platform, some see beyond that and realize that WordPress is a very capable CMS.
While working with it as a website CMS will not allow too many customizations for entry-level developers or users, in the hands of a pro WordPress is ready to perform miracles.
The client is one of Romania’s oldest post-revolutionary hotel – Caro Hotel – and today we’re pleased to announce the official launch of their website.
So, instead of going on and on about the power of WordPress, I invite you to see for yourself what can be achieved. And believe me that this is only a small part of the real deal!
[More]
While working with it as a website CMS will not allow too many customizations for entry-level developers or users, in the hands of a pro WordPress is ready to perform miracles.
The advantages of WordPress powered websites
There are quite a bunch of advantages when developing websites using WordPress as CMS, but the most important are:- Productivity – A lot less time spent on development, which guarantees a lower cost and still high quality;
- Ease of use – Both client-side and developer-side. The amount of tutorials, plugins and support groups available out there is a divine gift;
- Updates – The WordPress community is very involved in keeping the project up to date and bug free and the updates are so easy to apply.
The real deal
If in the past weeks you’ve seen less activity on Blogsessive is mostly because my design studio, QBKL Media has been working on delivering top notch quality for one of its clients that chose WordPress as the platform for their website redesign.The client is one of Romania’s oldest post-revolutionary hotel – Caro Hotel – and today we’re pleased to announce the official launch of their website.
So, instead of going on and on about the power of WordPress, I invite you to see for yourself what can be achieved. And believe me that this is only a small part of the real deal!
Today I’ve received an email that made me think about this subject. Somebody asked me to confirm that a design agency that I’ve never heard of before, has done the design you see on Blogsessive. Obviously, I replied and told him that Blogsessive is a custom design done by yours truly, and any agency (with one exception) that would proud themselves with Blogsessive’s theme would be a fraud.
After hearing the price for which that agency was going to create something similar, the following thoughts started taking shape:
Those who cannot have to relay on the skills of people like me and many others. In this case, there are some things you should base your decision on:
Ask around for quotes on site like Elance, Get a Freelancer or Rent a Coder or simply contact the owners of the blog’s that you like and ask them to recommend you their designer.
The best advice I can give you is: Don’t be fooled!
From my whole experience I can guarantee you that there’s no such thing as a bargain when it comes to a job well done.
We all know that – for example – Darren Rowse’s blog, Problogger.net is an excellent design incorporating so many custom areas, like the Job Board, custom archives, best of zone and so on.
If Darren’s blog is such a hit, then you’d probably want something similar in terms of structure and accessibility (bare in mind the design is not everything and Darren is a great blogger, theme aside). Would you expect to get such a well done job for $300, or $400, or $500? Ask a real pro and the answer will be ‘no’. But then again, there are those people quoting these amounts, claiming they can get the job done.
The good: It fits your current budget.
The bad: Lack of professionalism in communication. Delays in delivery. Lack of attention to details. Bugs, and the list can go on and on.
Some of you would probably say I’m wrong, but consider this. A really well done premium theme sells for $49 to $99. Multiply this with the total sales and see the real price of that really well done design.
Does your traffic and exposure justify a job board? Do you really need so many custom page templates?
Instead of trying to fit everything into a tight budget and probably getting low-quality works, why not fit the custom concept along with the most important features into it. Negotiate.
Let’s say your budget is indeed $500, but a good agency will ask you for $800. Instead of picking the lowest quote, rather extend the deadline. Taking pressure off the agency could result in a lower quote.
Cut down on the features. Will also reduce costs.
I assure you that you blog will grow naturally even without that job board, and when the time is right and the blogging income will allow it, add that too. Take it step by step and don’t cut on the overall quality.
Rather put a smaller budget at work to get real results and build on that, than throwing your money out the window on something that will require constant fixing and attention and in the end, a whole lot of extra money to get done.
This is not the view of a designer. This is what I’ve concluded based on previous experiences, folks coming to me to fix work they previously had done as bargains. It’s not worth it.
[More]
After hearing the price for which that agency was going to create something similar, the following thoughts started taking shape:
- Why would you proud yourself with the work of someone else?
- Why think these things would not surface?
- Why roll out a low-ball quote for something that’s worth much more, or that you cannot deliver, but still state you can.
Do you really need it?
You know my view on this one. I personally like having a unique looking blog, but than again, I’m a happy case. I can do my own designs.Those who cannot have to relay on the skills of people like me and many others. In this case, there are some things you should base your decision on:
- Can your budget afford a custom design?
- Will this design generate profit? (Profit can be either traffic, awareness, money…)
Looking for quotes
If you’ve decided to go ahead with the design, make sure you write down all the things you need. Otherwise, the quotes you’ll receive won’t reflect the reality.Ask around for quotes on site like Elance, Get a Freelancer or Rent a Coder or simply contact the owners of the blog’s that you like and ask them to recommend you their designer.
Choosing the designer/agency
You’ll probably receive quite a bunch of quotes. Some will be very low, some will be too high. The ones that are too high will be pretty easy to identify, but the lower ones can be pretty attractive, considering the restrictive budgets these days.The best advice I can give you is: Don’t be fooled!
From my whole experience I can guarantee you that there’s no such thing as a bargain when it comes to a job well done.
We all know that – for example – Darren Rowse’s blog, Problogger.net is an excellent design incorporating so many custom areas, like the Job Board, custom archives, best of zone and so on.
If Darren’s blog is such a hit, then you’d probably want something similar in terms of structure and accessibility (bare in mind the design is not everything and Darren is a great blogger, theme aside). Would you expect to get such a well done job for $300, or $400, or $500? Ask a real pro and the answer will be ‘no’. But then again, there are those people quoting these amounts, claiming they can get the job done.
The good: It fits your current budget.
The bad: Lack of professionalism in communication. Delays in delivery. Lack of attention to details. Bugs, and the list can go on and on.
Some of you would probably say I’m wrong, but consider this. A really well done premium theme sells for $49 to $99. Multiply this with the total sales and see the real price of that really well done design.
Fitting the project into your budget
Forget the bargain, start the negotiation. At this point you probably don’t even need all the features that Darren (Problogger.net), or Brian (Copyblogger.com), or I have on our blogs.Does your traffic and exposure justify a job board? Do you really need so many custom page templates?
Instead of trying to fit everything into a tight budget and probably getting low-quality works, why not fit the custom concept along with the most important features into it. Negotiate.
Let’s say your budget is indeed $500, but a good agency will ask you for $800. Instead of picking the lowest quote, rather extend the deadline. Taking pressure off the agency could result in a lower quote.
Cut down on the features. Will also reduce costs.
I assure you that you blog will grow naturally even without that job board, and when the time is right and the blogging income will allow it, add that too. Take it step by step and don’t cut on the overall quality.
Rather put a smaller budget at work to get real results and build on that, than throwing your money out the window on something that will require constant fixing and attention and in the end, a whole lot of extra money to get done.
This is not the view of a designer. This is what I’ve concluded based on previous experiences, folks coming to me to fix work they previously had done as bargains. It’s not worth it.
Loving WordPress is SO easy! You got thousands of great looking blogs, custom themes, free themes, premium themes and designers go beyond that by using WordPress as CMS for their non-blog projects. A while back I showed you 10 non-blog websites powered by WordPress, and now it’s time to take a look at 10 more!

Visit ProBar

Visit Krispy Krush

Visit The Salon

Visit Imaginaria Creative

Visit Lyndsey Hamilton Events

Visit IOKON Media

Visit Loja Birds

Visit Bug Interactive

Visit Ville de Falaise

Visit Cow Says Moo
Yes! WordPress is fun. And easy!
[More]
1. ProBar

Visit ProBar
2. Krispy Krush

Visit Krispy Krush
3. The Salon

Visit The Salon
4. Imaginaria Creative

Visit Imaginaria Creative
5. Lyndsey Hamilton Events

Visit Lyndsey Hamilton Events
6. IOKON Media

Visit IOKON Media
7. Loja Birds

Visit Loja Birds
8. Bug Interactive

Visit Bug Interactive
9. Ville de Falaise

Visit Ville de Falaise
10. Cow Says Moo

Visit Cow Says Moo
Yes! WordPress is fun. And easy!











































