Kryptronic Software Support Forum

Christophers Kit · 11-02-2011 16:24:04

Hello

I'm interested if anyone has managed to install a decent image scroller on the splash page.

If you have I would like to see it and know how its done. I have looked at many Java scripts but not sure how to implement.

any help appreciated.

Thanks

geraldz · 11-02-2011 18:56:15

Yup, I've got one. Check it out: http://snakeclamp.com/store.php

I use the jQuery Nivo Slider. It's free. You have to insert code into your css file, your page html, and the skin.php file:

http://nivo.dev7studios.com/demos/

Christophers Kit · 11-03-2011 05:07:52

Okay the slider looks great just what I'm looking for.

Could you expand a little on how to install the code..

Many Thanks

Christophers Kit · 11-03-2011 07:38:44

Okay slightly more advanced, I have purchased a slider and set it up here http://www.christopherskit.biz/index.html

However I would like to insert this into the splash page of my store can anyone guide me to the correct procedure please

Thanks in advance,

geraldz · 11-03-2011 08:17:28

Put this part in the "Head Section" of you CCP by inserting into your skin.php file:

<script type="text/javascript" src="engine1/jquery.js"></script>

<script type="text/javascript" src="engine1/wowslider.js"></script>

Note that the actual js files must reside in the directories that you show, i.e. /engine1/jquery.js

You can copy and paste the CSS code from style.css into your existing css file. That way you only have one css file. Otherwise you will have to include this in your head section as well:

<link rel="stylesheet" type="text/css" href="engine1/style.css"/>

Lastly, just insert the slider code into CCP for the page that you want the slider:



<div id="wowslider-container1">

