Their new site hosted at RedDevils.co.nz

What we suggested was for them to use the hosted WordPress.com service. This is not the regular self-hosted solution that you can download from WordPress.org, but the hosted system which allows you to create your own blog/site within minutes. We have suggested this previously to those who can’t afford a more traditional solution, but have found it an uphill battle convincing people that WordPress.com can indeed meet their needs in exactly the same way a self-hosted solution would.

Misconceptions about WordPress.com powered sites

Traditionally WordPress.com has only been suggested as a low-budget option for those who can’t afford to upgrade to “proper” hosted setup, however for the Red Devils, we were able to meet all of their requirements without losing anything that they required in their site. We were also able to integrate their teams branding into an existing theme very quickly through some simple CSS upgrades.

The following is a common comment we receive from potential clients when suggesting using WordPress.com for their site.

But you can’t upload themes to WordPress.com and we need our own design

However, despite this, we had no trouble at all in redesigning a WordPress.com site for the Red Devils which suited their needs perfectly by using the “CSS upgrade” option. This costs a mere US$15 and allows you to totally modify the sites CSS. This gives huge power over how the site looks and behaves. We were able to use this to add a new background image, totally change the text colours, remove all remnants of the commenting feature of WordPress (even when comments are disabled their are still occasional bits of text mentioning the comments feature).

The custom CSS upgrade information as found on WordPress.com

The following is another common comment we receive on suggesting clients use WordPress.com to power their site.

No, I must have my own domain for branding purposes!

This is also a fallacy as there is a “domain upgrade” option available for another US$10. All you need to do is to point your domain at the WordPress.com name servers, purchase the upgrade, add the new domain to your list of domains and it will automatically start working and all your own URLs will redirect to the new one automagically. Apart from the small unobtrusive link back to WordPress.com in your footer, no one will have a clue that you are using the WordPress.com service.

The domain upgrade information as seen on WordPress.com

And last, but not least, the following is another common comment we receive on suggesting clients use WordPress.com over a self-hosted solution.

But I don’t want a blog, I want a website!

Ignoring the obvious fact that a blog is actually a website, it is entirely possible to make a Wordpress.com “blog” look and behave in a very “non-bloggy” way. You can either ditch the blog functionality entirely and go for an entirely static site, or you can use the method we used for the Red Devils site by removing all mentions of “blog”, turning off commenting and stripping out any errant text which may appear in the site related to the commenting functionality, blog categories etc. This gives a simple list of news items on the front page to ensure that their site visitors see the most important/current content first up. They even use the sticky post feature of WordPress to ensure that news items they want to ensure readers see first are always at the top of the home page.

What other upgrades are available

There are a suite of different upgrades available for those who need them. The Red Devils did not require anything extra, but depending on your requirements you may find some of the other options useful, in particular the ability to remove the occasional advertising which WordPress.com serves to your sites visitors.

The various upgrades available for WordPress.com

Maintenance

The beauty of using WordPress.com, is that not only does it cost almost nothing to setup (US$25 for the CSS and domain name upgrades), but you don’t need to bother maintaining a WordPress installation since they handle everything for you. You also don’t need to worry about DOS attacks, security or any of that stuff as the WordPress.com team have a terrific track record of handling such things spectacularly well.

The clients opinion

The Canterbury Red Devils have been very happy so far with the end-product. For negligible up-front cost they have all of the features they wanted form their site, a slick design, their own domain and to the casual observer it looks like the Red Devils have a regular self-hosted WordPress installation.

They have gone from an awkward to use static site which they couldn’t update, there were no RSS feeds, no email subscriptions, no photo galleries and they couldn’t give non-technical users the ability to edit their site. They can now have multiple members of their organisation editing the site with no fear of the site breaking or something going catastrophically wrong. They effectively have infinite bandwidth to handle any potential traffic spikes, their sites security is handled by the best experts in the business and their site loads lightning quick since it is hosted on the massive 1000+ server stack of WordPress.com.

Special thanks to Vince Mitalas from the Red Devils who worked with us on this project and who has been adding all the content ready for the sites launch today.

Vince Mitalas of the Canterbury Red Devils ice hockey team

Getting your own WordPress.com powered site

If you don’t have the CSS coding skills or simply want someone else to handle everything for you, please get in touch with us as we are very keen to build more of these hosted setups. If it matches your requirements, they are an inexpensive way to enter the online world without losing any of the professionalism of the regular self-hosted WordPress installation.

