Major Additions - vB Affiliate Linking System (Multi-Purpose & Flash-based)

vB Flash Affiliate Linking System (Multi-Purpose)

Important: No longer supported on vbulletin.org - advice and support only available from Digital Port UK
Another creative idea brought to you by Syrus XL Media.
Free and Pro versions available from ? http://www.digitalport.co.uk
LIVE DEMO: http://www.shedevils-ld.com
Released: 15th April 2007
Version: 1.0.0
Documentation: Download packaged with .txt and .pdf formats.
Color Variations: See end of this post for other available colors.

Description
Even though we have called this an ?Affiliate Linking System?, it could serve many other purposes, depending on configuration. Basically, it will rotate any image, along with a title and an active url. You can also rename the modification name (currently the text on the bottom left) by editing the content.txt file.

Some suggested uses of this modification:

• Display forum Administrators and Moderators photos.
• Use as a miniature gallery.
• Use to display your affiliates.
• Display latest store items for sale.

The modification uses no database queries and is totally XML driven, maybe in the future we will change this to a database driven modification.

Usage
Windows users can benefit from using the scroll-wheel to flick through the various links. By double-clicking on any image, the url will be opened in a new window. A single click on any image will bring it to the front.

Adding new links with thumbnails is just a case of creating the thumbnail and editing the XML file. There?s no need to know anything about Flash, everything is controlled externally. If you find that after adding a certain number of links they fail to load, or show - Make sure you are not viewing a cached version in your browser. You should clear your Temporary Internet Files to fix this problem.

vBulletin Installation
Please read this carefully, these instructions will place the modification display on your forum homepage (if you wish to put this on the vBadvanced CMPS please view below). These instructions assume you are using the vBulletin default style.

In all installations upload all the files within the UPLOAD folder to your forum root directory.

Directory structure:

adls_data.xml
adls_content.txt
vbadlsystem.swf
/adls_images
/clientscript/flashobject.js

Note: If you have installed previous modifications by us, you may find that the flashobject.js file is already in your vbulletin installation. This file is used for fixing compatibility issues when embedding flash files, with some browsers.

Template Edits:
AdminCP -> Styles & Templates -> Style Manager -> Default Style -> Edit Templates

In the headinclude template
FIND:

<script type="text/javascript" src="clientscript/vbulletin_global.js?v=$vboptions[simpleversion]"></script>

Above add this:

<script type="text/javascript" src="clientscript/flashobject.js"></script>

In Forum Home Templates > FORUMHOME template
FIND:

$navbar

BELOW ADD:

<div align="center" width="100%" id="link_display">
Warning!!! To view this please enable JavaScript and Flash! 
</div>
<script type="text/javascript">
   var fo = new FlashObject("vbadlsystem.swf", "link_display", "700", "230", "8,0,0,0", "#E9E9F2");
   fo.addParam("quality", "high");
   fo.write("link_display");
</script>
<!-- js flashobject -->

Change the "#E9E9F2" to suit the background color of your forum.

End of Template edits to Display modification on vBulletin homepage.

Configuring the adls_content.txt file
This file only contains the text which you want to display along the bottom of the display. When editing this file do not add spaces before the main variable.

EXAMPLE:
content=Whatever you want goes here

Configuring the adls_data.xml file
This file needs very little explanation, however here?s what 3 variables you can change per image url.

The file contents:

<?xml version="1.0" encoding="utf-8"?>

<photos path="adls_images/">   This path can be changed, just a default we have set for the images.

   <photo name="Digital Port UK" url="image1.jpg" link="http://www.digitalport.co.uk/"></photo>

</photos>

The ?photo name? is the text you would like under the image when displayed.
The ?url? is the path to your image (note the directory is not required).
The ?link? is for your image when double-clicked on.

Creating your thumbnails
Each thumbnails image is 200x150 pixels and a non-progressive jpeg format. The flash file will resize thumbnails when they are the incorrect size, but this may lead to distortion.



vBadvanced Installation
The installation is pretty much the same apart from one template edit. These instructions assume you have installed the CMPS inside your forum ROOT, not outside.

If you have installed the vBadvanced CMPS outside the forum ROOT you will need to prepend the urls of the edits required with the flashobject.js and the vbadlsystem.swf with the full url path.

You will need to upload all files as previously mentioned for the vBulletin installation and also do the headinclude template edit.

On top of this you will need to do the following edit:
In the vBadvanced CMPS Templates -> adv_portal
FIND:

