Jump to content



Photo
- - - - -

jQuery Banner Rotator


  • Please log in to reply
156 replies to this topic

#1   kymation

kymation

    Code Monkey

  • Community Sponsor
  • 8,296 posts
  • Real Name:Jim Keebaugh
  • Gender:Male
  • Location:Aberdeen WA USA

Posted 28 June 2010 - 02:36

This addon provides an automated banner rotator using banners loaded by the stock osCommerce banner manager. Banners are displayed for a specified time before fading to the next banner. There is a control panel (bottom right of the banners, but repositionable) that stops and restarts the rotation as well as allowing the selection of individual banners. There is no limit to the number of banners that can be rotated. Banner size is adjustable in the stylesheet. Each banner can link to any osCommerce page, and Title/Alt text can be added individually.

Code is here.

Edited by kymation, 28 June 2010 - 02:39.

My Addons

Banners Box Download Support
Categories Accordion Box Download Support
Closest Shipper 2.2x Support
Document Manager 2.2x Support
Generic Box Download Support
Get 1 Free 2.2x Support
Modular Front Page Download Support
Modular SEO Header Tags Download Support
MVS 2.2x Support
PDF Datasheet Download Support
Price in Cart Only/MAPP Download Support
Price Updater 2.2x
Products Specifications 2.3.x Development Version Support Bugs/Suggestions
Request a Review Download Support
Shopping List Download Support New!
Specials Image Overlay Download Support
Superfish Categories Box Download Support
Theme Switcher 2.3+ Support  Updated


#2   bruyndoncx

bruyndoncx

    osCommerce Teenager

  • Members
  • 3,164 posts
  • Real Name:Carine Bruyndoncx
  • Gender:Female
  • Location:Belgium/ Antwerp/ Turnhout/ Arendonk

Posted 28 June 2010 - 11:40

Hi Jim,

Thanks for the contribution, I was just checking the contributions yesterday for such a script ... great timing !

I have a multi-lingual site, and have banners in different groups per language.
Your contribution really lays out the basics but I'd need to modify it to allow for different banner groups.

Do you have a particular view on how it is best to go about this ?
Don't just sit there - contribute to the responsive bootstrap community effort !
http://forums.oscomm...iew__getnewpost


Hava a nice day !
Carine Bruyndoncx


Seen anything good relevant on the net about responsive design for ecommerce ?
You might as well post it in my responsive liive shop review thread .

#3   kymation

kymation

    Code Monkey

  • Community Sponsor
  • 8,296 posts
  • Real Name:Jim Keebaugh
  • Gender:Male
  • Location:Aberdeen WA USA

Posted 28 June 2010 - 15:15

I would modify the osCommerce Banner Manager to allow for languages. You'll need a languages_id column in the banners database table to set the language. Then just add the check for that field to all the queries that fetch banners.

Regards
Jim

My Addons

Banners Box Download Support
Categories Accordion Box Download Support
Closest Shipper 2.2x Support
Document Manager 2.2x Support
Generic Box Download Support
Get 1 Free 2.2x Support
Modular Front Page Download Support
Modular SEO Header Tags Download Support
MVS 2.2x Support
PDF Datasheet Download Support
Price in Cart Only/MAPP Download Support
Price Updater 2.2x
Products Specifications 2.3.x Development Version Support Bugs/Suggestions
Request a Review Download Support
Shopping List Download Support New!
Specials Image Overlay Download Support
Superfish Categories Box Download Support
Theme Switcher 2.3+ Support  Updated


#4   bruyndoncx

bruyndoncx

    osCommerce Teenager

  • Members
  • 3,164 posts
  • Real Name:Carine Bruyndoncx
  • Gender:Female
  • Location:Belgium/ Antwerp/ Turnhout/ Arendonk

Posted 28 June 2010 - 15:39

ofcourse, you are correct, that is the proper way to do it.

Carine
Don't just sit there - contribute to the responsive bootstrap community effort !
http://forums.oscomm...iew__getnewpost


