Scroll To Top

Enter a query to search our site. Note that you can use "*" and "?" as wildcards. Enclosing more than one word in double quotes ("CSS Layout") will search for the exact phrase.

BRM Home | Affinity Aspire Home| Tutorial Finished Page

Background Rotator Magic meets Affinity AspireThe Ultimate Responsive and Adaptive Widgets for Dreamweaver

Create a background image rotator in an Affinity Aspire page.

The technique works for any Aspire layout. Here is Layout 2:

1. Create a working folder

To complete the tutorial, create a new folder inside the root of your defined Dreamweaver site and name it brm-aspire.

2. Download the sample pictures and CSS file

We.ve made the sample images available to help you complete this tutorial quickly. We've also included an alpha-transparent verssion of the default Aspire Logo. The zip file also contains a small CSS file. Download the pictures and unzip them. Place them inside the root of your new brm-aspire folder.

Download Images and CSS

3. Create a new Affinity Aspire page

Create a new Affinity Aspire page and save it inside your brm-aspire folder. Choose any layout.

4. Link the Page to the Tutorial CSS File

Switch to code view and locate your closing head tag:

</head>

Create a new line above the closing head tag and add a link to the brm-aspire CSS file:

<link href="brm-aspire.css" rel="stylesheet" type="text/css">
</head>

Switch back to Design View.

5. Add your BRM scroller

Open the BRM and add your scroller. Use the images you downloaded...or your own.

6. Add the brm class to your page's body tag

Switch to Code View and locate your page's opening body tag:

<body class="aspire-4">

The existing class will be the word aspire, folowed by a dash and a number that corresponds to the layout you selected when you created the page. We are going to add the brm class as a second class to the tag, so it looks like this:

<body class="aspire-4 brm">

That's it!

Background Rotator Magic works on... Windows and Mac systems running Dreamweaver MX, MX2004, 8, CS3, CS4, CS5, CS5.5, CS6, CC, CC 2014, CC 2015, CC 2016, CC 2017, CC 2018, CC 2019, CC 2020, CC 2021 (and higher). For installation tips, please see Using PVII Extensions in Dreamweaver CC...

Invest in a tool that will pay for itself over and over

Background Rotator Magic is an indispensable tool that will make your job and your life a lot easier.