Changing the background image
RSFedra! offers a wide range of customization options designed to aid you in getting your desired results in terms of looks and functionality. Although the template includes 5 different background images (that can be selected in Extensions >> Template Manager >> edit RSFedra - Default >> Details >> Select Background), they may not be suitable for what you really need to get out of your website and you might need to use your own, custom background.
There are 2 ways in which you can do this:
-
Adding a new background image
Using a developer tool like Firebug - for Mozilla Firefox - or something similar, inspect the element and have a look at the <body> container's CSS definitions. Depending on the You will find the following class, in the template.css file:
body.site { background: url("../images/bg.jpg") no-repeat fixed center top rgba(0, 0, 0, 0); }
As you can see, the template's default backgrounds are found in its images folder and are called bg1.jpg, bg2.jpg, bg3.jpg, bg4.jpg and bg5.jpg. RSFedra! includes a feature that allows you to adjust the template's CSS without modifying the original CSS files:
- Copy the new background image that you wish to use in the /templates/rsfedra/images folder
- Head to /templates/rsfedra/css, create a file called custom.css and edit it
- Add the following code in the newly created file:
body.site { background: url("../images/new_background.jpg") no-repeat fixed center top rgba(0, 0, 0, 0); }
- Save the changes to the file and refresh one of your website's pages, you will notice that the background has been changed
Important: Remember to replace new_background.jpg with the actual name of the new background image file.
-
Replacing a default background image
You can simply replace any of the default background images found in /templates/rsfedra/images/ with your custom background. Just remember to rename the new file with the name of the backround image that you are replacing (bg1.jpg through bg5.jpg) and select the appropriate option in Extensions >> Template Manager >> edit RSFedra - Default >> Details >> Select Background.