<div class="ws_images">
<span><img src="data1/images/2.jpg" alt="2" title="2" id="wows0"/></span>
<span><img src="data1/images/20.jpg" alt="20" title="20" id="wows1"/></span>
<span><img src="data1/images/3.jpg" alt="3" title="3" id="wows2"/></span>
<span><img src="data1/images/6.jpg__effected.jpg" alt="6.jpg__effected" title="6.jpg__effected" id="wows3"/></span>
<span><img src="data1/images/colette1.jpg" alt="colette1" title="colette1" id="wows4"/></span>
<span><img src="data1/images/k1.jpg_effected.jpg" alt="k1.jpg_effected" title="k1.jpg_effected" id="wows5"/></span>
<span><img src="data1/images/k2.jpg_effected.jpg" alt="k2.jpg_effected" title="k2.jpg_effected" id="wows6"/></span>
<span><img src="data1/images/k3.jpg" alt="k3" title="k3" id="wows7"/></span>
<span><img src="data1/images/k4.jpg_effected.jpg" alt="k4.jpg_effected" title="k4.jpg_effected" id="wows8"/></span>
<span><img src="data1/images/k5.jpg_effected.jpg" alt="k5.jpg_effected" title="k5.jpg_effected" id="wows9"/></span>
<span><img src="data1/images/k7.jpg" alt="k7" title="k7" id="wows10"/></span>
<span><img src="data1/images/k7.jpg_effected.jpg" alt="k7.jpg_effected" title="k7.jpg_effected" id="wows11"/></span>
<span><img src="data1/images/k8.jpg_effected.jpg" alt="k8.jpg_effected" title="k8.jpg_effected" id="wows12"/></span>
<span><img src="data1/images/k9.jpg" alt="k9" title="k9" id="wows13"/></span>
<span><img src="data1/images/s102.jpg_effected.jpg" alt="s102.jpg_effected" title="s102.jpg_effected" id="wows14"/></span>
<span><img src="data1/images/s108.jpg_effected.jpg" alt="s108.jpg_effected" title="s108.jpg_effected" id="wows15"/></span>
<span><img src="data1/images/s21.jpg_effected.jpg" alt="s21.jpg_effected" title="s21.jpg_effected" id="wows16"/></span>
<span><img src="data1/images/s22.jpg_effected.jpg" alt="s22.jpg_effected" title="s22.jpg_effected" id="wows17"/></span>
<span><img src="data1/images/s37a.jpg_effected.jpg" alt="s37a.jpg_effected" title="s37a.jpg_effected" id="wows18"/></span>
<span><img src="data1/images/s46.jpg_effected.jpg" alt="s46.jpg_effected" title="s46.jpg_effected" id="wows19"/></span>
<span><img src="data1/images/s47.jpg_effected.jpg" alt="s47.jpg_effected" title="s47.jpg_effected" id="wows20"/></span>
<span><img src="data1/images/s50.jpg_effected.jpg" alt="s50.jpg_effected" title="s50.jpg_effected" id="wows21"/></span>
<span><img src="data1/images/s53.jpg_effected.jpg" alt="s53.jpg_effected" title="s53.jpg_effected" id="wows22"/></span>
<span><img src="data1/images/s64.jpg_effected.jpg" alt="s64.jpg_effected" title="s64.jpg_effected" id="wows23"/></span>
<span><img src="data1/images/s69.jpg_effected.jpg" alt="s69.jpg_effected" title="s69.jpg_effected" id="wows24"/></span>
<span><img src="data1/images/s87.jpg" alt="s87" title="s87" id="wows25"/></span>
</div>
<div class="ws_bullets"><div>
<a href="#wows0" title="2"><img src="data1/tooltips/2.jpg" alt="2"/>1</a>
<a href="#wows1" title="20"><img src="data1/tooltips/20.jpg" alt="20"/>2</a>
<a href="#wows2" title="3"><img src="data1/tooltips/3.jpg" alt="3"/>3</a>
<a href="#wows3" title="6.jpg__effected"><img src="data1/tooltips/6.jpg__effected.jpg" alt="6.jpg__effected"/>4</a>
<a href="#wows4" title="colette1"><img src="data1/tooltips/colette1.jpg" alt="colette1"/>5</a>
<a href="#wows5" title="k1.jpg_effected"><img src="data1/tooltips/k1.jpg_effected.jpg" alt="k1.jpg_effected"/>6</a>
<a href="#wows6" title="k2.jpg_effected"><img src="data1/tooltips/k2.jpg_effected.jpg" alt="k2.jpg_effected"/>7</a>
<a href="#wows7" title="k3"><img src="data1/tooltips/k3.jpg" alt="k3"/>8</a>
<a href="#wows8" title="k4.jpg_effected"><img src="data1/tooltips/k4.jpg_effected.jpg" alt="k4.jpg_effected"/>9</a>
<a href="#wows9" title="k5.jpg_effected"><img src="data1/tooltips/k5.jpg_effected.jpg" alt="k5.jpg_effected"/>10</a>
<a href="#wows10" title="k7"><img src="data1/tooltips/k7.jpg" alt="k7"/>11</a>
<a href="#wows11" title="k7.jpg_effected"><img src="data1/tooltips/k7.jpg_effected.jpg" alt="k7.jpg_effected"/>12</a>
<a href="#wows12" title="k8.jpg_effected"><img src="data1/tooltips/k8.jpg_effected.jpg" alt="k8.jpg_effected"/>13</a>
<a href="#wows13" title="k9"><img src="data1/tooltips/k9.jpg" alt="k9"/>14</a>
<a href="#wows14" title="s102.jpg_effected"><img src="data1/tooltips/s102.jpg_effected.jpg" alt="s102.jpg_effected"/>15</a>
<a href="#wows15" title="s108.jpg_effected"><img src="data1/tooltips/s108.jpg_effected.jpg" alt="s108.jpg_effected"/>16</a>
<a href="#wows16" title="s21.jpg_effected"><img src="data1/tooltips/s21.jpg_effected.jpg" alt="s21.jpg_effected"/>17</a>
<a href="#wows17" title="s22.jpg_effected"><img src="data1/tooltips/s22.jpg_effected.jpg" alt="s22.jpg_effected"/>18</a>
<a href="#wows18" title="s37a.jpg_effected"><img src="data1/tooltips/s37a.jpg_effected.jpg" alt="s37a.jpg_effected"/>19</a>
<a href="#wows19" title="s46.jpg_effected"><img src="data1/tooltips/s46.jpg_effected.jpg" alt="s46.jpg_effected"/>20</a>
<a href="#wows20" title="s47.jpg_effected"><img src="data1/tooltips/s47.jpg_effected.jpg" alt="s47.jpg_effected"/>21</a>
<a href="#wows21" title="s50.jpg_effected"><img src="data1/tooltips/s50.jpg_effected.jpg" alt="s50.jpg_effected"/>22</a>
<a href="#wows22" title="s53.jpg_effected"><img src="data1/tooltips/s53.jpg_effected.jpg" alt="s53.jpg_effected"/>23</a>
<a href="#wows23" title="s64.jpg_effected"><img src="data1/tooltips/s64.jpg_effected.jpg" alt="s64.jpg_effected"/>24</a>
<a href="#wows24" title="s69.jpg_effected"><img src="data1/tooltips/s69.jpg_effected.jpg" alt="s69.jpg_effected"/>25</a>
<a href="#wows25" title="s87"><img src="data1/tooltips/s87.jpg" alt="s87"/>26</a>
</div></div>
<a style="display:none" href="http://wowslider.com">Horizontal Image Slider jQuery by WOWSlider.com v2.0</a>

