First you need to decide in which part you are going to implement this trick. You can implement it in anywhere in your template like body, left sidebar, right sidebar, footer and others part you want. For this tutorial we are going to use “body” element because we are going to change full website background image.
First you need to create a folder where you will store your all background images. You can create this folder anywhere under your site directory but create this under your image folder or template image folder for better maintenance. Now rename this folder as you want we are going to use “backgrounds”.
Upload your images into this folder and name it like: bg-1.jpg, bg-2.jpg, bg-3.jpg etc. Now we are going to generate a random number using PHP
This code is very simple and self explained isn’t it?I am going to explain 2 techniques to load background image.
Technique#1
Load image directly under body element. If you know a little about html then you probably know that it’s easy to embed any image using “style” tag. Now we are going to use it:
Technique#2
Using this same php code you can load a random ID or Class inside you body element and u can load background image form a css file.
This code will generate random id for body so you can easily trigger this id in ur css and change your background images. Personally i prefer this technique because you have more control over your design. Like you want to change your Top Menu color for bg-2 so you can change this things easily in this technique.
