WordPress theming – how-to guides and tutorials to a beautiful WordPress theme

We love WordPress for blogs and simple presentation sites. While we prefer Drupal for more complex projects, WordPress is simpler and faster for basic projects as has a friendlier admin interface to boot. On top of that, WordPress has more themes available compared to Drupal themes.

There are many free and affordable WordPress themes available as well as good providers of theming services. But often you want something a bit more customized and unique. If you know some basic HTML and CSS, these guides and tutorials can help you do everything from small modifications to building your own theme from scratch:

Guides and Tutorials

WordPress theming frameworks

Simple Wordpress theme generator – as a starting point

WordPress tutorial videos (theming and others)

  • Share/Bookmark

Drupal theming resources – free themes and paid designs

As we rely more and more on Drupal for our Web projects, theming becomes an increasingly larger part of our development process. Everyone wants a site that looks and feels unique and professional. Luckily, there many resources available for Drupal theming if you don’t have as much time or are on a tighter budget:

Free Drupal Themes

Paid Drupal design themes and services

Coding sources/tools

What are your favorite free Drupal themes?

  • Share/Bookmark

Beautiful graphics done without images: CSS3 and HTML5

I recently came across some beautiful Web graphics done without the use of any images, done purely in HTML 5 and CSS 3. I thought I’d share these little nuggets with you:

The examples work best in HTML5/CSS3 compliant browsers, ideally Safari 5 and Chrome 5, and to a lesser extent in Firefox and Opera. Don’t bother looking at these with Internet Explorer. :)

If you have any more examples of pure CSS, post them in the comments!

  • Share/Bookmark

Performance Tuning Apache Web Server – Enabled Modules

There are many different aspects to tuning Apache. In this post, I will focus on tuning which modules are compiled into Apache and also dynamically enabled. The more modules you have enabled, the more memory Apache will consume and the more processing it needs to perform; try to enable the minimum amount of modules required on your Web server to improve performance and reduce memory consumption:

1) First, list which Apache modules you have enabled on your server:

apache2 -l — this will list all the compiled in modules

a2dismod — this will list all dynamically loaded modules

2) Decide which modules you can disable and disable them:

For the compiled in modules, the list for the compiled modules in Ubuntu’s Apache web server will look something like this:

Compiled in modules:
  core.c
  mod_log_config.c
  mod_logio.c
  prefork.c
  http_core.c
  mod_so.c

These are usually required modules. You may be able to do without these in certain circumstances:

mod_log_config.c — This module is required for logging. If you want to disable logging, you can do without. This is usually not recommended though.
prefork.c — This module is only needed if you use Apache’s prefork mode rather than using threaded workers.

If you determine that you can live without some of these modules, you can choose to recompile Apache without the unnecessary modules.

For the dynamically loaded modules, the output will look something like:

~$ a2dismod
Your choices are: alias auth_basic authn_file authz_default authz_groupfile authz_host
authz_user autoindex cgi dav dav_svn deflate dir env mime negotiation passenger php5
rewrite setenvif ssl status wsgi
Which module(s) do you want to disable (wildcards ok)?

Which modules you require depend strongly on your application. Try to research what each module does and determine if it is required. Once you have determined that a module is not necessary, you can disable it via

sudo a2dismod [module name]
sudo /etc/init.d/apache2 reload

3) Recompile apache with only the needed modules?

Once you have your system narrowed down to the exact list of modules you need, you can gain a bit more performance by compiling them directly into apache rather than loading them dynamically. However, keep in mind that this makes future updating (security updates etc.) much more complex. Usually your time is better spent on other optimizations.

  • Share/Bookmark

MySQL: SELECT not working on TRIM queries – a workaround

We recently noticed that MySQL does not work for WHERE queries with TRIM like:

UPDATE tablename SET column = TRIM(column) WHERE column != TRIM(column)

Technically a query like this is unnecessary, you can just TRIM directly.

But say you wanted to do a SELECT since you need to do something else with those records. This does not work:

SELECT * FROM tablename WHERE column != TRIM(column)

We found an simple workaround for this this MySQL shortcoming. Just use:

SELECT * FROM tablename WHERE CHAR_LENGTH(column) != CHAR_LENGTH( TRIM(column) )

  • Share/Bookmark

CSS Grid Systems (960 gs and blueprint)

CSS Grid Systems have become the latest Web design trend. While controversial among the HTML purists because grids violate the strict separation between content and presentation through the insertion of CSS classes such as class="grid_4", designers big and small are falling in love with them. Grids certainly streamline, simplify and sometimes even inspire the design process.

While there are many grid systems available today, two have attained particular popularity:

And not much time has passed until they were picked up as base themes for our favorite CMS Drupal:

While we prefer to build our own themes from scratch, these base themes are a good starting point for anyone just starting out with grids and Drupal theming. Note, however, that the Ninesixty theme does not appear to be using the latest version of the 960.gs system files.

