Customize the Look and Feel of Rvolve Ads

Change the image size

The size of the images can be modified. In the code that you copied, modify the 'rvolveImageWidth = "XXX";' to match the width of your column and the 'rvolveImageHeight = "XXX";' to match the height of your rows.

Zoom Animations

You can switch the animation on or off with 'rvolveAnimate = "off"' or "on". New You can now individually change whether the zoom is used or the ticker is used with 'rvolveZoom' and 'rvolveTicker' respectively.

Modifying the Target Window

New If you want the link target to be a new window or any other frameset you can add the code e.g. + '%26target=_blank' immediately after 'rvolveZoom'

Text-only Examples

Top Div Code
<div id="rvolve-ads" style="display:none; font:normal 12px  Arial, Helvetica, sans-serif;" >
    <table cellspacing="5" bgcolor="#FFFFFF">
        <tr>
            <td><a href="AD_LINK_0" title="AD_FULL_TEXT_0" >AD_TEXT_0</a>
            </td>

            <td>
                <span style="font-size: 80%">AD_DIST_0</span>
            </td>
        </tr>

        <tr>
            <td>
                <a href="AD_LINK_1" title="AD_FULL_TEXT_1" >AD_TEXT_1</a>
            </td>
            <td>
                <span style="font-size: 80%">AD_DIST_1</span>
            </td>
        </tr>
        <tr>
            <td colspan="2">
                <b>INFO_ADVERTISE_HERE</b>
            </td>
        </tr>
    </table>
</div>
Top Div Code
<div id="rvolve-ads" style="display:none; font:normal 26px  Arial, Helvetica, sans-serif;" >
    <table cellspacing="5" bgcolor="#FFFFFF">
        <tr>
            <td><a href="AD_LINK_0" title="AD_FULL_TEXT_0" ><b>AD_TEXT_0</b></a>
            </td>

            <td>
                <span style="font-size: 80%">AD_DIST_0</span>
            </td>
        </tr>

        
        <tr>
            <td colspan="2" align="right">
                <span style="font-size: 40%">INFO_ADS_BY_RVOLVE</span>
            </td>
        </tr>
    </table>
    
</div>
Top Div Code
<div id="rvolve-ads" style="display:none; font:normal 12px  Florence, cursive; border: 1px #aaeeaa solid;" >
    <table width="100%" cellspacing="5" bgcolor="#DDFFDD">
        <tr>
            <td><a href="AD_LINK_0" title="AD_FULL_TEXT_0" >AD_TEXT_0</a>
            </td>

            <td>
                <span style="font-size: 80%">AD_DIST_0</span>
            </td>
        </tr>

        <tr>
            <td>
                <a href="AD_LINK_1" title="AD_FULL_TEXT_1" >AD_TEXT_1</a>
            </td>
            <td>
                <span style="font-size: 80%">AD_DIST_1</span>
            </td>
        </tr>
        <tr>
            <td colspan="2" align="right">
                <b>INFO_ADVERTISE_HERE</b>
            </td>
        </tr>
    </table>
    
</div>


Edit the HTML

Between the tags <div id="rvolve-ads"> and </div>, you can put whatever HTML you like to make the ads match the look and feel of your site. Include the following codes in your HTML to include the links:

AD_LINK_0
AD_TEXT_0
AD_FULL_TEXT_0
AD_DIST_0
AD_IMAGE_0
AD_LINK_1
AD_TEXT_1
AD_FULL_TEXT_1
AD_DIST_1
AD_IMAGE_1
INFO_LINK

The info link will always be appended at the end of the HTML if it isn't defined. If the tags INFO_ADVERTISE_HERE or INFO_ADS_BY_RVOLVE are included, then the text on the info link is modified to "Advertise Here" or "Ads by Rvolve" respectively.

Note: you may want to add in a style="display:none;" tag to hide the HTML while the page is loading, as shown below.

For example:

<div id="rvolve-ads" style="display:none;" >
<a href="AD_LINK_0" title="AD_FULL_TEXT_0" >AD_TEXT_0</a>&nbsp;&nbsp;AD_DIST_0<br/>
<a href="AD_LINK_1" title="AD_FULL_TEXT_1" >AD_TEXT_1</a>&nbsp;&nbsp;AD_DIST_1<br/>
INFO_LINK
</div>

would create: