How to Give Joomla a Fixed Background

Written by declan maher
  • Share
  • Tweet
  • Share
  • Pin
  • Email
How to Give Joomla a Fixed Background
You add a background image to Joomla by editing the CSS file. (Jupiterimages/ Images)

Joomla! is a free open source content management system (CMS) for creating websites. It is written in the PHP programming language and uses object-oriented programming (OOP) techniques. A fixed background is a background image that will stay in one place, while the rest of your text and images scroll over the top of it. You can do this in Joomla by editing the CSS file for the Joomla template. You add code to insert the image and fix it in position when scrolling the site pages.

Skill level:

Other People Are Reading


  1. 1

    Log in to the administration section of your Joomla website.

  2. 2

    Upload the image you want to use as a background to the images folder in the Joomla code, using an FTP editor or through the Media Manager, in Joomla.

  3. 3

    Navigate to the top menu item called "Extensions," then to "Template Manager" and click on the live template for the site. The live template is indicated by the image of a yellow star, beside the template name.

  4. 4

    Click on the button "Edit CSS" in the top right menu. Choose the template for the site, usually called "template.css." Click on the Edit button to open the file for editing.

  5. 5

    Search for the "body" tag in the code.

  6. 6

    Add the following code between the opening and closing brackets:




    The image is linked to the image you uploaded in the second step.

  7. 7

    Click on the "Save" button in the top right menu to save the file. Open the site in a browser and the image will now be fixed in position on the page when you scroll down.

Don't Miss

  • All types
  • Articles
  • Slideshows
  • Videos
  • Most relevant
  • Most popular
  • Most recent

No articles available

No slideshows available

No videos available

By using the site, you consent to the use of cookies. For more information, please see our Cookie policy.