Make sure you read the app Quick Start Guide before starting. If you don't have this application yet, download it here.

The background app enables you to easily add an image background to any location on any page of your website.

Displaying your backgrounds

Once you have added a background content item, you're ready to display your background image on your site. To do this, you'll need to publish a Joomla! SEBLOD List Module on your desired page(s).

  1. Go to the Joomla! Extensions > Module Manager in the back end of your website
  2. Click "New" > SEBLOD List
  3. Select "Backgrounds" as the Search Type (List)
  4. You can select any module position in your template. This setting will not effect where the background image is displayed. That setting is controlled by the Backstretch template.
Remember to assign your module to all pages that you want to display your background image on AS WELL as assigning this in the content item itself.

Choosing the target container for your background

The final step in displaying your background image is to select a target container for the background image to be loaded in

  1. Open the List view of the "Backgrounds" List & Search Type
  • Go to the "Template" options
  • Enter a selector HTML element, class or ID. For example, you can enter "body" to display the background image on the HTML element
  • Here you can add some animation options if you want to display your images as a slideshow by assigning multiple background content items to the same page. "Duration"" will set how long each image will display for, and "Fade" will set the length of the fade transition effect
  • The end result

    Here's the end result after making "body" the selector, and assigned the background content item to the home page of the site.