This new plugin adds a smooth animated effect to your dropdown menu. It was originally part of the PixoPoint Menu plugin, but was becoming too bloated and was only useful when using the other parts of the PixoPoint Menu plugin, not just the animations side of it. For a demonstration of it in action, just visit the menu on this very page!

Download

PixoPoint Menu Animations 0.2.1 beta

Features

The primary feature of the PixoPoint Menu Animations plugin is the addition of a smooth animated effect to your dropdown menu, but as always, the truly helpful stuff is in the details and this plugin has plenty of details (ie: options) to let you set your menu up the way you want it.

• Slide down or slide-out effect
• Speed of fade-in effect
• Mouseover delay to control the delay time before the dropdown appears
• Hide delay time to control the delay time before the dropdown disappears
• Sensitivity to control how easily the menu appears or disappears. On low sensitivity, instead of immediately displaying the dropdown/flyout menu on mouseover, the menu will wait until the user’s mouse slows down before displaying it.
• Arrow mark-up may be added to display any menu option which contains children.

The settings page for the PixoPoint Menu Animations plugin

Installation

After you’ve downloaded and extracted the files:

1. Upload the complete `pixopoint-menu-animations` folder to the `/wp-content/plugins/` directory
2. Activate the plugin through the ‘Plugins’ menu in WordPress
3. Visit the “PixoPoint Animations” page in your WordPress settings menu to control how the menu animations behave via a plethora of different options
4. Ensure that your theme uses a class of `sf-menu`

If your theme does not use a class of .sf-menu, you will need to add that class yourself. The Hybrid, Thematic and Genesis theme frameworks are supported automatically as is the PixoPoint Menu plugin.

Supported Themes

Any themes which use a class of .sf-menu on their menus unordered list will work with this plugin, however many themes already include the Superfish jQuery script which is used by our plugin. To avoid clashes with these other themes, we have intentionally deactivated the dropdown menu scripts in these themes. If you know of any themes which we could also add support for, please let us know!

The themes which are currently supported are:

• All themes which use a class of .sf-menu and do not include the Superfish jQuery script
• All themes utilizing the PixoPoint Menu plugin
• Theme Hybrid by Justin Tadlock
• Thematic by Ian Stewart
• Genesis by StudioPress

PixoPoint Menu plugin (where it gets confusing)

Those of you who have used our PixoPoint Menu plugin or Multi-level Navigation plugin will likely recognise many of the features of this plugin. We were slowly adding so many features to the PixoPoint Menu plugin that it was becoming bloated, and many of those features (such as animations) were suitable for people who did not need the extra features of that plugin. So to simplify things, we have extracted out the code, turned it into a separate plugin and the final result is the PixoPoint Menu Animations plugin.

The current beta version of the PixoPoint Menu plugin includes the PixoPoint Menu animations plugin inside it for compatibility with previous versions, however in the future this will be removed and users wanting animation effects will need to install this plugin directly.

How come it’s not in the repo?

We are holding off adding this plugin to the official WordPress plugins repository until it and the new PixoPoint Menu plugin beta are ready for stable release. Rest assured, that once they are ready, they will be added into the official repository.

Support

All free support questions will be dealt with via our support forum. For paid support, please sign up for our Premium Support service.

Download

The latest download is only available from here: Download PixoPoint Menu plugin v0.8.6 beta (updated 2/3/2010)

Note: As this is only a beta release, this version of the plugin is not recommended for use on production websites.

List of changes

• Total rewrite of the plugin
• Checks for correct path of wp-load.php. This allows the plugin to work even when the plugin folder is moved relative to the WordPress root folder.
• Restyled admin page
• wp_enqueue_styles() used to load the stylesheet. This is useful for other plugins which may concatenate/compress the various CSS files used in your plugins
• All WP Options collated and added into an array inside a few options
• Options whitelisted for security
• More validation checks used in the admin page for improved security
• Some unnecessary global variables removed
• Contants used to define URL’s and paths
• PHP Doc comments added
• Tabber script to jQuery version
• Collated jqanimated scripts into single chunk of code
• Added ‘library’ folder including common functions and legacy support
• Added legacy support to upgrade from other/older plugins
• Changed ‘Help’ section to read in data from PixoPoint.com. This is useful as it ensures that the same information is available on both our site and inside the plugin itself.
• Moved “Update Options” button to inside each tab
• Depreciated second menu functionality and added support for loading it via a plugin. Many users found the number of options in the plugin confusing, so by moving the second menu functionality to a separate plugin this problem will hopefully be reduced
• Depreciated Superfish functionality and loaded it via a separate plugin (currently provided in the core download). This plugin will eventually only be available as a separate download. Many users don’t require the full functionality of the PixoPoint Menu plugin, so by extracting this functionality out into a separate plugin makes it more useful to a broader range of users.
• Another animation option called “Basic” was added to the separate animations plugin.
• And a bazillion other things we’ve forgotten to mention here

