On a previous post, I had recommended using creating a blog on wordpress.com to avoid the myriad of technical issues of getting a blog running. However, as the last point in that article, I suggested that the next step was to “move your content to your own hosted domain”. I’ve now encountered a series of friends who are technically competent, but I’ve got the benefit of experience with web design considerations where they “don’t know what they don’t know”. Thus, while I’m installing their web sites — I’m doing three at the same time — I’ll document my steps here.
If you’re uncomfortable with transferring files via FTP, you might as well stop reading now. These instructions are for web sites hosted on site5.com, but they should be pretty close for any provider that offers Fantastico and cPanel.
A. Some web site steps leading up to installing WordPress
(1) At your domain name registrar — I use DomainsMadeEasy — you need to set the DNS (domain name servers) to point to your web host. The changes to access yourdomain.com can take minutes or hours.
(2) We need to set up some e-mail accounts on your web site. From cPanel (called SiteAdmin on site5.com),
- (a) create an administration userid of yourdomain@yourdomain.com . This is the one from which automated e-mail will come, e.g. to people who subscribe to your blog. (The conventional webmaster@yourdomain.com attracts spam, so it’s an address worth avoiding). You could also create more e-mail addresses if you want to learn about Spam Assassin, but it’s so much easier to let professionals (e.g. Gmail) handle that.
- To be thorough, you really should set up an e-mail client (e.g. in Thunderbird or Outlook) to periodically check the mailbox. Incoming mail will otherwise just sit there. I don’t receive a message more than once per month on this administration e-mail account.
- If you’re on site5.com, there’s an e-mail configuration guide, with specific directions for configuring Thunderbird and configuring Outlook. Your incoming POP or IMAP e-mail server is mail.yourdomain.com . Your outgoing mailserver is also mail.yourdomain.com . More detailed instructions suggest that you replace the “at-sign” with a “plus-sign” in the userid (i.e. instead of yourdomain@yourdomain.com, use yourdomain+yourdomain.com). This is a quirk that is sometimes used for anti-spam reasons.
- To be thorough, you really should set up an e-mail client (e.g. in Thunderbird or Outlook) to periodically check the mailbox. Incoming mail will otherwise just sit there. I don’t receive a message more than once per month on this administration e-mail account.
- (b) create some forwarding e-mail addresses to your regular e-mail address. These could be yourfirstname@yourdomain.com , or yourinitials@yourdomain.com … or anything easily memorable for your friends. While you’re doing this, if you have e-mail to SMS text messaging available to mobile phone (e.g. 4165551212@txt.bell.ca for Bell Mobility, or 4165551212@pcs.rogers.com for Rogers Wireless), you can create a userid called mobile@yourdomain.com .
- (i) You can set up a “custom from address” on Gmail, so that it looks like you’re sending and receiving e-mail from yourfirstname@yourdomain.com , while taking advantage of Gmail’s spam-fighting.
- (ii) If you enable POP on Gmail, you can configure your e-mail client (e.g. Thunderbird) to send and receive e-mail offline.
(3) Further down these instructions, you’ll need to be able to transfer files via FTP to your web site. When your web host set up your account, you should have received an FTP account and password. You’ll need that, and a file transfer program (e.g. Filezilla) in a few minutes.
B. Install WordPress
(4) Using Fantastico — on site5 SiteAdmin, it’s under “CGI & PHP scripts — it’s theoretically a one-button install. Select the “new installation” link.
- (a) Install in new directory called “blog”. This will save you some day in the future, when you need the root directory for something else.
- (b) Admin access: use your firstnamelastname, or the yourdomain or your favorite administration userid. (It’s a good practice to separate out your roles as WordPress administrator from WordPress editor/author … although I’m not sure that I’ve ever needed that distinction!)
- (c) Admin nickname and e-mail: Use yourdomain and yourdomain@yourdomain.com , that you set up above.
- (d) The site name and description can be changed in WordPress, after it’s installed.
- (e) The e-mail account configuration should also be yourdomain@yourdomain.com , as you had previously set up.
(5) Since you’ve now set up a blog that isn’t in the root directory, you’ll need to redirect people who type in yourdomain.com to yourdomain.com/blog .
- (a) In Notepad (or any text editor), create a file called htaccess — that’s a filename without an extension — and copy in the following code:
RewriteEngine on
RewriteRule ^$ /blog [L,QSA]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ /blog/$1 [L,QSA] - (b) With a file transfer program (e.g. Filezilla), access your web site. There may already be a file named .htaccess in the root directory, but it’s probably empty and can be deleted. Upload htaccess into the root directory of your web site. Then, rename the website to .htaccess (which is no file name, and all extension).
If you type in yourdomain.com , you should now be redirected to yourdomain.com/blog , and see the “Hello World” installation.
(6) Go to yourdomain/blog/wp-admin and login with your administration userid (i.e. firstnamelastname or yourdomain) to reach the administration screens.
C. Select and upload some themes
I despise the default “Kubrick” theme — and it makes you look like a newbie — so I’ll suggest immediately changing the look of your blog. (This is all form, not content).
(7) Picking a theme is pretty big challenge, and rather personal. There’s searchable version at themes.wordpress.net— make your choices and select “all” to reduce the list — or look at the competition run at alexking.org (possibly downlevel at WordPress 1.5). Selection of a theme should consider:
- (a) Active community development: Some themes were designed for WordPress v1.5, and haven’t been kept up for v2. You’ll be really annoyed when something breaks on the next upgrade!
- (b) Two-column or three column: I prefer three-column themes, with the two navigation columns on the right. This is almost impossible to find, which is why I’ve had to customize my own theme (which actually still has bugs in it).
- I strongly advocate the navigation bar(s) on the right, in the case that some reads your blog from a mobile browser (e.g. a PDA or phone). The content then shows up first, which is less annoying when reading multiple posts.
- (c) Photograph at the the top, or just imagery: The latter makes it easy to change themes, but a photograph makes your web site really personal. You can get a digital photograph from Flickr — choose one with a “by attribution” license — and crop it to your needs. (It’s somewhat tough to get an image that’s wide and shallow. I use Irfanview for quick rotation and resizing).
- (d) Widget-friendly: This is a new drag-and-drop feature for WordPress 2, which I don’t use … but it may make things easier for you.
- (e) Width readable within 800px: Some themes are 1024px in width, making readability within a browser difficult.
When you become overwhelmed by choice, you might revert to one of the themes that I’ve previously used:
- Regulus is a 2-column theme that is actually available with WordPress.com installations — which means that it’s sufficiently popular to be updated, with the downside of appearing similar on many blogs.
- Connections Reloaded is an extensive rewrite of a popular 2-column theme for WordPress v1.5, and is actively maintained. There are navigation links at the top of the page. These need to be modified (since the instructions above installed in the “blog” directory instead of the root).
- Relaxation 3-column was the original 3-column theme on the coevolving.com web site. It’s been developed by single person, but has a lot of new features. The three columns can be arranged in different patterns. In the starter kit, there are 53 different styles included, so it’s easy to immediately have a distinct look while you’re searching for your own image.
- Subtle (originally Glued Ideas Subtle) is a theme that is worth watching. The widget support became broken in the upgrade to WordPress 2.2, but such problems are likely to be resolved rather soon.
(8) Download the theme, and install it by FTPing the unzipped directory to /public_html/blog/wp-content/themes . (If in doubt, download a few and try them out. You can always just delete them from the web host later).
(9) Login to your blog at yourdomain.com/blog/wp-admin . Upon authentication, you should see the Dashboard page.
D. Activate a style, and set up the basic look
Changing the style isn’t the most important thing, but it gives immediate gratification. My comments will give details on Relaxation 3-column, because it’s got a lot of features.
(10) Surf over to Presentation … Themes … and select from the Available Themes.
- (a) At Presentation … Theme Setup …, you have a lot of choices. In Relaxation 3-column,
- … the Basics page options will be over-written when we use widgets (below).
- … Style Setup lets you choose an image, with coordinated colors for the text and backgrounds. Pick just one, or else the image will change each time a person comes to your blog (diluting your imaging).
- (b) At Presentation … Widgets …, drag-and-drop from the available blocks at the bottom of the page. As a suggestion for Relaxation 3-column,
- Drop Text1 into the left sidebar. Select the icon on Text1, making the header “Welcome to yourdomain.com”. To indent the body, you can make the content an unordered list. This is a good place for link to your “about” page.
- Good widgets for the left sidebar include: Recent Posts (show 15), Recent Comments (show 15), Calendar, and Links, and Meta.
- Good widgets for the right sidebar include: Search, and Categories (display as drop-down). Save the changes.
E. Set Options
These are key settings that should probably be done before you start blogging.
(11) On Options … General …, you can revise the Weblog title and the Tagline. (Strangely enough, these don’t appear on on Relaxation 3-column, which is an exception).
- On Membership … check Anyone can register. This enables readers who leave comments frequently on your web site to create a userid at yourdomain/blog/wp-register.php .
- Set the Time in the weblog (e.g. Eastern Time is -5 from UTC). If you like, you can set the calendar weeks to start on Sunday.
(12) On Options … Writing …, you can increase the default size of the post box to 15, if you later find the editing window too small. Under Update Services, you may want to add http://rpc.technorati.com/rpc/ping (which is the Google of blogs).
(13) On Options … Reading …, increase the number of blog pages and syndication posts to 18. For each article, Show Full Text. (It’s annoying to only show summaries).
(14) On Options … Discussion …, everything is checked off except An administrator must always approve the comment, because once someone has posted once, you can trust him or her.
(15) On Options … Permalinks…, select and change the Common Options to /index.php/archive/%postname%/ . There’s some controversy about this, but you really don’t need a date in your post URLs. You can also change the Category Base to /index.php/category .
E. Create a user persona as editor
If you separate your administration persona from your author/editor persona, your notifications will come to different places.
(16) At Users… Authors and Users… scroll to the bottom of the page and create a userid (e.g. firstname) with your primary e-mail address (e.g. firstname@yourdomain.com), your website as http://yourdomain.com, and a role of editor.
F. Install plugins
These add to the functionality of the blog. Here’s some helpful ones, from my experience. You’ll find these under Plugins … Plugins … after they’ve been uploaded by FTP to /public_html/blog/wp-content/plugins , and can then activate them.
(17) Akismet, as of WordPress 2.2, comes with the installation. It catches spam in your comments, and you’ll need that. Really. After you activate Akismet, there Plugins … Akismet Configuration … will show up. You’ll need to sign up for an API-key (for free from wordpress.com), and fill it in.
(18) Full Text Feed corrects an annoying feature introduced in WordPress 2.1 to only provide summarized feeds. This really frustrates people who use feed readers (like me!)
(19) WP-Shortstat provides you with statistics to know what pages are being viewed, and which search terms are used to come to your site.
(20) Live Comment Preview allows visitors to see formatting mistakes in their typing, before they commit their comments.
- Unfortunately, on the Relaxation 3-column theme, Live Comment Preview doesn’t seem to work. On the other hand, it doesn’t seem to do any damage.
(21) WordPress Database Backup is helpful if you don’t trust your hosting provider, or ever need to move your web site.
(22) Ultimate Tag Warrior enables tags for you blog entries (as more multidimensional than categories). I don’t know why they still include the legacy 1.0 version in the download package.
(23) Subscribe2 sends out e-mail alerts when your create a new post. (It can be configured to send out digests if you do multiple posts in one day, but that requires setting up a cron). This one is tricky to set up, so refer to the readme.txt in the download package. On Options … Subscribe2 … set Auto Subscribe to “Display Option on Registration Page” and to receive as HTML. At Manage … Subscribers … is the e-mail list. The readme.txt specifies creating a new page, and the subscribe2.php file has to be edited with that page number. That page should be added as a Text widget on Presentation … Widgets …
- I’ve been using the E-mail Notification Plugin, which set notifications on and off with every post. The disadvantage of this plugin is that it has to be manually coded into the style sheet sidebar, rather exploiting existing code in WordPress profiles. One quirk in its installation is that the requirement of the database password, which is set by Fantastico, but is located in wp-config.php.
(24) I would like to use the Post Teaser plugin — or alternatively, Evermore — to shorten the blog posts on the main page, but they don’t Post Teaser doesn’t seem to be working under WordPress 2.2.
- Edit 2007/07/11: An unexpected PHP message that I thought was coming from Evermore has disappeared, so Evermore does seem to be working.
In the meantime, - Edit 2007/08/18: WeyHan Ng has taken on a role of maintainer for Post Teaser with a new version v3.8 that now works.
- On Options … Post Teaser … “If the post is made into a teaser, I want the message to be in the following format:” … I use:
<a href="%permalink%" title="Permanent Link: %plain_title%" rel="bookmark">Read more ... (%word_image_count%, estimated %reading_time% reading time)</a>
… and “If the post is displayed in full, I want the message to be in the following format:” … I substitute:
<a href="%permalink%" title="Permanent Link: %plain_title%" rel="bookmark">Permanent link to this post</a> (%word_image_count%, estimated %reading_time% reading time)
- On Options … Post Teaser … “If the post is made into a teaser, I want the message to be in the following format:” … I use:
- Alternatively, manual use of the “more” formatter — currently the third icon from the right on the Write Post … Visual … menu bar — makes reading easier.
G. Edit the Blogroll and “Hello World” post
(25) Log out of the administrator’s userid, and login as an editor (i.e. userid firstname), to modify the initial content. This should now put you well onto the path for blogging. For more clues, Getting Started withWordpress — halfway down the long page — may be helpful.
That’s the basic configuration. After you’ve got some content written, you might go back and replace the standard theme top photograph with one more carefully selected.
If you can do all of the above, you may tackle installing Gallery for your digital photographs, and then the WPG2 WordPress Gallery 2 Integration plugin to show random images.
Addendum 1 (2007/07/09): I’ve explained Customizing Gallery 2, uploading with Gallery Remote as a first step towards WordPress Gallery 2 integration.
Addendum 2 (2007/07/09): I’ve made minor modifications to the style sheet of Relaxation 3-column, for to improve usability. Editing style.css …
- To make the active links stand out more in the posts, I changed the greyish
color: #617E8E;
… to a brighter blue with …
color: #0033FF;
in a global search-and-replace. - To make the active links stand out in the sidebars, I changed
#sidebar a {
color: #444433;
}
#sidebar2 a {
color: #444433;
}
… to …
#sidebar li a {
color: #0033FF;
}
#sidebar2 li a {
color: #0033FF;
}
since the links in the sidebar are actually in list items. - Finally, to make each sidebar item stand out as a separate list item, I changed
#sidebar ul {
list-style-type: none;
margin: 0 0 0 10px;
padding: 0;
}
#sidebar2 ul {
list-style-type: none;
margin: 0 0 0 10px;
padding: 0;
}
… to remove the list styling as …
#sidebar ul {
margin: 0 0 0 10px;
padding: 0;
}#sidebar2 ul {
margin: 0 0 0 10px;
padding: 0;
}
so that bullets appear with each item.
These are easy and minor changes for web site owners who know Cascading Style Sheets.