<div class="ws_shadow"></div>

</div>

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

Christophers Kit · 11-03-2011 08:35:59

Hello

Okay I tried this and failed miserably, I am a newbie to this and not to great at placing code in the cart, It has taken me ages to where it is far. I am keen to get this placed could I be a real pain and ask you to explain again to a complete novice.

Many Thanks again

Christophers Kit · 11-03-2011 08:47:01

Okay update my mistake folders in wrong location ooppss

Works a treat check it here http://www.christopherskit.biz/store

Thank you so much for your help well appreciated.

By the way your snake holders are great excellent idea

geraldz · 11-03-2011 15:04:51

Looks good! I would just remove that "Home" label to the top and right of your slideshow. You can do this just on the splash page by selecting "false" for "Page Title Display" at:

System Dashboard > Website > Content > Webpages

JayCR48 · 11-03-2011 15:26:37

Good Job!

geraldz · 11-04-2011 16:48:31

@Christophers Kit - I don't understand why you have an index page that makes the visitor "click here to enter the store." I'd recommend making your store/index.php your index page. You can do that by inserting this code into your .htaccess file:

DirectoryIndex /store/index.php

This sets the above page as your landing page.

Last edited by geraldz (11-04-2011 16:48:55)

Christophers Kit · 11-04-2011 17:12:09

Hi

Thanks for pointing that out, tried that and it doesn't change it,

It has always been like this since the installation by Kryptronic maybe somebody could shed some light on this and why.

Many Thanks

geraldz · 11-04-2011 21:30:30

I see the problem, you have two different domain names: .com and .biz.

You may be able redirect your .com domain to your .biz domain via your website host's control panel. If not, you can redirect any .com visitors to your .biz website with this code installed in the .htaccess file in the root directory of your .com domain:

Redirect 301 / http://www.christopherskit.biz/store/

If someone were to go to http://www.christopherskit.biz they would not find your store either. So you can add this to the .htaccess file in the root directory of your .biz domain:

Redirect /index.html http://www.christopherskit.biz/store/

Hope this works!

Kryptronic Software Support Forum

#1 11-02-2011 16:24:04

Image Scroller on spalsh page

#2 11-02-2011 18:56:15

Re: Image Scroller on spalsh page

#3 11-03-2011 05:07:52

Re: Image Scroller on spalsh page

#4 11-03-2011 07:38:44

Re: Image Scroller on spalsh page

#5 11-03-2011 08:17:28

Re: Image Scroller on spalsh page

#6 11-03-2011 08:35:59

Re: Image Scroller on spalsh page

#7 11-03-2011 08:47:01

Re: Image Scroller on spalsh page

#8 11-03-2011 15:04:51

Re: Image Scroller on spalsh page

#9 11-03-2011 15:26:37

Re: Image Scroller on spalsh page

#10 11-04-2011 16:48:31

Re: Image Scroller on spalsh page

#11 11-04-2011 17:12:09

Re: Image Scroller on spalsh page

#12 11-04-2011 21:30:30

Re: Image Scroller on spalsh page

Board footer