Jellyfish Invaders a free plugin for WordPress that adds cool animated retro Space Invaders to your website.
Your new pixelated pals will randomly fly around, and if you choose, home in on any mouse clicks. The glowing retro 8bit scan-line effect space invaders work on most backgrounds but obviously are more suited to a dark theme. It’s easy to configure the number, size, behaviour and where the invaders appear through the comprehensive admin control panel.
Demo
You’ll see some rasterized rascals roaming around this page, for this demo I’ve confined them to the dark section of the page using the containing element option so keep an eye out above… Are they hiding? Click your mouse or tap to attract their attention!
Usage
When first installed the Jellyfish Invaders plugin will show some invaders on every page of your blog. You can easily change this to your liking by visiting the setting page, you will find a link to the settings page in the Appearance menu of your WordPress admin. Here’s an overview of the options:
Appearance> Jellyfish Invaders” width=”273″ height=”300″> Admin > Appearance> Jellyfish Invaders
General Settings
Enable Invaders – Turn the invaders off and on. A quick way to temporarily disable the invaders without deactivating the plugin.
Where to show – you can choose either everywhere OR only on individual posts or pages. You can use this second option to just show them on your home page or a single post for example.
The invaders will look out for a custom field called “jellyfish_invaders” on any post or page. If they find one and it has a value of ‘true’ or ‘on’ they will populate the page.
Number of Invaders – how many individual space invaders you want, keep this number quite low to avoid slowing down your page too much
Invader Size – size of the invaders
Fly Time – how long the invaders fly around before pausing in milliseconds (1000 = 1 second)
Pause Time – How long the invaders Pause (or wiggle see below) for between flying cycles.
Random – adds some variation to the time settings so each invader acts a little differently.
Wiggle – Instead of pausing the invaders will do a missile evasive evasive wiggle.
Attack Mode – None, One or All of the invaders will home in on any mouse clicks.
Advanced Settings
By default the invaders will be free to roam randomly around the entire page, but there are a couple of methods to confine them to specific areas if you wish.
Containing Element – the invaders will only roam within the element set here, normally that’s body (the whole page) but you may enter the id of an element on the page to confine them to a specific area. You can see this in effect right here where the invaders have been limited to the section at the top of the page.
Z-Index – If you’d like the invaders to hide behind certain layers on your page you can set an appropriate z-index here, obviously this setting it very dependant on the structure of your WordPress theme.
Use Electric Fence – Check this option and use the top, left, right and bottom options to define a virtual fence that will contain the invaders. The values you enter represent pixels position on the entire document. Note, this option will override any custom setting for Containing Element.
Changelog
0.9
- Tested up to WordPress 4.0
Added Containing Element option: Confine invaders to a specific page element
Added Z-index support: Configure invaders z-index for layering in document
Updated Admin screen
Updated Spritely version
0.7
- changed the way scripts are queued to ensure JavaScript is only included when invaders are actually needed.
0.6
- Initial release
Download
You can download this plugin from the WordPress plugin repository
http://wordpress.org/extend/plugins/jellyfish-invaders/
This plugin uses the excellent Spritely library for jQuery. Read more about Spritely at http://www.spritely.net/
This is lots of fun, but I can only see them when I’m logged into WPress. Once I log out and go back to the site, no invaders. Any ideas?
Odd, I can’t reproduce that. Do you have a link on somewhere they are(n’t) showing and I’ll take a look?
maybe it was a caching issue… they’re showing up now! Cool!
Cool ! My website is now invaded by aliens. Thanks for the great work.
I have an issue – not a big deal, though. The invaders disappear every time I click a post from my home page, but they come back on the next post I click.
I love your counter script its perfect for what we need our site to to do. If you scroll down you will see a static graphic that says 87 million. We want the counter to appear there instead of in a widget. How can we make your widget show up and replace that 87 million graphic? Is there embed code you can send me?
Maybe i do something wrong……. But i don’t see the invaders on my page……
I cant this to display on a single page. whole site? yes.