September 13, 2005

Web design and administration with WordPress

Author: Kris Shaffer

Recently, a colleague and I decided to create a Web site that would serve as an online community and resource for young musicians. Though I had some Web design experience, neither of us had the experience or knowledge to create all of the features that we wanted in our site. Luckily, we were able to turn to WordPress. With its tools we could combine static pages with dynamically updated pages, categorize site content, automate formatting of site data, manage site membership accounts, incorporate RSS feeds and podcasts, and allow for community discussion of the site's content. Best of all, we could accomplish all of this with relatively little setup effort, and once the site was up and running, we could focus almost exclusively on content and let WordPress do the rest.

As NewsForge's review earlier this year demonstrates, WordPress is easy to set up, customize, and use, making an attractive and functional blog well within the grasp of any knowledgeable user. WordPress also boasts an extensive library of plugins, which greatly extend its functionality. In this article, I will demonstrate how we extended WordPress's blog functionality, and with a few PHP tweaks of our own, quickly built a site that is feature-rich and simple to maintain.

Our experience leads me to conclude that WordPress isn't up to building a large company or organization's site. But if you maintain a personal Web site, an educational or topical site, or one for a school, church, or other small organization, using WordPress to generate all or part of your site may help you increase your feature load while reducing your workload.

Setup and initial customization

WordPress has impeccable setup and installation instructions on their site, and they cover every detail of the installation process, including the setup of your MySQL database, accurately and clearly. But before you start, think about the organization of your site. Your site's WordPress's front page, index.php, will give your reader an aggregate of the latest content added to the site, built within your site's theme. When someone enters your site's URL, is that where you want them to be directed? If your site's most important function is to serve up news articles, announcements of upcoming events, or regularly added podcasts or photo galleries, you probably want this to be your main page. However, if you want a static home page to load every time someone visits your site, you probably want to install WordPress in a subdomain or a subfolder of your site, and link to its content from your front page.

Once you've installed WordPress where you want it and have set up your admin account, download some themes. I recommend downloading every theme that contains an element you like and uploading them to your server. By cutting and pasting elements from one theme to another, you can customize themes easily without any knowledge of PHP (though knowledge of HTML can help you filter through the code more easily). Or, if you know PHP, you can make more detailed customizations or design your own theme.

For example, the theme that we settled on for our site -- Wuhan -- contained a number of sidebar elements that we did not need. Because of the nature of our site and audience, we felt that there would be little need for visitors to find articles by date. So, in Wuhan's sidebar.php file, we deleted the section of code for the calendar (the list item containing <?php get_calendar(2); ?>) and moved the code for the monthly archives (the list item containing <?php _e('News Archives'); ?>) down so that post categories (the list item containing <?php _e('Categories'); ?>) were on the top of the sidebar, followed by monthly archives and links.

Initially, we also wanted to have a list of links to our site's static pages in the sidebar, but this was not included in the Wuhan theme (or several others we looked at). So we created a new list item in the Wuhan sidebar with the same syntax as the other items (again, if you know HTML but not PHP, knowing what code to copy is still reasonably straightforward), and inserted the "pages" element from the sidebar of the theme Fast Track.

Other stylistic customizations are even easier. Replacing header images is as easy as uploading the new image (with the same dimensions and file format) to your theme's "images" directory. And each theme contains just two stylesheets that govern the entire site, one for standards-compliant browsers and one for Internet Explorer. Make your change in both of these files, and every static or dynamic page on your site will follow.

Key features and plugins for site design

Though the themes are great, the real power comes from the WordPress application itself and its plugins. For instance, you can set aside a directory on your site for user file uploads from the WordPress admin panel. WordPress can limit the size and types of files allowed in this directory, and you can designate a minimum user level allowed to upload files. This way, you can allow other contributors to your site to upload images or media clips to include in their posts or share with your site's user community, without giving them an FTP account.

There are also a number of admin tool plugins. Some of these change or add functionality to the WordPress admin user interface. Others include tools for moving your site (to another host server, or simply to another location on your site), backing up your MySQL database, and even mirroring the whole site on a local machine, allowing you both to protect your data and to create an arena for testing and perfecting new themes and features before making significant changes to your site.