Hava a nice day !
Carine Bruyndoncx


Seen anything good relevant on the net about responsive design for ecommerce ?
You might as well post it in my responsive liive shop review thread .

#5   kymation

kymation

    Code Monkey

  • Community Sponsor
  • 8,296 posts
  • Real Name:Jim Keebaugh
  • Gender:Male
  • Location:Aberdeen WA USA

Posted 28 June 2010 - 23:39

I've uploaded Version 1.1 to the Addons section. This fixes the missing display and click counts for the banners used by the rotator, and includes the file missing from the first version.

It also now includes language-dependent banners as suggested by Carine. This latter is really an osCommerce bug. Somebody needs to fix this in the core code. Ah well.

Regards
Jim

My Addons

Banners Box Download Support
Categories Accordion Box Download Support
Closest Shipper 2.2x Support
Document Manager 2.2x Support
Generic Box Download Support
Get 1 Free 2.2x Support
Modular Front Page Download Support
Modular SEO Header Tags Download Support
MVS 2.2x Support
PDF Datasheet Download Support
Price in Cart Only/MAPP Download Support
Price Updater 2.2x
Products Specifications 2.3.x Development Version Support Bugs/Suggestions
Request a Review Download Support
Shopping List Download Support New!
Specials Image Overlay Download Support
Superfish Categories Box Download Support
Theme Switcher 2.3+ Support  Updated


#6   2fix4u

2fix4u
  • Members
  • 77 posts
  • Real Name:Harry
  • Gender:Male
  • Location:EU

Posted 29 June 2010 - 10:43

I've uploaded Version 1.1 to the Addons section. This fixes the missing display and click counts for the banners used by the rotator, and includes the file missing from the first version.

It also now includes language-dependent banners as suggested by Carine. This latter is really an osCommerce bug. Somebody needs to fix this in the core code. Ah well.

Regards
Jim


Thanks for that.
got some Problems with this contrib.
Unfortunately the rotator will not be displayed, the only thing displayed is the small "transBlack75.png". Perhaps some jQuery probs?!
BTW the function
tep_update_banner_display_count( $banner['banners_id'] );
causes errors too.

Any ideas?
Thanks
Harry

#7   kymation

kymation

    Code Monkey

  • Community Sponsor
  • 8,296 posts
  • Real Name:Jim Keebaugh
  • Gender:Male
  • Location:Aberdeen WA USA

Posted 29 June 2010 - 18:28

What errors? I'm not psychic.

Regards
Jim

My Addons

Banners Box Download Support
Categories Accordion Box Download Support
Closest Shipper 2.2x Support
Document Manager 2.2x Support
Generic Box Download Support
Get 1 Free 2.2x Support
Modular Front Page Download Support
Modular SEO Header Tags Download Support
MVS 2.2x Support
PDF Datasheet Download Support
Price in Cart Only/MAPP Download Support
Price Updater 2.2x
Products Specifications 2.3.x Development Version Support Bugs/Suggestions
Request a Review Download Support
Shopping List Download Support New!
Specials Image Overlay Download Support
Superfish Categories Box Download Support
Theme Switcher 2.3+ Support  Updated


#8   2fix4u

2fix4u
  • Members
  • 77 posts
  • Real Name:Harry
  • Gender:Male
  • Location:EU

Posted 30 June 2010 - 08:13

What errors? I'm not psychic.

Regards
Jim

No errors are displayed, only the page stop's loading at that point.
Normal page loading after commenting out that line, but still the display Problem mentioned above.

Regards
Harry

#9   kymation

kymation

    Code Monkey

  • Community Sponsor
  • 8,296 posts
  • Real Name:Jim Keebaugh
  • Gender:Male
  • Location:Aberdeen WA USA

Posted 30 June 2010 - 17:36

Then look in your server's error logs for the error message, or change the level of error reporting in application_top.php to error_reporting (E_ALL);. You can also install the KISS Error Handling & Debugging Addon to get even more information.

