Kryptronic Software Support Forum

You are viewing this forum as a guest. Login to an existing account, or create a new account, to reply to topics and to create new topics.

#1 10-24-2003 10:33:01

shibumik
Member
Registered: 10-19-2003
Posts: 216
Website

Variable Image Display On Your Storefront...

Customers are inherently lazy. That is why I like to deliver important information to them without using annoying popups and within the content of what they are doing. I do it by to rotating an image on my storefont when customers visit.

Here is a quick script that allows you to display a number of images on your storefront to engage the customer. Everytime the page refreshes, the next image is displayed, We use this to tell our customers about new products randomly when they come to our site.

I use it in CCP5, but Tiki should be the same. I installed in in my Page, but you can put it anywhere.

Copy this javascript code to your element:

################################################
## Below is where you will edit the paths to your images to be rotated
## You can add as many as you wish providing you follow the images[x]
## protocol.
################################################
################################################
# End Edit
################################################</span>



Calling Your Images

Insert this code into your element where you want it called:


That's it. This simple script does not offer image control for size or links, but it is an effective way to engage your customers and can be extended if you so require.

Enjoy!
Kevin



Offline

 

#2 10-26-2003 17:46:59

thekiko
Member
Registered: 07-11-2002
Posts: 126

Re: Variable Image Display On Your Storefront...

Can you give us a link to an example of this mod?

Thanks!


TheKiko

Offline

 

#3 10-26-2003 18:03:43

shibumik
Member
Registered: 10-19-2003
Posts: 216
Website

Re: Variable Image Display On Your Storefront...

Sure thekiko:



Just refresh the screen and you will see what I did.

Hope this helps,
Kevin



Offline

 

#4 11-06-2003 21:24:55

thekiko
Member
Registered: 07-11-2002
Posts: 126

Re: Variable Image Display On Your Storefront...

Thanks for this little script Kevin.  I have implemented it on my splash page here .  Is there anyway to edit this script to display in order of "images[$]" listed rather than randomly?

Thanks again,
TheKiko


TheKiko

Offline

 

#5 11-06-2003 23:31:45

shibumik
Member
Registered: 10-19-2003
Posts: 216
Website

Re: Variable Image Display On Your Storefront...

Hi Thekiko:

Your site looks great - nice job and glad to see the script works well for you.

Regarding a "progressive" image display, there are probably many other ways to do it but the one thing you must do is to store the last image name from the array image[x], or even $ that was displayed in order to increment properly on the user's computer or in local memory. The script is independent of storage which is why I went random.

To store image[x], or $ for that matter, I would write a cookie to the user's system to track the last image displayed and call and read that cookie everytime the display refreshes to keep track, depending on your application.

Now Nick undoubtedly would have a suggestion here - he always does. I am far more limited in javascript.

BTW: What application did you have in mind? There may be another way to accomplish it if it does not require a refresh.

Thanks,
Kevin 



Offline

 

#6 01-09-2004 17:04:48

sgreiner
Member
Registered: 07-26-2003
Posts: 78

Re: Variable Image Display On Your Storefront...

For us Java impaired peeps, what do I need to do so the images stay random, but they fade out and change images without having to refresh the page. Basically make it a slideshow. Great for advertising logos of the brands I carry. 


Scott

Offline

 

#7 01-09-2004 18:34:54

shibumik
Member
Registered: 10-19-2003
Posts: 216
Website

Re: Variable Image Display On Your Storefront...

Sgreiner...

Here is a quick script that displays images, links and comments. I did not add the Border and Size tags, but they are simply HTML code in the image strings.

This one does not fade in and out, but it does rotate images using an interval specified by you in milliseconds. Watch your syntax here. Hope this helps.

The way this is coded you should be able to paste it into FP or whaever HTML editor you have and give it a try.

Hope this helps,
Kevin

*******************************************************************

<html>

<head>
<title>Test Page 1</title>

<!-- PUT THIS IN THE HEAD OF YOUR DOCUMENT -->

<script language="JavaScript"><!--
function rand_number(n)
{
    var x;
    x=Math.round(Math.random()*100);
    x%=n;
    return x;
}

