Product slideshow for your X-Cart homepage
Hi all,
I implemented this sliding image slideshow in X-Cart using a standard jquery plugin. Here is how I did it. 1> Download the AnySlider code. https://github.com/ProLoser/AnythingSlider/downloads by clicking on the 'DOWNLOAD AS ZIP' button 2> Create a directory called js off your main x-cart web directory 3> Create a directory called css off your main x-cart web directory 4> Using some FTP software like FileZilla, copy [from the AnythingSlider Zip file] the following files into the /js directory:
7> Go to your X-Cart Admin Menu. 8> Select LANGUAGES>ENGLISH 9> In Apply Filter, type txt_welcome 10> In the location you want your image slider to work paste the following: Code:
<!-- jQuery (required) --> 11> Locate this portion of the code: Code:
<div id="slider"> Each image in the slide show is specified by a DIV section under the <div id="slider">. For example the first image (and link) is set with this: Code:
<div><a href="firstlink"><img src="firstimage" /></a></div> So lets say that the link to the first product displayed is "/product.php?productid=16145&cat=253&page=1" , you'd put that in place of where I have typed "firstlink". i.e. <a href="/product.php?productid=16145&cat=253&page=1"> Next you need to insert the url of the image you uploaded in step 6 So if it were called "shoe-ad.jpg" , in place of Code:
<img src="firstimage" /> You then add a new <DIV> for each product [in the same format] you want in the slideshow. Here is the code from my website: Code:
<div id="slider"> Finally, you'll want to set the size of the slider to the size that you think fits best. 12. On your server edit the file /css/anythingslider.css Near the top look for: Code:
#slider { The WIDTH and HEIGHT sections specify the size in pixels. I've changed mine to 450px wide and 250px high. Edit to suit your site! Hopefully I haven't missed any steps. Had a wine or two :lol: I've also been a software developer for a number of years so if I've not explained something / you don't understand a bit, let me know. Hope it works for you all. |
Re: Product slideshow for your X-Cart homepage
Looks interesting.. I'll have to check it out more when I get the time.
|
Re: Product slideshow for your X-Cart homepage
The slider breaks the layout in x-cart 4.4 Light & Lucid Theme. Could you please suggest a fix?
I loaded as per your suggestion and the welcome section goes full width as the following featured section. The sidebars show then underneath the featured product section. Thanks for your help/ |
Re: Product slideshow for your X-Cart homepage
that's great, worked fine with my version, if it's breaking the code for someone make sure you follow the instructions to the letter. I usually print out instructions then go through them line by line and tick when I have done them. Sounds pretty anal but that's how my mind works, I find it difficult trying to remember everything and flick around from screen to screen. Then I keep a copy of the paperwork for reference, I work on commercial sites so this is pretty crucial.
|
Re: Product slideshow for your X-Cart homepage
Yea, this is breaking in 4.5 ideal comfort template too...any tips??
|
Re: Product slideshow for your X-Cart homepage
Sorry folks. A little hard to debug without seeing what's actually happening. I can say that if you get any of the steps even slightly wrong it can have some bizarre outcomes.
|
All times are GMT -8. The time now is 02:26 PM. |
Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2024, Jelsoft Enterprises Ltd.