WPDesigner

I’m taking a short break and will be back on Wednesday, August 1, 2007. For several reasons, first one is my cousin’s wedding on Saturday (tomorrow). I’ve been helping her with the wedding for the past several days, which explains the recent lack of new content.

Second reason is I just need a break to think things through. I’m very unhappy with how Wpdesigner.com is progressing, with its current design, and with the status of my ebook on how to create a WordPress theme.

Growth-wise, this blog is going to get its first 40,000 uniques month; July will be the highest traffic month. Although that’s a good thing, this blog is nowhere near where I want it to be. My goal is to push Wpdesigner to #1 on Technorati and at least #500 on Alexa, by the end of the year. Yes, those are ambitious goals, but they’re doable so why not?

Content-wise, there’s not enough good topics to write about if I keep sticking to WordPress and WordPress themes. Recently, other than posting WordPress themes, I’ve been struggling to find topics to write about. I need to sit down and reconsider my niche, whether to expand, and where to expand to if that will be the plan.

Design-wise, this blog is a pretty face. Beyond that, I think it’s difficult to use it. For example, the front page has no one specific area that you can immediately focus on. What do you think? Is this blog’s design too complicated? Are the navigations clear enough? Do you use the search form at all?

About the tutorial ebook on how to create a WordPress theme from scratch, I haven’t had anytime to work on it. At this point, I’m thinking about starting from scratch to refocus the book on a lighter version of the Wrath theme, which was based on Sandbox. The reason is I want every would-be reader of my book to develop a strong foundation. And, what better way to do that than to create the tutorial around the structure of a theme based on Sandbox? I’m not going to use Sandbox for this book because Sandbox is a theme for themers or theme authors. It’s not meant for beginners.

Lastly, what would you change about Wpdesigner? I will be reading your comments and suggestions over the weekend and on Monday and Tuesday.

Although CSS galleries showcasing beautiful designs are nothing new, using WordPress to power your CSS gallery is picking up steam. Take CSSRemix.com for example, one of many CSS galleries powered by WordPress, although it would be time consuming to duplicate all of CSSRemix’s features, it isn’t hard imitate the basic structure.

• First, you need know how to use custom fields.
• Second, download Lester Chan’s WP-PostRatings plugin, install, and integrate it. This plugin isn’t necessary, but people like to rate stuff so let them rate.
• Third, decide how many custom field keys and values you’ll use for each featured-site or each entry. For examples: url (key) = http://www.wpdesigner.com (value), url_img (key) = wpdesigner_screenshot.png (value). The amount of custom field keys and values per site or entry equal the amount of work you have cut out for you.

Here’s an example of how to implement the outline above:

After you’ve gotten everything set up, outsource the job of indexing thousands and thousands of beautiful designs. Then, there you’ll have it, a CSS gallery powered by WordPress.

When you think of blog designs, you think of simple, rounded corners with nice little gradient buttons for navigation. This list will show you the other side of blog design and show you where to find design talents.

Capture the Nature

Miasto Fantastyki

Digital Soul

Glassy

Hamburg Wildboys

The Underlying Darkness

This is continually updated guide and checklist for everyone working with the Sandbox theme.

Basic Structure

