ACoin Homepage Slider Support

I am releasing a new module for everyone to use. I put it together awhile ago after not being able to find too many home sliders that I liked

ACoin Zen Cart Homepage Slider
Demo Found Here

• Professional Home Page Slider for Zen Cart
• Adjustable height and width
• Slider description on each image slider
• Multiple transition effects.
• No changes to core files

The template package can be downloaded in the Addons marketplace here:
http://www.zen-cart.com/index.php?main_page=product_contrib_info&cPath=40_47&products_id=2074

nice work.
i assume there is a administration back end to that ?
how do you add images with anchor tags ?

is it compatible for version 139h?

I recently installed this ACoin Homepage Slider, on my local server using version 150.
It was a very easy one to install, however the pictures do not show up. I am just using the classic template to see how it works. I do notice that the revolving pics are moving by seeing the small indicator gifs below where the pictures should be, moving.
The (stock) images were put into: includes/templates/classic/images
Any ideas on why everything seams to be working except the images do not show up.

In your define_main_page.php it looks like the following changes need to be made, I have submitted an update but in the mean time you can change the following

Each image file path had a "/" that should be removed at the beginning so replace this

<img src='/includes/templates/YOUR_TEMPLATE/images/slide3.jpg' >
``` with this

<img src='includes/templates/YOUR_TEMPLATE/images/slide3.jpg' > ```

On each image file path so the whole thing will look like this

<div id='coin-slider'>
    <a href="http://www.brandonturpin.com" target="_blank">
        <img src='includes/templates/YOUR_TEMPLATE/images/slide1.jpg' >
        <span>
            Description for slide1 - edit in includes > languages > english > html_includes > YOUR_TEMPLATE > define_main_page.php
        </span>
    </a>
    <a href="http://www.brandonturpin.com">
        <img src='includes/templates/YOUR_TEMPLATE/images/slide2.jpg' >
        <span>
            Description for slide2 - edit in includes > languages > english > html_includes > YOUR_TEMPLATE > define_main_page.php
        </span>
    </a>
    <a href="http://www.brandonturpin.com">
        <img src='includes/templates/YOUR_TEMPLATE/images/slide3.jpg' >
        <span>
            Description for slide3 - edit in includes > languages > english > html_includes > YOUR_TEMPLATE > define_main_page.php
        </span>
    </a>

    <a href="http://www.brandonturpin.com">
        <img src='includes/templates/YOUR_TEMPLATE/images/slide4.jpg' >
        <span>
            Description for slide4 - edit in includes > languages > english > html_includes > YOUR_TEMPLATE > define_main_page.php
        </span>
    </a>
</div>

You also want to make sure you update the YOUR_TEMPLATE to your template name in this case would be classic.

Let me know if you are able to get that fixes, sorry about the hiccup :-/

Also while looking it over I noticed that there was another update that needed to be done. Below the anchor tags on define_main_page.php ther is the JS script with the slider effects and the word height is misspelled and leading the slider to be extra tall.

change

<script type="text/javascript">
   $(document).ready(function() {
    $('#coin-slider').coinslider({ width: 500, heignt: 200, navigation: true, delay: 5000 });
    });
</script>

to

<script type="text/javascript">
   $(document).ready(function() {
    $('#coin-slider').coinslider({ width: 500, height: 200, navigation: true, delay: 5000 });
    });
</script>

tony_sar:

nice work.
i assume there is a administration back end to that ?
how do you add images with anchor tags ?

is it compatible for version 139h?

Thanks, as of right now there is not a back end and to add images you just add another anchor tag on the define_main_page.php its pretty basic right now but works

It is compatible with 1.3.x as there is no back end right now

Works perfectly with the code changes. One of the easiest addons that I worked with. Thanks.

I also noticed that I had to delete:
<span>
Description for slide4 - edit in includes > languages > english > html_includes > YOUR_TEMPLATE > define_main_page.php
</span>

Under each image so it does not show in the bottom of each image.

Maynards:

Works perfectly with the code changes. One of the easiest addons that I worked with. Thanks.

Glad that it worked for you, the sections

<span>
Description for slide4 - edit in includes > languages > english > html_includes > YOUR_TEMPLATE > define_main_page.php
</span>

are created as a description for the image, you can put any text here if you would like and it shows as a description on the slide.

WORKS GREAT "Like"

Having a little trouble with the over shadowed text line. It seems to be 5 to 10 pixels narrower than the images.

I have

    $('#coin-slider').coinslider({ width: 580, heignt: 280, navigation: true, delay: 5000 });
    });
</script><!-- Effects to place in JS above
width: 580, // width of slider panel
height: 280, // height of slider panel

Is there somewhere else that I need to adjust these widths?
JOhn ><>

:clap:

Works with 1.5.0 Too!!!
:clap:

Yeah, only one thought per post.

You might consider not overwriting the define_main_page.php I had a pretty good start on text for that page before installing.

I know, I should have had a backup, but this is a new dev site and is not ready for prime time yet.

Just a thought.
JOhn ><>
:lamo:

Stuff4Toys:

WORKS GREAT "Like"

Having a little trouble with the over shadowed text line. It seems to be 5 to 10 pixels narrower than the images.

I have

$('#coin-slider').coinslider({ width: 580, heignt: 280, navigation: true, delay: 5000 });
});

</script><!-- Effects to place in JS above
width: 580, // width of slider panel
height: 280, // height of slider panel

> Is there somewhere else that I need to adjust these widths?
> JOhn ><>
> 
> :clap:

When originally released there was a error in the code with the height of the slider, I updated it in the new release as well as a bug with the location of the images. 

But to fix it all you need to do is change

$('#coin-slider').coinslider({ width: 580, [B]heignt[/B]: 280, navigation: true, delay: 5000 });