function rotate_images()
{
    var i;
<!-- INTERVAL IN MILLISECONDS. 5000 = 5 SECONDS... -->
    var interval=5000;
    var img=new Array();
<!-- IMAGES AND LINKS HERE - ALL HTML OK-->
    img[0]='<a href="http://www.riverbendresearch.com/cgi-bin/cp-app.cgi?pg=cat&ref=RBRDSS"><img src="http://www.riverbendresearch.com/media/images/store/xwelcome2.jpg" alt="Welcome to image 1"></a>';
    img[1]='<a href="http://www.riverbendresearch.com/cgi-bin/cp-app.cgi?pg=cat&ref=OCEANIS"><img src="http://www.riverbendresearch.com/media/images/store/xwelcome1.jpg" alt="Welcome to image 2"></a>';
    img[2]='<a href="http://www.riverbendresearch.com/cgi-bin/cp-app.cgi?pg=cat&ref=RBRDSS"><img src="http://www.riverbendresearch.com/media/images/store/xwelcome3.jpg" alt="Welcome to image 3"></a>';

<!-- HOW MANY IMAGES? -->
    var total_images=3;
    var i=rand_number(total_images);
    rotate.innerHTML=img[i];
    setTimeout("rotate_images()",interval);
}
//-->
</script>
</head>

<!-- CHANGE YOUR BODY TAG HERE... -->
<body onLoad="rotate_images();">

<!-- In the your body of your page wherever you want to rotate a banner...-->
<!-- Replace your body tag with <body> ...-->
<!-- Place this in your body where you want to place your image...-->

<div id="rotate"></div>

</body>
</html>



Offline

 

#8 01-09-2004 22:21:08

sgreiner
Member
Registered: 07-26-2003
Posts: 78

Re: Variable Image Display On Your Storefront...

Thanks.  Works like a champ on my test site.  Thanks for all the comments in the code... that is extremely helpful.  Now for another question... I may want to change it from being random to an ordered display.  This question was asked earlier in this thread but I cant work your answer into this example. Is this something you can do?


Scott

Offline

 

#9 01-10-2004 23:58:33

shibumik
Member
Registered: 10-19-2003
Posts: 216
Website

Re: Variable Image Display On Your Storefront...

Got it!

OK, here is the code. It allows you to specify the number of milliseconds between image refreshes (no page refresh required). It rotates images in a SEQUENTIAL manner - NOT RANDOM.

Here is the rub on transitions. I could write a MSIE transition to blend, but it would not work on NS. Since I do not desire to learn the NS code (sorry, am IE bigot, I know), this is all that is left to be done to make this code perfect. However, I think it is pretty good as is.

I have noted the code below for clarity and the images and links are good for my site so you can run it in FrontPage, or whatever editor you have as long as you are online.

Hope this helps,
Kevin


############ CODE FOLLOWS ##########################

<html>

<head>
<title>Test Page 1</title>




</head>






</body>
</html>



Offline

 

#10 09-10-2005 12:14:16

rushjc
Member
From: Atlanta, GA
Registered: 03-06-2004
Posts: 64

Re: Variable Image Display On Your Storefront...

Does anyone have this mod (either progressive or random) active on their site splash page?  I'd love to see your code to see where you put what.

I've tried inserting the code on mine and have had no luck with the ways I've tried to do it.  I only have basic knowledge, but can usually figure out how to apply mods.  This one's got me though.

If anyone would want to suggest what goes where based on my site's layout, the site is wwwsweetestsentiments.com

Thanks!

Jeremy

Offline

 

#11 09-10-2005 15:29:44

steveblueradio
Member
From: Belfast, Northern Ireland
Registered: 06-28-2004
Posts: 755
Website

Re: Variable Image Display On Your Storefront...

Hi Jeremy ,

Sorry to hear your having troble with this hack, I tried a few of these as we, in the end i just decided to use the built-in banner rotator within CCP5.1, i just pasted the following into where i wanted to show and rotate the banners;

Code:

(CGIGET TYPE="SUB" VALUE="ste_exec_banner" PARAMS="1")

Hope that helps any..... ;-)

Cheers
Steve


I'm Gene Hunt, Your DCI, And it's 1973, Nearly Dinner Time, I'm havin hoops........

Cheers,
Steve
-------------------

Offline

 

Board footer