This code has all been tested and proven working on my server, so I can't do anything without some information on why it's failing on yours.

Regards
Jim

My Addons

Banners Box Download Support
Categories Accordion Box Download Support
Closest Shipper 2.2x Support
Document Manager 2.2x Support
Generic Box Download Support
Get 1 Free 2.2x Support
Modular Front Page Download Support
Modular SEO Header Tags Download Support
MVS 2.2x Support
PDF Datasheet Download Support
Price in Cart Only/MAPP Download Support
Price Updater 2.2x
Products Specifications 2.3.x Development Version Support Bugs/Suggestions
Request a Review Download Support
Shopping List Download Support New!
Specials Image Overlay Download Support
Superfish Categories Box Download Support
Theme Switcher 2.3+ Support  Updated


#10   2fix4u

2fix4u
  • Members
  • 77 posts
  • Real Name:Harry
  • Gender:Male
  • Location:EU

Posted 01 July 2010 - 05:22

Then look in your server's error logs for the error message, or change the level of error reporting in application_top.php to error_reporting (E_ALL);. You can also install the KISS Error Handling & Debugging Addon to get even more information.

This code has all been tested and proven working on my server, so I can't do anything without some information on why it's failing on yours.

Regards
Jim

Sorry /whistling.gif' class='bbc_emoticon' alt=':-"' /> , problem solved, have forgotten that i have disabled, long time ago, the Banners completely by commenting out the lines in aplication_top.php
require(DIR_WS_FUNCTIONS . 'banner.php');
  tep_activate_banners();
  tep_expire_banners();

But the rotator will still not be displayed, here is a screenshot:
[img]http://www.insidehobby.de/images/screenshot.png[/img]

#11   2fix4u

2fix4u
  • Members
  • 77 posts
  • Real Name:Harry
  • Gender:Male
  • Location:EU

Posted 01 July 2010 - 05:40

Problem completely solved with:
jQuery.noConflict();


#12   kymation

kymation

    Code Monkey

  • Community Sponsor
  • 8,296 posts
  • Real Name:Jim Keebaugh
  • Gender:Male
  • Location:Aberdeen WA USA

Posted 01 July 2010 - 05:40

Beat me to it. Thanks for posting the fix; maybe that will help someone else with the same problem.

Regards
Jim

Edited by kymation, 01 July 2010 - 05:42.

My Addons

Banners Box Download Support
Categories Accordion Box Download Support
Closest Shipper 2.2x Support
Document Manager 2.2x Support
Generic Box Download Support
Get 1 Free 2.2x Support
Modular Front Page Download Support
Modular SEO Header Tags Download Support
MVS 2.2x Support
PDF Datasheet Download Support
Price in Cart Only/MAPP Download Support
Price Updater 2.2x
Products Specifications 2.3.x Development Version Support Bugs/Suggestions
Request a Review Download Support
Shopping List Download Support New!
Specials Image Overlay Download Support
Superfish Categories Box Download Support
Theme Switcher 2.3+ Support  Updated


#13   zediks

zediks
  • Members
  • 10 posts
  • Real Name:alex

Posted 01 July 2010 - 14:38

I can see the banner rotator in my admin
I added banners to banner manager, but the banners don't show up in the index

Modifications I ve made manually (I have modified files)

Filesnames - check

added define( 'FILENAME_BANNER_ROTATOR', 'banner_rotator.php' );

index - check
addes: (between the head tags)
<?php // Start Banner Rotator; ?>
<script type="text/javascript" src="includes/functions/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="includes/functions/bannerRotator.js"></script>
<script type="text/javascript">
$(document).ready(function(){
bannerRotator('#bannerRotator', 500, 4000);
});
</script>
<?php // End Banner Rotator; ?>

--------------- and INSERT Before <?php include(DIR_WS_MODULES . FILENAME_NEW_PRODUCTS); ?>----------------
<?php include( DIR_WS_MODULES . FILENAME_BANNER_ROTATOR ); ?>


I had problems with the Sql injection tough so I renamed the numbers

