Bill Heron: Gaming in Edinburgh and other RPG stuff
  
  
  
Archives

Building a Community Website

A recent query got me thinking. Over the years I’ve done quite a bit on the website here and on the ORC community website recently, and it has given me a bit of an insight into website creation and the technologies involved.

Most universities allow their societies some web space that they can use to create a web presence, as do some ISPs and some search engines like Yahoo. There’s good news and bad news with this: the good news is that much of the technology and software required (as well as the security) is already taken care of.  The bad news is that you are unlikely to be able to do much other than create HTML pages and upload them via FTP or online. You probably won’t be able to create a lot of fancy bells and whistles for the site but you may not need them. Sites like this usually only need a page of information including a contact email address, and are easy to maintain. Straight HTML pages can be easily created without needing software such as Dreamweaver – software like Kompozer is free and easy to use.

However, there’s a lot more you can do with a website on a server that has PHP and MySQL installed. It is unlikely that you will have access to these on a shared server, such as a university one. To install them takes root/admin access and requires a fair amount of knowledge to maintain. Commercial providers such as Ariotek often provide these as standard, along with a fairly robust support architecture and security. And that’s another point – the more advanced the site, the more you need to make sure that you keep things secure. Create strong passwords when you can: upper and lowercase letters, with numbers and symbols as well. Resist the urge to write them down, or save them in a browser.

Most sites these days use a Content Management System or CMS, and usually requires PHP and MySQL. This provides a basic framework without any specific coding skills and can essentially give you a website off the peg. You will still need to tweak quite a lot of the site and create your content, but the tweaking won’t require a lot of PHP or HTML knowledge in all likelihood. You will need to make sure that the CMS software is patched and kept up to date, as exploits and hacks are discovered.

If you want a simple website, it’s very easy to pick up HTML and create a basic page or pages – it’s only when you want to have something more complicated in mind that it can become tricky.

Here’s a few “case studies” (two require PHP and MySQL), based upon my experiences:

The Nova Games website

Back when I was part of a PBM games partnership, we used MS Publisher 97 to create a very simple website, a group of pages that described our games and who we were. It took a morning and we were live from that point on. We couldn’t do anything fancy like user forums or use a CMS, or anything similar, but at that time we didn’t need much: just a presence on the web.

It is very easy to create HTML pages now: so for a simple site that doesn’t require users to login or generate lots of dynamic content, stick with simple HTML pages. They’re straightforward to maintain and don’t require to much work to create.

The Mandragora website 2.0

The Mandragora website runs in WordPress, a popular open-source CMS, mainly used for blogging, but which can also be used for websites. A large number of plug-ins exist for WordPress – for instance, a plug-in allows publishing to Facebook or Livejournal, another allows you to create a Downloads page. There’s anti-spam plug-ins and other security utilities, some better than others, but all work together rather well. It has an also update facility and has a relatively small size upon a server. The template it uses was designed by a commercial product called Artisteer. I had to tweak a number of WordPress default settings to make it secure, and that’s an ongoing process.