Drag and drop

Some minor bugs have been removed from the drag and drop facility, but it pretty much works the same as the original PixoPoint Menu plugin.

You can modify the menu contents via the same drag and drop method as the original PixoPoint Menu plugin

Settings Tab

Many of the users of the original PixoPoint Menu plugin found the number of settings too off-putting, so we have simplified things as much as possible for them.

The settings page is now simplified in comparison to the original PixoPoint Menu plugin.

Advanced Tab

The CSS editing area is now present in the advanced tab.

You can upload/modify your CSS directly via the 'Advanced' tab. As always, this system works well with our dropdown menu CSS generator.

PixoPoint Animations plugin

On upgrading or installing a fresh new version of the PixoPoint Menu plugin, an extra plugin called “PixoPoint Animations” will be activated. This plugin includes all of the dropdown menu animation functionality originally included in the core plugin, along with an extra option called the “Basic” animations which creates a different animation effect with slightly less code than is required for the Superfish script. This plugin will be eventually extracted and released as an entire separate download. For the mean time, it is bundled with the original plugin to ensure that upgrades go smoothly.

On upgrading, or installing a fresh installation of the plugin, a second plugin called 'PixoPoint Menu Animations' will be activated. This will eventually be available as a separate download.

Known Bugs

• The PixoPoint Animations plugin is detected as being the PixoPoint Menu plugin and so immediately says it needs updated, except instead of updating, it gets deleted and is replaced by the original PixoPoint Menu plugin. A solution to this is being sorted on WP Tavern.

Multi-level Navigation plugin

This plugin is intended as a replacement for both the PixoPoint Menu plugin and the Multi-level Navigation plugin. If installed while the Multi-level Navigation plugin is running, it will deactivate that plugin, then transfer all of your settings (including your CSS) over to the new plugin and then clean your database of all of the old Multi-level Navigation plugin data (that plugin added lots of pointless junk to your database).

Future versions of the Multi-level Navigation plugin will automatically upgrade themselves to the new PixoPoint Menu plugin. This will not be happening until extensive testing has been undertaken to ensure there are no glitches during the upgrade process.

When the WP DB backup plugin is activated, you can navigation to “Tools” > “Backup” in your sites admin panel and from there you can select any extra database tables you would like backed up, and then either choose to download a copy of the database immediately, or schedule to have the database emailed to you periodically.

Screenshot from the WP DB backup admin page. Click to zoom in.

I generally have most of my sites email me a copy of their database every day. If you don’t like receiving lots of backups to your main email account, then you can have it sent to an address that you rarely use. This way you always know that your data is backed up to a reliable place. It also pays to periodically download a copy to your computers hard drive so that you have it triply backed up in case of a double catastrophe of data loss.

Note: If you database is larger than the largest email attachement your server can send, then you won’t be able to send the entire database. Most databases are less than 1 MB in size so this is rarely a problem for the average site owner.

Since this is an alpha launch, we do not recommend using this in a live environment just yet. There are likely to be bugs and we haven’t written a lot of documentation on how it works just yet. Plus we are likely to change some things before it is officially released as a stable product.

• More information about the integrator
• Preliminary Installation Instructions
• Download PixoPoint Theme Integrator 0.1.1 Alpha

We use the PixoPoint Theme Integrator in our support forum.

WP Tavern

The WordPress Tavern has become the defacto goto place for many WordPress experts. The site is run by the unofficial WordPress community superstar Jeff Chandler who is based in the USA. The site includes a blog with posts from both Jeff himself and other contributors and a terrific forum for discussing the latest news, tips and tricks of WordPress. The site is also the home of WordPress Weekly, the best podcast about Wordpress.