to

$('#coin-slider').coinslider({ width: 580, [B]height[/B]: 280, navigation: true, delay: 5000 });

The error was in the spelling of height. You can customize the height and width to match the images you want to use

> You might consider not overwriting the define_main_page.php I had a pretty good start on text for that page before installing.
> 
> I know, I should have had a backup, but this is a new dev site and is not ready for prime time yet.

I appreciate your feedback, when creating it I put a note in the instructions but even thought that it may be an issue if someone did not read all the instructions. I can understand how this would be a issue and I will definitely look into just adding the code into the read_me.txt file for the next release to fix this issue. Thank you for the feedback.

I've got this up and running today and looks great. I have just 2 problems however. When loading the page, it takes at least 3 seconds before you see the slider. Prior to this, it's just text/images listed on the page. Does anyone else have this problem? Anyway around it? Also when testing in IE when you hover over the scroller, the text is all underlined? Anyway around this? Thanks

NickyCarroll:

I've got this up and running today and looks great. I have just 2 problems however. When loading the page, it takes at least 3 seconds before you see the slider. Prior to this, it's just text/images listed on the page. Does anyone else have this problem? Anyway around it?

What is the code on your define_main_page.php page? I can try and find the problem for you as this should not be an issue.

NickyCarroll:

Also when testing in IE when you hover over the scroller, the text is all underlined? Anyway around this? Thanks

Let me find a fix for this and I will get back to you on this.

That's great thanks. Below is what's on the define_main_page.

<div id='coin-slider'> <a href="http://www.birthdaycreations.co.uk/" target="_blank"> <img src='images/rollerhomepage.jpg' > <span> <h2>Party Bags</h2> We love the things that make birthday's special, so why not choose from our range of children's party bags and party bag fillers. In place of the usual plastic toys, Birthday Creations offer simple, stylish and traditional party bags and party bag filler toys, gifts and birthday decorations. </span> </a> <a href="http://www.birthdaycreations.co.uk/"> <img src='images/rollerhomepage2.jpg' > <span> <h2>Paper Party Bags</h2> Birthday Creations offer a fabulous range of coloured paper party bags. Our luxury paper bags have a matching coloured twisted paper handle. They are 100% biodegradeable and recyclable. Great for the environment!<br> </span> </a> <a href="http://www.birthdaycreations.co.uk/"> <img src='images/clownflute.jpg' > <span> <h2>Wedding Activity Party Bags</h2> A wedding activity bag is the perfect solution to keep those little hands and minds busy during the important times of a wedding. Our children’s wedding activity bags are great value and can be designed to co-ordinate with your colour scheme. </span> </a>

<a href="http://www.birthdaycreations.co.uk/">
    <img src='images/animalcompass.jpg' >
    <span>
         <h2>Party Bag Fillers</h2>
We are serious when it comes to party bags and party bag fillers. We hand 

select only the best quality products that will appeal to both children and
parents alike. We have a great range of wooden party bag toys. </span>
</a>

<a href="http://www.birthdaycreations.co.uk/"> <img src='images/animalcompass.jpg' > <span> <h2>Party Bag Ideas</h2> Less is more - Why not do something different and offer one quality party bag filler that will last and be treasured rather than thrown away! Try our range of adorable wooden party bag fillers.</a></span> </div> <p> <script type="text/javascript"> $(document).ready(function() { $('#coin-slider').coinslider({ width: 565, height: 490, navigation: true, delay: 5000, effect:'straight', hoverpause: true}); }); </script> <!-- Effects to place in JS above width: 565, // width of slider panel height: 290, // height of slider panel spw: 7, // squares per width sph: 5, // squares per height delay: 3000, // delay between images in ms sDelay: 30, // delay beetwen squares in ms opacity: 0.7, // opacity of title and navigation titleSpeed: 500, // speed of title appereance in ms effect: '', // random, swirl, rain, straight navigation: true, // prev next and buttons links : true, // show images as links hoverPause: true // pause on hover -->

NickyCarroll:

That's great thanks. Below is what's on the define_main_page.

Do you have any other .js files in your jscript folder? The script seems to be correct, one thing I have seen if someone has other .js files it interferes with it some times.

Only other .js files are to do with googleanayltics.

I think I've sorted it, but not sure why. I have removed the following code from my tpl_footer relating to a godaddy site seal and it works fine now.

<span id="siteseal"><script type="text/javascript" src="https://seal.godaddy.com/getSeal?sealID=vHpZqMYvDwyGX7XGdrs5GCML"></script><br/><a style="font-family: arial; font-size: 9px" href="https://www.godaddy.com/ssl/ssl-certificates.aspx" target="_blank">SSL certificate</a></span>

Any ideas why this would affect it?

Please help. have tried this slider same as coin slider but the images are just coming in stacked, nothing like demo. I notice in define main page the callout for the js files is missing, I put them in but no difference, please help. thanks

NickyCarroll:

I think I've sorted it, but not sure why. I have removed the following code from my tpl_footer relating to a godaddy site seal and it works fine now.

<span id="siteseal"><script type="text/javascript" src="https://seal.godaddy.com/getSeal?sealID=vHpZqMYvDwyGX7XGdrs5GCML"></script><br/><a style="font-family: arial; font-size: 9px" href="https://www.godaddy.com/ssl/ssl-certificates.aspx" target="_blank">SSL certificate</a></span>

Any ideas why this would affect it?

Apologies, I got married a few weeks back and left to the Caribbean for a few weeks for my honeymoon and got back a few days ago with a lot to catch up on.

It sounds like the javascript was interfering with the code, I can not look at the JS for the go daddy script if you can get that I could try and create a work around for you so you can have both.