The wiki part of the ORC Edinburgh site uses the same software as Wikipedia, MediaWiki. This also has a number of plug-ins (or extensions as they are known in Mediawki, but I had to lock it down quite considerably as I didn’t want the content edited or vandalised. I also added a few extensions that improved social bookmarking and search engine optimisation, as well as adding a few admin tools.

Access is locked down to a few usernames only as I’m only the one who would make any changes. I could easily create a number of static pages, but they take longer to update individually should I make a change.

ORC Edinburgh – the community website

The ORC website is far more complicated, using Joomla as a CMS. Joomla also uses plugins and modules. As it is a community site theres a number of security tweaks I had to make to keep things secure. Kunena replaced the Fireboard forum module, UddeIM runs the Personal Messaging System, and Community Builder links the lot together in Joomla.  A another module provides a secure CAPTCHA login, and another bridges the authentication to the ORC wiki (Mediawiki again, heavily tweaked).

As it is a community site, it requires a little more flexibility and increased security – the user details have to be kept private, along with their messages. Also, we don’t spammers flooding the forum (Kunena) with their crap, so the registration process needs a secure two-factor process – a captcha image and a confirmation email take care of this (courtesy of Community Builder). We also only want authenticated users to be able to edit the wiki, so I had to use a special module called a bridge to link Joomla and Mediawiki together. Other modules such as the Events calendar or Gallery, enable the registered users to submit events or photos.

At the end of the day, running a CMS website can be hard work. It needs regular patching for security and vulnerabilities, updating of the software components or plug-ins, as well as backups just in case something does go wrong. You can never have too many backups.

Following on from my previous article, I thought I’d give some basic thoughts into how you would build a community website similar to the one used at ORC Edinburgh. Note that it can take some time to build the site, so only advertise it when you’re good and ready.

Installation

Here’s what we’ll need to begin:

  • An FTP client, such as WinSCP.
  • A download of the recent stable version of Joomla (not a development release!). Note: some hosts may provide software like cPanel and Fantastico that simplify this, allowing you to install Joomla with a click.
  • MySQL and PHP5 running on the server that wish to setup the community on
  • FTP logins and MySQL logins for the server – contact your host for these.
  • MySQL database information – again, contact your host for this.

If you’ve got all that, you’ll need to unpack and install Joomla through FTP, if you’re unable to use cPanel or Fantastico. The installation is fairly straightforward and is detailed on the Joomla site. I tend not to use the FTP option in Joomla’s setup.

I suggest you use a strong password: letters (BOTH upper and lower case), numbers and no “proper” words like r00t – preferably at least 10 characters for the admin username.

After deleting the installation directory as required (using your FTP client), login with the admin user at . Now use the Joomla User Manager and rename admin to something different – I would suggest that you don’t your own name: choose a simple yet descriptive name for it. Make sure that you can log back in with this username, and put the site into “Offline for maintenance” for now.

Okay – your basic site is there now you need to think about what modules you’ll need to install.

Adding modules/plug-ins/components

Here’s what I’d recommend if you’re building a site similar to ORC Edinburgh. You can download these from the Joomla Extensions directory at Joomla.org.

  • Kunena forum software  is used for the ORC forums, using the Community Builder (see below) info for profiles and the like.
  • UddeIM allows users to send personal messages to each other – the full premium version is only available if you make a donation – it allows you to send attachments.
  • EventList is the calendar software used to list the ORC Events – the calendar view is an additional download.
  • Community Builder from Joompolis – note that the captcha used on the registration login at ORC requires a subscription from Joomopolis. It also links into Kunena. There’s also an openID facility that allows users to use their Facebook logins to access a site (unused on the ORC site)
  • JPFchat can be used to create a virtual chatroom.
  • Remository can be used for downloads.
  • Mobile Joomla! can also be used to create pages visible via mobile phones and PDA devices.
  • JoomGallery can be used to add image galleries and pictures to your site.
  • TagMeta can be used to create Meta tags for your site content.
  • Xmap can be used to create a sitemap of your site for users and search engines.

I’ve not included the Mediawiki software bridge here as it was a bit of faff to install. There’s also a few plugins that may be of use:

  • Bigshot Google Analytics allows you to embed a Google Analytics ID so that you can profile the site in Google Webmaster Tools.
  • HttpBL checks an IP address against a blacklist from Project Honeypot, and will stop spammers and malicious bots from messing up your site.

Good Practices

  • Don’t use your own name for admin.
  • You can help reduce forum/site spam by either moderating user registrations or using a captcha for registration.
  • Change the admin password regularly.
  • You can set some modules to be for Registered users, e.g. the UddeIM module.
  • Kunena allows you restrict the views of the forum.

Installing WordPress

I thought I’d add another bit, this time about WordPress. I’m talking about the software that you download and install on the server, not a hosted blog on WordPress.org. The following instructions will allow you to create a website that you can also use as a CMS (Content Management Server), not just as a blog.

Installation

You’ll need FTP access and the usernames and passwords for your MySQL database, which I would advise you create beforehand. You will also need a an FTP client such as WinSCP, and program that deals with .zip and .tar files (e.g 7-Zip). Download the WordPress software and un-tar/unzip using Winzip or 7-zip.

Upload the unzipped files to root of your website. By default, WordPress extracts to a “wordpress” folder, so unless you want to have a website that points to , you only want to FTP the contents of the wordpress folder.

Now you’re ready to begin the install. Go to http://yourdomain.co.uk/wp-admin  and begin the install (see the documentation – it’s pretty simple and is detailed here). When asked for a new administrator user, don’t use the default admin one – create a different one – hackers always go for the “admin” username first, and you’re making it easy for them using a default one.

Once the install has completed you’re ready to login and create your first post/page. Again I’m not going to tell you how to use WordPress, but I would advise the following (later I’ll give you a list of suggested plugins):

  • Keep your site off the grid until you have your content ready. In Settings -> Privacy, check the box for ““. You can change this later – it means that most search engines won’t spider your site.
  • Set your comments to be moderated (see Settings -> Discussion): this will help stop you getting spam in your comments.
  • If the site is only for your own use then remove the tick from “anyone can register” tick-box in Settings -> General. otherwise anyone can register and use the site.
  • If you want to use your site as a CMS, you’ll need to create two empty static Pages e.g Home and Blog. Once you’ve done this, go to Settings -> Reading. Select “Front page displays a static page” and choose the Home Page you created previously for the Front Page: this will be the first page that anyone going to will see. For the second “Posts” pages, select the Blog Page you created previously. You may also want to edit the Home page to put in some content at this stage.
  • It’s also worth reading the following blog article on ways to improve security for your WordPress install. Some of these like SSL can’t easily implemented without your hosts help. More recent versions of WordPress have better security and have some of these implemented; also by choosing a different “admin” username you’ve already implemented one of their suggestions.

A list of useful Plugins

A lot of plugins are available for WordPress. Some are useful, some are a dead loss. Here’s some I recommend – those marked with an * require a little bit of configuration and I wouldn’t recommend them for those new to web publishing. Those plugins marked in green are ones that I would definitely install!

  • html on PAGES: Adds .html to pages.
  • AddToAny: Share/Bookmark/Email Button: Help people share, bookmark, and email your posts & pages using any service, such as Facebook, Twitter, Google Buzz, Digg and many more.
  • Akismet: Akismet checks your comments against the Akismet web service to see if they look like spam or not. You need an API key to use it. You can review the spam it catches under “Comments.” To show off your Akismet stats just put <?php akismet_counter(); ?> in your template.
  • Amazon Product In a Post Plugin:* Quickly add a formatted Amazon Product (image, pricing and buy button, etc.) to a post by using just the Amazon product ASIN (ISBN-10). Great for writing product reviews or descriptions to help monetize your posts and add content that is relevant to your site. You can also customize the styles for the product data. Remember to add your Amazon Affiliate ID on the options page or all sales credit will go to the plugin creator by default.
  • Amazon Widgets Shortcodes:* Easy management of Amazon Links & Widgets on your blog. Preserve your post consistency, use copy/paste Amazon code or build your links with an easy to use interface.
  • Anthologize: Use the power of WordPress to transform your content into a book.
  • Auto XFN-ify: This Plugin automatically adda XFN rel attributes to links (based on the XFN data stored for links in your blogroll admin section) in all posts which link to someone in your blogroll. This way you don’t have to add them manualy each time you link to someone, and as you update/add/remove links and XFN data in your wp-admin blogroll area, all links on your site are automatically updated with appropriate XFN attributes. The plug can optional (when theme supported) include XFN icons next to links in your posts.
  • Bad Behavior: Deny automated spambots access to your PHP-based Web site.
  • Block Bad Queries (BBQ)
  • Broken Link Checker: Checks your blog for broken links and missing images and notifies you on the dashboard if any are found.
  • Categories to Tags Converter Importer: Convert existing categories to tags or tags to categories, selectively.
  • Events: Enables you to show a list of events with a static countdown to date. Sidebar widget and page template options.
  • Fast Secure Contact Form: Fast Secure Contact Form for WordPress. The contact form lets your visitors send you a quick E-mail message. Blocks all common spammer tactics. Spam is no longer a problem. Includes a CAPTCHA and Akismet support. Does not require JavaScript.
  • Fotobook: Fotobook allows you to import Facebook photo galleries directly into WordPress.
  • GeoURL: GeoURL plugin allows you to configure your real-world location in order to find other websites nearby to you.
  • Google Integration Toolkit: Integrate Google services (Analytics, Webmaster Tools, etc.) with Your Blog.
  • Google XML Sitemaps: This plugin will generate a special XML sitemap which will help search engines like Google, Yahoo, Bing and Ask.com to better index your blog.
  • HTML Page Sitemap: HTML Page Sitemap Adds an HTML (Not XML) sitemap of your blog pages (not posts) by entering a shortcode. A plugin from Plugins: The WordPress Plugins Podcast.
  • Link Library:* Display links on pages with a variety of options.
  • LiveJournal Crossposter Remix: Automatically copies all posts to a LiveJournal or other LiveJournal-based blog (exclude text in shortcode [nocrosspost]smth[/nocrosspost] – buttons for it added in visual&html editors). Editing or deleting a post will be replicated as well.
  • Meta SEO Pack: Fine tune your WordPress blog for SEO: title rewriting, meta descriptions, tags, robots, canonical links and more. Out-of-the-box settings are a good starting point for blogs.
  • No More Frames: Many web sites try to load your content into their own frame, to help sell ads on their sites. This simple plugin ensure your site is protect from this using a simple piece of code in your document header.
  • Print Friendly & PDF: Adds a Print Friendly & PDF button for your pages. Help your users save paper and ink, and engage with your content.
  • Search Everything: Adds search functionality without modifying any template pages: Activate, Configure and Search. Options Include: search highlight, search pages, excerpts, attachments, drafts, comments, tags and custom fields (metadata). Also offers the ability to exclude specific pages and posts. Does not search password-protected content.
  • SI CAPTCHA Anti-Spam: Adds CAPTCHA anti-spam methods to WordPress on the comment form, registration form, login, or all. This prevents spam from automated bots. Also is WPMU and BuddyPress compatible.
  • Simple Tags: Extended Tagging for WordPress 3.0 ! Suggested Tags, Mass edit tags, Autocompletion, Tag Cloud Widgets, Related Posts, Related Tags, etc!
  • StatPress Reloaded: Improved real time stats for your blog.
  • TinyMCE Advanced: Enables advanced features and plugins in TinyMCE, the visual editor in WordPress.
  • Wordbooker: Provides integration between your blog and your Facebook account. Navigate to Settings ? Wordbooker for configuration.
  • WP-Click-Tracker: Tracks all links in posts.
  • WP-Filebase: A powerful download manager supporting file categories, thumbnails, traffic/bit rate limits and more.
  • WP-Optimize: This plugin helps you to keep your database clean by removing post revisions and spams in a blaze. allows you to rename your admin name also. Additionally it allows you to run optimize command on your wordpress core tables (use with caution).
  • WP-RSSImport: Import and display Feeds in your blog, use the function RSSImport(), a Widget or Shortcode.
  • WP Existing Tags: This simple plugin adds a list of existing (already used) tags into “Tags” box on new/edit post form. No more hard time remembering your hundreds of tags – simply click the one you need to add it to the post. No tuning and customizing needed – it just works as it is.
  • WP Maintenance Mode: The plugin adds a splash page to your blog that lets visitors know your blog is down for maintenance. Logged in users get full access to the blog including the front-end, depends of the settings.
  • WP Section Index: WP Section Index detects the various sections of a page or blog post, based on headings, and creates a widgetized list for navigating the content.
  • WP Security Scan: Perform security scan of WordPress installation.
  • WP Super Cache*: Very fast caching plugin for WordPress.
  • WPtouch: A plugin which formats your site with a mobile theme for visitors on Apple iPhone / iPod touch, Google Android, Blackberry Storm and Torch, Palm Pre and other touch-based smartphones.
  • WP Widget Cache: Cache the output of your blog widgets. Usually it will significantly reduce the sql queries to your database and speed up your site.
  • Yet Another Related Posts Plugin: Returns a list of related entries based on a unique algorithm for display on your blog and RSS feeds. A templating feature allows customization of the display.
Bill on Twitter