• div#wrapper [.hfeed]
  • #header
    • h1
    • div#blog-description
  • div#access
    • div.skip-link
    • sandbox_globalnav() [div#menu]
  • div#container
    • div#content
      • div#nav-above [.navigation]
        • div.nav-previous
        • div.nav-next
      • div#post-the_ID() [sandbox_post_class()]
        • h2.entry-title
        • div.entry-date
        • div.entry-content
        • div.entry-meta
          • span.author (.vcard)
          • span.cat-links
          • span.comments-link
      • div#nav-above [.navigation]
        • div.nav-previous
        • div.nav-next
  • div#primary [.sideabar]
    • ul.xoxo
      • li#pages
      • li#categories
      • li#archives
  • div#secondary [.sidebar]
    • ul.xoxo
      • li#search
      • li#rss-links
      • li#meta
  • div#footer
    • span#generator-link
    • span#theme-link

Guide

• Default Stylesheet Typo: Open style.css, change
  span.req-field

  to

  span.required

  .

• Drop-down Links: By default, the style sheet makes the child-page links, for the horizontal menu, display as drop-down links. That does not work in all browsers. Fix it or don’t display child-page links at all. To not display them at all, add
  depth=1

  to

  wp_list_pages()

  within functions.php or use

  display:none;

  in style.css for the subsequent list items.

• Comment on Pages: Allow commenting on certain Pages by adding a custom field. Key =
  comments

  . Value = (any text you want).

• Dynamic Classes: On the front, archive, and search pages, post listing uses
  div.post

  . On Page pages, it uses

  div.page

  .

• Page Heading Selector:
  h2.page-title

  replaces

  h2.entry-title
• Archive Headings: Archive pages use
  H3

  instead of

  H2

  for entry titles.

• Comments Template: Comments [
  div#comments-list

  ] and Trackbacks [

  div#trackbacks-list

  ] are separated. If you want to style for both, use

  div#comments

  .

• Custom CSS: If you aren’t using any of the default Sandbox layouts then remember to remove the CSS import in the default style.css file. For example:
  @import url(’sandbox-layouts/2c-l.css’);

  .

• Containging Floats for Background Image: If you want a background image behind #content, #primary, and #secondary, apply
  clear: both;

  to #footer and use the background image on #wrapper instead of #container. Then, give #wrapper

  overflow: auto;

  .

Templates and Pages to Style and Validate

• 404.php
• archive.php
• archives.php
• attachment.php
• author.php
• category.php
• comments.php
  • no comments
  • logged in
  • must login
  • password protected
• footer.php
• index.php
• links.php
• page.php
• search.php
• sidebar.php
• single.php

If you find any mistake in this guide, please post your correction in the comments.

Download IAMWW w2 DnD

Theme Information

• Author: Will Wilkins
• Description: A black, white, and blue three column theme with double right sidebars.
• License: Creative Commons Attribution 3.0

Comments by Small Potato

I’ve been a sucker for bold, stylish, and clean themes like IAMWW w2 lately. I hope it’s just a phase.

If anything at all, this theme proves that you’ll get my attention if you use a huge post title font size! Although stylish, this isn’t the easiest theme to modify. At least, it won’t be easy for newbies to modify. It’s important to note that IAMWW w2 is based on Upstart Blogger Minim.

The one thing I’d like to see removed or fixed is the inline CSS.

Recently, I used Sandbox to build the Wrath theme.

The first time toying with the Sandbox theme was a challenging, but rewarding experience. From dynamic classes and backward compatibility techniques to negative margins and avoiding bloated markup, I’ve learned a lot.

You might not know this; my skills are self taught. And, I haven’t had time to keep up with the latest techniques and standards so I’m grateful for it when something like Sandbox comes along. For me, it reinforced fundamentals, introduced new techniques (WordPress related), forced me to push CSS possibilities, and allowed me to end up with something up to standards. All of that within one sitting, as you can imagine, I can’t say enough about the Sandbox theme.

Conversely, although now I can see why other theme authors have been pushing for widespread adoption of Sandbox, there’s room for improvement (like all things of course).

For one thing, Sandbox’s horizontal menu does not limit

depth display to 1. If you don’t know what I’m talking about. Imagine a horizontal menu coded for one level of links having to display two or three levels. The Sandbox default style sheet tries to work around the multiple depths display by telling the next level of links to display as drop-down links (only visible on hover).

Sandbox drop-down links are slick, but they can’t solve this problem because the drop-down solution doesn’t work out of the box, not even in Firefox. The problem isn’t whether the default styles for drop-down links matches those of the customized theme or skin. The problem is the drop-down links don’t function or display properly. Some of the drop down links are displayed in Firefox, partially. For Internet Explorer 6, they don’t appear at all.

The temporary solution is to add

, in the

file.

For another example, the reason Wrath is only a theme based on Sandbox rather than a Sandbox skin is because there was no way for me to add the red about box without touching the source codes. This isn’t actually a problem, but it would help future Sandbox skin designers a lot if later versions allow us to add on or modify the source code without having to touch it.

Rather than despite the small room for improvements, Sandbox is a great theme because it has almost everything you need to learn and build upon.

Of course, I will continue working with Sandbox. A Sandbox checklist will be posted soon.

Theme Information

• Author: Small Potato
• Description: Wrath is a red, three-column design, based on the Sandbox theme’s template files (by Andy Skelton and Scott Allan Wallick.)
• Disclosure: This theme comes with three links in the its footer (
  footer.php

  ) to credit WordPress, this blog, and the Sandbox theme, which Wrath was based on. You may keep or remove them.

• License: GPL
• Preview Wrath WordPress Theme
• Download Wrath 0.1

Comments by Small Potato

I’m starting to like Sandbox. Hopefully, I will get to do a more detailed design with many page-to-page variations to display the full potential of Sandbox.

For Wrath, I ran out of ideas for details because it felt right to stop. Without the rounded corners and mini icons, I know it doesn’t feel like a design by yours truly. But, I felt that those characteristics and adding more to it would have cluttered it.

Wrath is simple, sharp, and I painted it bright red, unlike the soft, rounded corners, and dark red of Lust.

This theme marks the fourth release of the Seven Deadly Sins theme series. Check out the previous releases: Lust, Pride, and Greed.

Click on the image below for the full preview.

Like always, details are not there yet. If you haven’t noticed, this design is based on Sandbox’s structure. Initially, I’ll release it as its own theme because I have another use for it. Then, I’ll try to release it as a Sanbox skin, no guarantee.

Wrath is a three-column, sharp, minimalistic, but bold theme. 980 pixels wide, it has a lot of breathing room. I’d love to use it for Wpdesigner, but I’ve given Wpdesigner too many facelifts already in 2007. With that said, I’ll envy any blog that gets to use this theme.

If you’ve commented on this blog, chances are I’ve read and bookmarked your blog. Unlike many millions of bloggers, I don’t use RSS to get content. I go to your site to get it. Most of the times, I’ll skim through the latest posts to find what I would be interested in, to comment.

Am I reading your blog? Here’s my current list of reader blogs:

• Head Set Options
• Meridian Crest
• Shankar Ganesh
• archGFX
• Web Revolutionary
• Clazh (Arpit Jacob)
• Blogosquare
• Bob Meets World
• Paul Enderson
• Upstart Blogger
• Randa Clay
• Telegraphik
• David Airey
• My Blog It
• Scarty
• Geeky Girly Girl
• The So Called Me
• Donalyza.com
• Dezzain Studio
• Deanish
• Kitty’s Corner
• Design Adaptations
• Vandelay Design
• JohnTP.com
• Lorelle.WordPress.com
• Solostream (Michael Pollock)
• WP Themes Plugin (Moses Francis)

If you’re not on that list then it’s because you haven’t updated your blog for a long time. Other than that reason, why aren’t you on my list? I’m always looking for new stuff to read. Drop me a comment. Let me check out your blog.

Use of the color pink is far and few in web design. With Pink October coming up soon, I’ve put together a list of pink inspirations for your future designs and October facelifts.
(more…)

Creating a WordPress theme is easy. Creating a popular theme that gets thousands of downloads is hard. Creating a popular theme, downloaded thousands of times, that can also convince users to stick with it is even harder.

Adding to my post about factors of a popular WordPress theme is a checklist to give your theme a fighting chance.

• Is it a three column theme? Getting more downloads is as easy as converting your two-column theme into a three-column.
• Is it visually stunning? While design is subjective, users don’t preview codes; we preview designs.
• Does it focus on content? A visually stunning theme will always get a second look. But along with that, your design has to focus the attention on the content (usually, the main column).
• Is it generic? Your free theme will not be used by one client. It’ll be used by thousands of clients. It’s very important to keep all features generic. Stay away from hard-coding anything and stay away from too many non-customizable graphics.
• Is it compatible with more than one WordPress version? Believe it or not, not every blog is using the latest WordPress version.
• Are the codes, XHTML and CSS, valid? If your codes are not valid by now, you shouldn’t be releasing public themes.
• Is it compatible with the most popular browsers? Just like you, your theme users want their blogs to look the same across all popular browsers, Firefox and Internet Explorer for examples.
• Is it widget-ready? The widget plugin now comes with WordPress so this is an obvious one. There’s no more reasons to not widgetize your theme.
• Is there a theme options page? Some users like to customize headers and other sorts of tweakable features through the theme options page. If you’re PHP-savvy and know how to do this, it’s a big plus.
• Does the design includes a date button? Date buttons are eye candies. Theme users really love them.
• Does it come with a custom template for archives? Some bloggers prefer to put archive links on their own page, instead of the default sidebar listing.
• Has it been SEOed (search engine optimized)? The default WordPress structure is not search engine friendly. Not every page should have the same H1 title. Sidebar titles shouldn’t nest in H2 tags.
• Is your theme designed around ads? Despite not everyone wants to monetize and integrate ads, almost everyone wants to sleep well at night knowing your theme is easy monetize.
• Do you give theme support? If a user can’t figure out something, that user will come to you. If you don’t offer support for your theme, guess what that person is going to do?
• Where are you releasing your theme? If you’ve just started a blog to release your own WordPress themes on it then you’re not going to get any download at all. Submit your themes to public databases and popular blogs that feature WordPress themes.
• Do you offer previews or live demos? Save your users the trouble of downloading the theme and having to test it first before deciding whether to use it. Allow your users to fully preview your theme or look at a live demo of it.
• Does it come with Small Potato’s emoticons? Most importantly, my human emoticons will ensure huge success for your theme.

Bonus info:

• Get More Exposure for Your WordPress Theme
• Thinks to look for in a WordPress theme
• WordPress Theme Checklist - Part 1
• Check List for WordPress Designers - Part 2
• 11 Principles to Design a Great WordPress Theme

WordPress is moving closer to style (CSS) only themes. I’m starting this continually updated list to anticipate the influx of demand and supply for Sandbox skins as it looks like Sandbox is going to be the default template for later WordPress versions.

It’s important to understand that the following are skins only, not complete WordPress themes. Use the skins below with your Sandbox theme.

• Baws .15
• Black and Blue and Read All Over
• Blackbox
• The Blue Butterfly
• Blueberry
• Blueberry Dreams
• Butterfly
• BlueTop
• Ceruleus
• ChinaRed
• Chocolate Vanilla
• CITYscape
• Crystal Liberty
• Diurnal
• Elegantly Presented
• Essay
• Evening Grass
• Fasionable
• Flowers
• Hourglass
• Jewelry
• LovelyGreen
• Magnolia
• Milkia
• MIX
• Modernistic
• MOM
• Moon Under Uranus
• Moo Point
• One Sweet Theme
• Oranges
• Oriole
• Pagoda
• Picnic
• Ponjong
• Potassium
• Prima
• Promised Land
• Sakeena
• SandBAM
• SandPress
• SAZI
• Scrappr
• Shades of Gray
• Takimata
• Tiffany Blue
• Unsleepable
• Veracity
• Walk In The Shadows
• We Love WordPress
• Wrock It
• X-Greenery