WP Garage

Although not updated as often as it once was, WP Garage is a terrific source of information about plugins, themes and basic tricks. The site is ideally suited to those wanting to move from being a novice WordPress user to a power user as it includes a series of basic coding tricks and tips. The site is run by Miriam Schwab of Israel who is also the CEO of illuminea, an internet presence and marketing firm.

Justin Tadlock / Theme Hybrid

Justin Tadlock is one of the leading experts on theme development for WordPress. Justin is very much at the cutting edge of creating innovative themes which can be modified extensively (via child themes) without touching the core theme code. He is the author of Theme Hybrid and also written some high quality plugins for WordPress. Justin operates a theme club which includes a high quality support forum for his various (free) products.

Other resources

There are so many other resources about WordPress that we couldn’t possibly list them all. However here is a list of resources we also recommend checking out.
Theme Shaper – An excellent site by Candian based Ian Stewart, about WordPress theme development and in particular his parent theme, Thematic.
WP Vibe – A resource site about WordPress plugins and themes by Dre Armeda and Jonathan Dingman.
SitePoint – Although not a WordPress specific site, SitePoint is an excellent place to learn more about the software. SitePoint includes the most popular web development forum on the internet.
WP Mu Tutorials – One of the best places to find Mu specific information about WordPress. The site is run by husband and wife team Ron and Andrea.
Andrew Rickmann’s blog – An excellent site for opinions on the more advanced issues relating to WordPress.
Mark Jaquith on WordPress – Mark Jaquith is one of the core developers for WordPress and also the best of the core developers at dispersing information about the cutting edge of WordPress development.

The following code will produce a clean smooth flowing animation effect just like you can see in the menu above for our own site.

function suckerfishmenu(){
	$('#suckerfishnav ul').css({display:'none'}); // Opera Fix
	$('#suckerfishnav li').hover(function(){
		$(this).find('ul:first').css({display:'none'}).slideDown(300);
	},function(){
		$(this).find('ul:first').css({display:'none'});
	});
}
 $(document).ready(function(){
	suckerfishmenu();
});

To make this work, you simply need to insert the above code after you load jQuery and between the <head> tags for your page and use a dropdown menu with an ID of #suckerfishnav. Make sure you reference the jQuery.js file correctly (available here). If you are using WordPress, then you will want to make sure you are loading jQuery via the enqueue method to avoid clashes with plugins which use jQuery and add var $ = jQuery; to ensure that jQuery works with the non-conflict mode of the version of jQuery version bundled with WordPress.

If all of that seems too complicated, don’t despair as the new version coming soon of our PixoPoint Menu plugin has this new animation method built in so that you won’t need to touch any code to get it working.

The PixoPoint SMF widget in action

We have received a few requests for information about how we have added our latest forum topics to our sidebar here on PixoPoint.com. The answer, is that it is a custom coded WordPress widget.

We weren’t intending this for public release, so it is not as easy to use as it could be. The plugin works by periodically utilizing the SSI.php file in SMF to load the list of topics, then it stores them in your WordPress database. The system currently reloads the list of topics every time it loads a specific page on your site; this was a simple fix for our own purposes but for your own site you may wish to use a cron job to load the script periodically (you will need to know some PHP to do this). You could reload the list of topics on every page load, but this would require totally reloading the SSI.php file on every page load which will likely cause performance problems on your site.

The widget doesn’t include an easy to use admin panel and instead has a file called config_smf.php which allows you to control how many posts to display, the ID for the page and how many posts/topics are displayed. It currently only works with SMF 2.0, but could easily be adapted to work with SMF1.1.x. It could also be adapted to display other pieces of information from your SMF forum.

<php
/*
This file sets the configuration of the SMF settings for the widget
PixoPoint SMF forum posts widget
Copyright (c) 2009 PixoPoint Web Development
...........
*/
$pixopoint_smfvar['ssi_path'] = '/home/rhellyer/public_html/pixopoint/forum/SSI.php'; // Path to your SMF installations SSI.php file
$pixopoint_smfvar['wp_pageid'] = 436;  // Page ID of an infrequently accessed page on your site
$pixopoint_smfvar['numberposts'] = 10; // The number of posts you wish to display

?>

Download PixoPoint SMF Widget zip file

Installation