We are particularly focused on 960 and a couple of very useful tools have been released. The 960 Gridder bookmarklet allows you to overlay a customizable grid over existing Web sites to either study them or assist you in your own development. If you are just starting to lay out your theme, the 960 Layout System allows you to interactively build a layout by nesting different sized container within either 12 or 16 column grid. The resulting layout can then be save as both HTML and CSS for further development in either Drupal or your system of choice.

  • Share/Bookmark

Has your mail server has been blacklisted for spam?

We used a shared host for one of our projects and recently noticed a lot of emails not making it to their intended destinations. It turns out that someone else on our shared host was using it to send spam and, as a result, everyone’s email from that IP address was marked as spam as well.

How can you find out if your mail server has been blacklisted for spamming? Use these tools below:

Spamhaus SBL Blacklist
MX Toolbox Spam Blacklist lookups

Also, if you have your own dedicated server (or rather dedicated IP address, which is a good thing), make sure you get a reverse DNS entry for your IP address from your provider – this helps a lot in avoiding overly aggressive spam filtering since it creates a bit more trust in your IP address and mail server.

Not sure if you have a reverse DNS entry? Use a lookup tool such as this:

Reverse DNS lookup

Happy emailing! Just make sure you follow local and international laws on spamming.

  • Share/Bookmark

SSL Vulnerability

This may be a bit worrisome if you have valuable data to protect online:

HTTPS, SSL attack vector discovered; fix is on the way

A fix is on the way and hopefully this gets resolved quickly before hackers start taking advantage of it. Or maybe they have known about this for a while before security researchers found it? I’ll update this story when the fix has been released.

  • Share/Bookmark

Preventing Web crawlers from accessing your development site with robots.txt

We recently started a development site for a new project.  Soon, we noticed an Amazon AWS instance accessing URLs deep within our site regularly.  The site was access protected (you need to be logged in to see the pages), so those access attempts failed but were annoying nonetheless.

A bit more digging revealed that this was the Alexa bot trying to crawl our site.  I am not sure how they found it so quickly (we have no incoming links and this was a dev.****.*** subdomain) — they probably analyze DNS entries to find sites more efficiently. I also am not sure how they found the deep URLs (they are not exposed to the public part of the dev site), but Alexa was here nonetheless.

This reminded us that it’s a good idea to prevent access to your development sites using a robots.txt file at the root of your domain with the following content:

User-agent: *
Disallow: /

Of course, this will only keep out legitimate web crawlers spidering your site that actually respect the robots.txt file – but at least you have a few less people to worry about.

  • Share/Bookmark

Web templates – the good and the bad

As part of my work, I have looked at various ways to do Web templates. Here is the overview of some and my observations:

RapidWeaver

RapidWeaver has been around for a long time. It’s Mac only and not a bad tool overall. We use it for some of our internal pages that we had to put up quickly. It certainly has some oddities but is overall pretty nice. It comes with a decent number of templates but most of them are uninspired. But at least it’s not very bloated and the HTML is overall fairly clean and works (for the most part) in IE 6. Its templates can be modified with a little effort and new ones created from them. It creates some odd URL structures with its folders though.

Sandvox

Boy is Karelia unlucky. Anyone remember Watson and how Apple came after them with Sherlock? Well, it happened again with Sandvox. Overall it’s a nice tool. Probably the easiest to use of the bunch. I don’t remember how hard the templates were to modify, but it wasn’t as flexible as RapidWeaver for what we wanted, so we had to pass.

Apple iWeb ‘09

Apple’s iWeb is the prettiest of the software tools and has some gorgeous templates. It’s also really flexible in positioning and darn easy to use. Those are the good points. However, templates are limited. If you want to modify them or create new ones, be warned. It’s about as difficult as it gets – down to editing .plist files. It has nice plugins but the add some horrible JavaScript all over your site. The sites also choke a lot in IE 6 (sadly still a popular browser).

Artisteer

Artisteer is a fascinating piece of software. A Windows application that lets you create Wordpress, Joomla and Drupal templates. We use Drupal extensively, so we wanted to give it a try. It’s fairly powerful and allows you to quickly build some pretty fancy designs. However, the code is sometimes a bit bloated (to be expected from an automated tool) and we had some issues with IE 6. As of the day of this post, the design of one of our sites, Ataxi.ro, was inspired by an Artisteer template.

RV Sitebuilder

It’s a f****** piece of ****. A relic of old times, I have nothing good to say about it. Difficult to use, ugly templates, horrid results. Use at your own risk. Of course, that’s just my opinion.

Dream Template

We tried a lot of their templates and were not happy with them. Most templates are completely table based, no <div> to be found. Small modifications break the table layout; flash templates often don’t come with the sources, so they cannot be changed: you can just change the html pages the flash menus point to. Overall we were not satisfied.

Template World

We liked this site better than Dream Template. They still have a lot of table based template, but also a good number of <div>-based ones as well. Flash templates come with sources, so they can be modified fairly well. Still not ideal but the best we found so far for the limited amount of money.

  • Share/Bookmark