Time for action—Changing the block header background image

For this example, we will overwrite the eight block header files. We will now change the the block headers from gray to red.

Then we will upload images, its best if we just use the same filenames to avoid having to edit the CSS image referencing. We will only replace the images with similar dimension and format but maintain the use of the same filenames.

Tip

Alternatively, you can change the filenames in the global.css file according to the new image file you have uploaded to your image folder.

Let's try to change the background image of the block headers to red color background image. You don't want to use a flat color, so you need to integrate a background image to these blocks.

Firstly, to change, you will need to identify the name of the background image used in the block header. To help you minimize the time to identify the names of the background images, the easiest method is to use Firefox and just right-click on the image you...