WordPress also has many tools to help create and disseminate your site's content. WordPress supports a combination of static and dynamically created pages. On our site, the principal content is the articles, podcasts, and composer features, which are continually being added; but we also incorporated several static pages with technical information about the site, information about the site and editors, and opportunities for people to contribute. All of these are linked from the front page, just as the post categories are. You can create both the posts and the static pages from within WordPress's user interface, which allows plain text editing and is HTML-tag ready. There are editing plugins, though, which enhance post formatting. For example, there are a couple plugins that give WordPress a WYSIWYG interface. You can also find plugins that automatically insert hyperlinks for URLs, substitute predefined texts and links for certain pre-defined acronyms, check spelling in posts and/or comments, obfuscate email addresses in the posts, and do many other helpful things. There are even image plugins that will consolidate a group of uploaded photos into a gallery, which it inserts into your post. It's all intended to let you focus more on content than on presentation or administration.

WordPress can stream RSS feeds from other sites into your posts, via one of several syndication plugins. If you run a topic-oriented site and often link to articles of interest on other sites, this can help smooth the process. Or you can create a site -- or a portion of a site -- solely dedicated to aggregating relevant feeds from the Web.

And of course, WordPress automatically creates RSS and Atom feeds for your own site, site comments, and every post category. On our site, we incorporated a WordPress iCalendar event plugin that takes posts from our "calendar" category and create an online, subscribable iCalendar file. With this plugin, multiple administrators can maintain a community calendar without having a WEBDAV-enabled server. By entering posts in this category and specifying time and location information, any user with posting privileges can edit the community calendar, which will be automatically synched onto users' computers or even PDAs.

WordPress is also capable of managing one or more podcasts, which is a valuable feature for our music-oriented site. We have found the WP-iPodCatter plugin to be especially valuable. This plugin not only automates the creation of an RSS-based podcast feed with proper enclosure tags, but it also automatically generates the extra tags used by Apple's iTunes. You enter most settings only once in the plugin's options menu. Then you simply create a post for the podcast, enter the duration and server path of the audio clip, and publish the post to your podcast category (and any other categories you choose). There is one caveat: if you do not enter the duration or path correctly, your feed will return an error message, and no subscriber will be able to find any of your podcasts. If this happens, just edit the post and fix the error, and your feed will be back to normal. But it's a good idea to double-check your feed after creating a new post, at least for the first few times until you get the hang of it. The last thing you want is users deleting your broken podcast from their subscriptions before you even know there's a problem.

WordPress also has substantial tools for site membership and for dealing with multiple maintenance personnel. With WordPress, there is one administrator, but any number of users can be granted administration privileges. These privileges -- in addition to various levels of site editing like creating and editing posts, comments, and static pages -- include creation and management of lower-level users, moderation of posts and/or comments by visitors and other members, and other tasks. There are several WordPress restriction plugins designed specifically to extend this feature, giving the chief administrator many options in assigning permissions to members and visitors. Because all of this takes place withing the WordPress framework, high-level members can be allowed a good deal of control over site content without being granted FTP access. For our site, this will be a good feature to grow into, as in the future, my colleague and I will be granting content creation and editing permissions to new editors and regular contributors, but wish to remain solely in control of the server configuration and filesystem.

Conclusion

WordPress is a powerful tool, and in many ways exemplifies open source at its best. It gives any user an array of features with minimal technical effort, and its extensibility and versatility are displayed by the large pool of user-designed plugins. This power and versatility extends beyond WordPress's traditional use of blogging into more traditional Web design, and -- as our new AmSteg.org site displays -- makes WordPress a powerful tool for many kinds of Web sites. Our site would not have many of the features it has, nor would it be as easy to administer, if it were not for WordPress and its plugins.

Kris Shaffer is pursuing a Ph.D. in music theory at Yale University. He has written for Linux.com, NewsForge.com, OSNews.com, and Linux Journal. Shaffer is also co-founder of www.AmSteg.org, an online community for composers and music theorists which is making its debut this fall.

Category:

  • Web Development
Click Here!