Changing the background image
RSDinah! offers a wide range of customization options designed to aid you in getting your desired results in terms of looks and functionality. However, there are some modifications that cannot be currently made using the template's default features, like changing the background image. There are 2 ways in which you can do this:
-
1. CSS Overrides
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 background is found in its images folder and is called bg.jpg. RSDinah! 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/rsdinah/images folder
- Head to /templates/rsdinah/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.
-
2. Manually replacing the files
RSDinah! offers, by default, the possibility to choose from 5 background images. This is done in Extensions >> Template Manager >> edit RSDinah >> Details tab >> Select Background field. Depending on the selection made here, one of the bg1.jpg, bg2.jpg, bg3.jpg, bg4.jpg or bg5.jpg images will be used. They can be found under the following path:
/templates/rsdinah/images
You can simply delete any of the images and replace them with new ones, baring the same names. You will then be able to select them in the template's configuration area under the path provided above.
One person found this article helpful.