(168, 'Banner Order', 'BANNER_ORDER', 'banners_id', 'Order that the Banner Rotator uses to show the banners.', 1661, 10, NULL, '2010-06-25 17:25:11', NULL, 'tep_cfg_select_option(array(''banners_id'', ''rand()''), '),
(169, 'Banner Rotator Group', 'BANNER_ROTATOR_GROUP', 'rotator', 'Name of the banner group that the Banner Rotator uses to show the banners.', 1661, 5, NULL, '2010-06-25 17:25:11', NULL, ''),
(170, 'Banner Rotator Max Banners', 'MAX_DISPLAY_BANNER_ROTATOR', '4', 'Maximum number of banners that the Banner Rotator will show', 1661, 15, '2010-06-27 01:38:54', '2010-06-25 17:25:11', NULL, '');


to

(268, 'Banner Order', 'BANNER_ORDER', 'banners_id', 'Order that the Banner Rotator uses to show the banners.', 1661, 10, NULL, '2010-06-25 17:25:11', NULL, 'tep_cfg_select_option(array(''banners_id'', ''rand()''), '),
(269, 'Banner Rotator Group', 'BANNER_ROTATOR_GROUP', 'rotator', 'Name of the banner group that the Banner Rotator uses to show the banners.', 1661, 5, NULL, '2010-06-25 17:25:11', NULL, ''),
(270, 'Banner Rotator Max Banners', 'MAX_DISPLAY_BANNER_ROTATOR', '4', 'Maximum number of banners that the Banner Rotator will show', 1661, 15, '2010-06-27 01:38:54', '2010-06-25 17:25:11', NULL, '');


also added to stylesheet.css

/* Start Banner Rotator */
#bannerRotator {
width: 468px; /* Banner width */
height: 50px; /* Banner height */
overflow: hidden;
position: relative;
}

#bannerRotator ul {
list-style: none;
padding: 0;
position: relative;
}

#bannerRotator ul li {
display: none;
width: 728px; /* Banner width */
height: 90px; /* Banner height */
position: absolute;
top: 0px;
left: 0px;
}

#bannerNav {
position: absolute;
right: 15px; /* Distance from the right side of the controls box to the right edge of the banner */
bottom: 15px; /* Distance from the bottom of the controls box to the bottom of the banner */
background: url(images/icons/transBlack75.png) repeat 0 0; /* Controls box background image */
padding: 5px 5px 5px 10px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}

#bannerNav a {
margin: 3px 10px 0 0 ;
height: 10px;
width: 10px;
display: block;
background: url(images/icons/dotDark.png) no-repeat 0 0; /* Controls Button image (Inactive) */
float: left;
}

#bannerNav a.active {
background-image: url(images/icons/dotLight.png); /* Controls Button image (Active) */
}

#bannerNav span.pause, #bannerNav span.play {
cursor: pointer;
height: 15px;
width: 15px;
display: block;
background: url(images/icons/pause.png) no-repeat 0 0; /* Controls Pause icon */
float: left;
}

#bannerNav span.play {
background-image: url(images/icons/play.png); /* Controls Play icon */
}

.divider-tall {
clear: both;
height: 13px;
}
/* End Banner Rotator */


Edited by zediks, 01 July 2010 - 14:40.


#14   kymation

kymation

    Code Monkey

  • Community Sponsor
  • 8,296 posts
  • Real Name:Jim Keebaugh
  • Gender:Male
  • Location:Aberdeen WA USA

Posted 01 July 2010 - 16:16

Did you upload the Javascript files to the correct location? Did you also upload the image files? Also, the location that you pasted the include() code in index.php may not work. Try putting it where it is in the distribution and see if it works there before moving it where you want it to be.

Regards
Jim

My Addons