1. Upload the complete pixopoint-code-comments folder to the /wp-content/plugins/ directory OR install it via the WordPress plugin repository browser
2. Activate the plugin through the ‘Plugins’ menu in WordPress
3. Modify the smf-config.php file to suit your own sites specifications

Support

This software was not originally intended for public release so we will not be providing support for free sorry. For support (including help with customisations), you will need to try our Premium Support service.

We use the PixoPoint SMF Widget to extract our latest forum topics from our SMF forum into our WordPress sidebar.

However, in order to keep maintaining the service, we need those requesting free support to follow a few simple guidelines or we will need to move to a purely paid support system (which we would like to avoid). In the past we attempted to answer every question which was sent our direction, but as the number of support requests has grown, this has become virtually impossible to maintain due to the shear number of questions.

To help reduce our workload, it would be great if you could follow these guidelines before posting any free support questions in our forum (these do not apply to Premium Support members):

Things to let us know in your post

• Are you using one of our WordPress plugins? If so, which one?
• Where is your CSS? (don’t paste it, just post a link to it)
• What modifications have you made to the CSS?
• What browsers are you having problems with?
• What is the URL for your site?

If you didn’t paste your CSS into a WordPress plugins’ settings page, then let us know which exact file it is in (searching through a dozen CSS files in your theme trying to find your menu code is very time consuming).

Things which prevent us from helping you

• Not providing a link to the problem.
• Only providing HTML and CSS code snippets (without a link).
• Not telling us you modified part of your CSS, plugin or theme.

We can not answer vague questions about your menu or theme not working, we need to see the problem in action so please provide a link to it. Note: you don’t need to provide an example of your whole site just to demonstrate a problem. If you don’t want to leave your site in a broken state, then you can simply create a static HTML file of your problem and upload that instead. “Save as” in most browsers will do the job, or you can copy and paste the source code.

Email Support

We only offer email support to our Premium Support members. By keeping all free support questions open to the public, we hope that others will be able to learn form the answers.

Blog Post Support

We do not provide support in our blog posts. All free support questions must be posted in our support forum.

Suckerfish

The original Suckerfish javascript code was posted on A List Apart by Patrick Griffiths and Dan Webb. As outlined in our :hover pseudo class post, it simply adds support for the same effect as the :hover pseudo class in Internet Explorer 6 and older browsers.

The following code is based on the most popular form of the Suckerfish script, the “Son of Suckerfish” by HTML Dog. This code works with any unordered list with an ID of #suckerfishnav.

sfHover = function() {
var sfEls = document.getElementById("suckerfishnav").getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);

The following code is more suitable for situations in which you need support for multiple dropdown menus on the same page as it works on any unordered list with a class of .sf-hover (ie: you can’t have two menus with the same ID therefore this class system works better in such situations).

function sfHoverEvents(sfEls) {
var len = sfEls.length;
for (var i=0; i
sfEls[i].onmouseover=function() {
this.className+=" sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(" sfhover", "");
}
}
}
function sfHover() {
var ULs = document.getElementsByTagName("UL");
var len = ULs.length;
for(var i=0;i
if(ULs[i].className.indexOf("sf-menu") != -1)
sfHoverEvents(ULs[i].getElementsByTagName("LI"));
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);</code>

Superfish

Superfish is a plugin for the jQuery javascript framework. Unlike the simple Suckerfish methods outlined above, Superfish adds many more features to your menu than just :hover pseudo class support in IE6.

Some features of the Superfish jQuery plugin are:

• Timed delay on mouseout to be more forgiving of mouse-piloting errors.
• Animation of sub-menu reveal. The animation speed is customisable
• Keyboard accessibility. Tab through the links and the relevant sub-menus are revealed and hidden as needed.
• Supports the hoverIntent plugin. Superfish automatically detects the presence of Brian Cherne’s hoverIntent plugin and uses its advanced hover behaviour for the mouseovers (mouseout delays are handled by Superfish regardless of the presence of hoverIntent).
• Indicates the presence of sub-menus by automatically adding arrow images to relevant anchors. Arrows are fully customisable via CSS.

To see a demo of the Superfish plugin in action, hover over the menu of the Dunedin Ice Hockey Association.

HTML

We will post another blog post soon outlining best practices and how to create your own custom HTML for your menu.

Other scripts

There are many other alternative scripts out there too. If you have any favourites, please post a link to them in the comments.