<table align="center" class="page" cellspacing="0" cellpadding="0" width="100%">

BELOW ADD:

<div align="center" width="100%" id="link_display">
Warning!!! To view this please enable JavaScript and Flash! 
</div>
<script type="text/javascript">
   var fo = new FlashObject("vbadlsystem.swf", "link_display", "700", "230", "8,0,0,0", "#E9E9F2");
   fo.addParam("quality", "high");
   fo.write("link_display");
</script>
<!-- js flashobject -->
<br />

Change the "#E9E9F2" to suit the background color of your forum.

End of CMPS Template edits

Enjoy!

[YabbaDabba]

Can I change the default image size?

Perhaps there could be a third text string that includes instructions for viewers (e.g., "double click image for more info")

[syrus.xl]

Originally Posted by YabbaDabba

Can I change the default image size?

Perhaps there could be a third text string that includes instructions for viewers (e.g., "double click image for more info")

The image size is fixed within the flash file itself, therefore it cannot be changed dynamically from outside. Maybe a future addition.

As for another text field, this could be done very easily, however with the current layout I'm a bit unsure where this would actually go. Comments always welcome...

[syrus.xl]

Originally Posted by es-league.com

sorted that thanks

I have a small problem now though... my quicklinks drop
down behind the affiliate linking system ?

anyway to adjust this ?

This is a problem with DHTML and flash, but its not only just these issues. I could fix it to work on one browser, but the problem would be evident in another browser, I've yet to find a way around this issue, that is cross-browser compatible.

Apart from changing the vBulletin default drop to horizontal, instead of vertical there isn't much that can be done.

A temporary fix would be to add a further parameter to the embed code, and recompiling the flash file. I will see if I can find a way around this problem.

[YabbaDabba]

Originally Posted by syrus.xl

As for another text field, this could be done very easily, however with the current layout I'm a bit unsure where this would actually go. Comments always welcome...

----------------------------------------------------------------------------------
Image Title
----------------------------------------------------------------------------------
content_string . . . . . . . . . . . . . . Instruction_string . . . . . . . . . . . . . .dev_string
----------------------------------------------------------------------------------

It would be up to the indiviudal to make sure the strings all fit in the allotted space.

[YabbaDabba]

Support for BB code or html in the adls_content.txt file would be nice.

Continuous loop option would be nice.

[YabbaDabba]

Originally Posted by YabbaDabba

----------------------------------------------------------------------------------
Image Title
----------------------------------------------------------------------------------
content_string . . . . . . . . . . . . . . Instruction_string . . . . . . . . . . . . . .dev_string
----------------------------------------------------------------------------------

It would be up to the indiviudal to make sure the strings all fit in the allotted space.

I ended up putting "double click image" instructions in the adls_content file.

[YabbaDabba]

I think there might be a bug in the user interface.

I have 18 images loaded.

When the app is displaying the beginning (or end) of the image series, there is bit of empty space off to one side (inside the flash app). OK so far.

If I click in that empty space, and then mouse wheel scroll all the way to the other end of the image list, the images start rapidly scrolling back and forth between the first and last image. It is like the app is stuck in a mouse wheel loop.

Clicking on an image pulls it out of the loop.

Using IE7 and a Logitech laser mouse.

[Ophelia]

Is there a reason why it is a double click and not a single click? Double clicking really isn't the norm when it comes to links, and unless there are instructions in the title to double click, folks are only going to click it once (everyone I've shown has). I would really like it to be a single click. Also, adding the ability to have square image 150x150 or 200x200 would be wonderful.

Otherwise this is EXACTLY what we need. Thank you.

[syrus.xl]

Well, I added a double-click on the images, so it would not be confused with single-clicking to move through images.

I may change the design a little in respect to the actual image sizes, but I would need to recompile the file.

I'll see what I can come up with.

[syrus.xl]

Originally Posted by YabbaDabba

I think there might be a bug in the user interface.

I have 18 images loaded.

When the app is displaying the beginning (or end) of the image series, there is bit of empty space off to one side (inside the flash app). OK so far.

If I click in that empty space, and then mouse wheel scroll all the way to the other end of the image list, the images start rapidly scrolling back and forth between the first and last image. It is like the app is stuck in a mouse wheel loop.

Clicking on an image pulls it out of the loop.

Using IE7 and a Logitech laser mouse.

I'll look into this problem, and see if I can see what you mean.