The WP Background Tile Plugin for WordPress applies a tiled background image to your blog. It is as simple as this:
- Create a background image
- Upload it
- Apply it as the background via the WP Background Tile options page
Applying a repeat pattern to the background of a webpage is easily done using css:
body {background-image: url(example.jpg);}
However, if you're not into writing code, or don't know where to insert the css into your wordpress theme, then you will find this plugin much easier. It can also be an easy way of testing out lots of background images before deciding on one you are happy with.
INSTALLATION:
- Download the plugin from the link at the bottom of this page
- Upload the wp-background-tile folder to your wp-content/plugins folder.
- Activate the plugin from the Plugins page in WordPress.
USAGE:
- Upload your background image via 'Media => Add New' in Wordpress (or via FTP)
- Go to 'Settings => WP Background Tile' in WordPress
- Paste or type in the URL of your background image (explained in more detail below)
- Press 'Submit'
CREATING A BACKGROUND TILE:
A background tile is an image which is repeated in both directions over the background of a webpage. Look closely at the background of my site and you will notice the green background is not a matte colour, but a subtle texture. Right click on the background of my site and choose 'View Background Image' (Firefox) or 'Save Background As' (IE) and have a look at the image. You will notice that it is small (16 x 16 pixels), as you don't need much of the pattern to make it tile. Stripes and other geometric patterns can work well for a subtle effect.
Tip: Check out the free online Stripe Generator tool, it's a really easy way to create striped background tiles.
Background tiles can also be used for larger images such as a logo repeat. An example of this is www.mrdupes.com. To achieve this type of result using photoshop the 'offset' filter can be very useful.
GETTING THE URL OF A FILE YOU HAVE UPLOADED WITH WORDPRESS:
- Go to 'Posts => Add New'
- Click on the 'Add Media' button (a little star type icon next to 'Upload/Insert')
- Click on the 'Media Library' tab
- Click on the word 'Show' next to the file you want the url for
- Under 'Link URL' click on the button 'File URL'
- The file url should now be in the 'Link URL' text box so you can copy it.
DOWNLOAD PLUGIN:
Hi!
I’ve been searching for such a tutorial for a long time!thank you!!
I just wanted to ask if it’s possible to activate the effect on rollover with actionscript, it would be for a website!
thank you very much,
Valentina
Hi Valentina
You could attach the effect to a button or movie clip rollover. You could attatch it to the rollover state of a button without any actionscript. You could also activate the rollover effect in as2 using the following method:
1. Select the shine (Symbol 3) movieclip and give it the instance name ’shine’
2. Add this action to frame 1 of the ’shine’ movie clip:
stop();
3. Create a button. you could make it transparent by setting it’s alpha to 0.
4. Add this action to the button:
on (rollOver) {
shine.play();
}
I hope this helps.
Sam
Hi Sam and thank you very much for your infos. I am a newbie of flash and actionscript so I always need every step to be clear like in your tutorial to do it
Could u help me out with a sample flash file?you could send it to my email if that’s not a problem for you.
I would really like to understand both ways to make such a rollover button, love your tutorial!
thank you very much,
valentina
hey
thanks for your sharing but. ı have some problem
I downloand the .fla document but ı didnt open it with mocromedia flash 8 can you help what is he problem please ? ı am waiting your answer
Well Done just what I was looking for!!!
Thank You!!!
Nice tutorial, also would be great if only as3 version will be posted