Banners Box Download Support
Categories Accordion Box Download Support
Closest Shipper 2.2x Support
Document Manager 2.2x Support
Generic Box Download Support
Get 1 Free 2.2x Support
Modular Front Page Download Support
Modular SEO Header Tags Download Support
MVS 2.2x Support
PDF Datasheet Download Support
Price in Cart Only/MAPP Download Support
Price Updater 2.2x
Products Specifications 2.3.x Development Version Support Bugs/Suggestions
Request a Review Download Support
Shopping List Download Support New!
Specials Image Overlay Download Support
Superfish Categories Box Download Support
Theme Switcher 2.3+ Support  Updated


#15   zediks

zediks
  • Members
  • 10 posts
  • Real Name:alex

Posted 01 July 2010 - 16:46

I drag and dropped the catalog folder directly to my root

as for the include it's hard to say because my index doesn't look the same at all the in the distro

#16   kymation

kymation

    Code Monkey

  • Community Sponsor
  • 8,296 posts
  • Real Name:Jim Keebaugh
  • Gender:Male
  • Location:Aberdeen WA USA

Posted 01 July 2010 - 16:49

Are you certain that you have osCommerce 2.2RC2a? Are you using a third-party template?

Regards
Jim

My Addons

Banners Box Download Support
Categories Accordion Box Download Support
Closest Shipper 2.2x Support
Document Manager 2.2x Support
Generic Box Download Support
Get 1 Free 2.2x Support
Modular Front Page Download Support
Modular SEO Header Tags Download Support
MVS 2.2x Support
PDF Datasheet Download Support
Price in Cart Only/MAPP Download Support
Price Updater 2.2x
Products Specifications 2.3.x Development Version Support Bugs/Suggestions
Request a Review Download Support
Shopping List Download Support New!
Specials Image Overlay Download Support
Superfish Categories Box Download Support
Theme Switcher 2.3+ Support  Updated


#17   zediks

zediks
  • Members
  • 10 posts
  • Real Name:alex

Posted 01 July 2010 - 16:51

would it work if I enable the javascript section

<?php // Start Banner Rotator; ?>
<script type="text/javascript" src="includes/functions/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="includes/functions/bannerRotator.js"></script>
<script type="text/javascript">
$(document).ready(function(){
bannerRotator('#bannerRotator', 500, 4000);
});
</script>
<?php // End Banner Rotator; ?>


in the header?

#18   zediks

zediks
  • Members
  • 10 posts
  • Real Name:alex

Posted 01 July 2010 - 16:51

2.2 and indeed 3th party temp

FYI shop.thevine.be

Edited by zediks, 01 July 2010 - 16:52.


#19   kymation

kymation

    Code Monkey

  • Community Sponsor
  • 8,296 posts
  • Real Name:Jim Keebaugh
  • Gender:Male
  • Location:Aberdeen WA USA

Posted 01 July 2010 - 17:03

The Javascript references in the header must be there and must be enabled. It appears that your template is using frames. This is not recommended for a variety of reasons. You will need to put the Javascript references in the head of the frame page that contains your banner rotator.

Regards
Jim

My Addons

Banners Box Download Support
Categories Accordion Box Download Support
Closest Shipper 2.2x Support
Document Manager 2.2x Support
Generic Box Download Support
Get 1 Free 2.2x Support
Modular Front Page Download Support
Modular SEO Header Tags Download Support
MVS 2.2x Support
PDF Datasheet Download Support
Price in Cart Only/MAPP Download Support
Price Updater 2.2x
Products Specifications 2.3.x Development Version Support Bugs/Suggestions
Request a Review Download Support
Shopping List Download Support New!
Specials Image Overlay Download Support
Superfish Categories Box Download Support
Theme Switcher 2.3+ Support  Updated


#20   zediks

zediks
  • Members
  • 10 posts
  • Real Name:alex

Posted 01 July 2010 - 17:16

that would be the index then
This is why I placed the include in the index.php file because I wanted it above the new products frame



<?php include( DIR_WS_MODULES . FILENAME_BANNER_ROTATOR ); ?>
<?php include(DIR_WS_MODULES . FILENAME_NEW_PRODUCTS); ?>

and placed the java in the head