Results 1 to 3 of 3
  1. #1
    Join Date
    Apr 2012
    Posts
    8
    Plugin Contributions
    0

    Default Having problems with easyslider

    Hello,
    I'm not sure where I'm supposed to find the code for the slider that was already in the Ashley Pink Template. I have found the Image 1 and others in my FTP...and I keep seeing go to Define_Main_Page.php in the define page editor in the admin area of my store. But I'm not seeing any code in there. What is the code that I'm supposed to be looking for?


    I was told There is code in 3 places for the slider:

    includes/templates/ashley_pink/css/stylesheet.css -----starts with /*bof slider*/

    includes/languages/english/html_includes/ashley_pink/define_main_page.php

    includes/modules/pages/index/jscript_easySlider.php

    But I only have 2 of those places showing codes....the Stylesheet.css and the jscript_easyslider.php are only showing anything.

    I am wanting to add this slider to my Ashley Pink Template I have for my store.

    I've found the images1 and so on to add the images...but I'm not sure what code I'm supposed to have in define_main_page.php.

    This is what it shows in the stylesheet.css
    Code:
    /*bof easy slider*/
    #slider{margin:0 auto;}
    #slider ul, #slider li,    #slider2 ul, #slider2 li{margin:0;padding:0;list-style:none;}
    #slider2{margin-top:1em;}
    #slider li, #slider2 li{/*define width and height of list item (slide) entire slider area will adjust according to the parameters provided here    */width:550px;height:250px;overflow:hidden;}    
    #slider{margin:0 auto;margin-top:20px;}
    /*bof easy slider numeric controls*/    
    #control_div{width:200px;height:18px;position:relative;left:380px;top:0px;margin-bottom:10px;}
    ol#controls{margin:1em 0;padding:0;height:18px;}
    ol#controls li{margin:0 10px 0 0;padding:0;float:left;list-style:none;height:18px;line-height:18px;}
    ol#controls li a{float:left;height:18px;line-height:18px;border:1px solid #ccc;background:#d75f8c;color:#000000;padding:0 10px;text-decoration:none;}
    ol#controls li.current a{background:#8c507a;color:#fff;}
    ol#controls li a:focus, #prevBtn a:focus, #nextBtn a:focus{outline:none;}
    
    #home-images{margin-top:25px;}
    #home-text{font-size:120%;width:550px;}
    .promote{margin-left:70px;}
    This is what it shows in jscript_easySlider.php
    Code:
    <script type="text/javascript">
    <!--
    /*
     *     Easy Slider 1.7 - jQuery plugin
     *    written by Alen Grakalic    
     *    http://cssglobe.com/post/4004/easy-slider-15-the-easiest-jquery-plugin-for-sliding
     *
     *    Copyright (c) 2009 Alen Grakalic (http://cssglobe.com)
     *    Dual licensed under the MIT (MIT-LICENSE.txt)
     *    and GPL (GPL-LICENSE.txt) licenses.
     *
     *    Built for jQuery library
     *    http://jquery.com
     *
     */
     
    /*
     *    markup example for $("#slider").easySlider();
     *    
     *     <div id="slider">
     *        <ul>
     *            <li><img src="images/01.jpg" alt="" /></li>
     *            <li><img src="images/02.jpg" alt="" /></li>
     *            <li><img src="images/03.jpg" alt="" /></li>
     *            <li><img src="images/04.jpg" alt="" /></li>
     *            <li><img src="images/05.jpg" alt="" /></li>
     *        </ul>
     *    </div>
     *
     */
    
    
    (function($) {
    
        $.fn.easySlider = function(options){
          
            // default configuration properties
            var defaults = {            
                prevId:         'prevBtn',
                prevText:         'Previous',
                nextId:         'nextBtn',    
                nextText:         'Next',
                controlsShow:    true,
                controlsBefore:    '',
                controlsAfter:    '',    
                controlsFade:    true,
                firstId:         'firstBtn',
                firstText:         'First',
                firstShow:        false,
                lastId:         'lastBtn',    
                lastText:         'Last',
                lastShow:        false,                
                vertical:        false,
                speed:             2000,
                auto:            false,
                pause:            3000,
                continuous:        false, 
                numeric:         false,
                numericId:         'controls'
            }; 
            
            var options = $.extend(defaults, options);  
                    
            this.each(function() {  
                var obj = $(this);                 
                var s = $("li", obj).length;
                var w = $("li", obj).width(); 
                var h = $("li", obj).height(); 
                var clickable = true;
                obj.width(w); 
                obj.height(h); 
                obj.css("overflow","hidden");
                var ts = s-1;
                var t = 0;
                $("ul", obj).css('width',s*w);            
                
                if(options.continuous){
                    $("ul", obj).prepend($("ul li:last-child", obj).clone().css("margin-left","-"+ w +"px"));
                    $("ul", obj).append($("ul li:nth-child(2)", obj).clone());
                    $("ul", obj).css('width',(s+1)*w);
                };                
                
                if(!options.vertical) $("li", obj).css('float','left');
                                    
                if(options.controlsShow){
                    var html = options.controlsBefore;                
                    if(options.numeric){
                        html += '<div id="control_div"><ol id="'+ options.numericId +'"></div></ol>';
                    } else {
                        if(options.firstShow) html += '<span id="'+ options.firstId +'"><a href=\"javascript:void(0);\">'+ options.firstText +'</a></span>';
                        html += ' <span id="'+ options.prevId +'"><a href=\"javascript:void(0);\">'+ options.prevText +'</a></span>';
                        html += ' <span id="'+ options.nextId +'"><a href=\"javascript:void(0);\">'+ options.nextText +'</a></span>';
                        if(options.lastShow) html += ' <span id="'+ options.lastId +'"><a href=\"javascript:void(0);\">'+ options.lastText +'</a></span>';                
                    };
                    
                    html += options.controlsAfter;                        
                    $(obj).after(html);                                        
                };
                
                if(options.numeric){                                    
                    for(var i=0;i<s;i++){                        
                        $(document.createElement("li"))
                            .attr('id',options.numericId + (i+1))
                            .html('<a rel='+ i +' href=\"javascript:void(0);\">'+ (i+1) +'</a>')
                            .appendTo($("#"+ options.numericId))
                            .click(function(){                            
                                animate($("a",$(this)).attr('rel'),true);
                            });                                                 
                    };                            
                } else {
                    $("a","#"+options.nextId).click(function(){        
                        animate("next",true);
                    });
                    $("a","#"+options.prevId).click(function(){        
                        animate("prev",true);                
                    });    
                    $("a","#"+options.firstId).click(function(){        
                        animate("first",true);
                    });                
                    $("a","#"+options.lastId).click(function(){        
                        animate("last",true);                
                    });                
                };
                
                function setCurrent(i){
                    i = parseInt(i)+1;
                    $("li", "#" + options.numericId).removeClass("current");
                    $("li#" + options.numericId + i).addClass("current");
                };
                
                function adjust(){
                    if(t>ts) t=0;        
                    if(t<0) t=ts;    
                    if(!options.vertical) {
                        $("ul",obj).css("margin-left",(t*w*-1));
                    } else {
                        $("ul",obj).css("margin-left",(t*h*-1));
                    }
                    clickable = true;
                    if(options.numeric) setCurrent(t);
                };
                
                function animate(dir,clicked){
                    if (clickable){
                        clickable = false;
                        var ot = t;                
                        switch(dir){
                            case "next":
                                t = (ot>=ts) ? (options.continuous ? t+1 : ts) : t+1;                        
                                break; 
                            case "prev":
                                t = (t<=0) ? (options.continuous ? t-1 : 0) : t-1;
                                break; 
                            case "first":
                                t = 0;
                                break; 
                            case "last":
                                t = ts;
                                break; 
                            default:
                                t = dir;
                                break; 
                        };    
                        var diff = Math.abs(ot-t);
                        var speed = diff*options.speed;                        
                        if(!options.vertical) {
                            p = (t*w*-1);
                            $("ul",obj).animate(
                                { marginLeft: p }, 
                                { queue:false, duration:speed, complete:adjust }
                            );                
                        } else {
                            p = (t*h*-1);
                            $("ul",obj).animate(
                                { marginTop: p }, 
                                { queue:false, duration:speed, complete:adjust }
                            );                    
                        };
                        
                        if(!options.continuous && options.controlsFade){                    
                            if(t==ts){
                                $("a","#"+options.nextId).hide();
                                $("a","#"+options.lastId).hide();
                            } else {
                                $("a","#"+options.nextId).show();
                                $("a","#"+options.lastId).show();                    
                            };
                            if(t==0){
                                $("a","#"+options.prevId).hide();
                                $("a","#"+options.firstId).hide();
                            } else {
                                $("a","#"+options.prevId).show();
                                $("a","#"+options.firstId).show();
                            };                    
                        };                
                        
                        if(clicked) clearTimeout(timeout);
                        if(options.auto && dir=="next" && !clicked){;
                            timeout = setTimeout(function(){
                                animate("next",false);
                            },diff*options.speed+options.pause);
                        };
                
                    };
                    
                };
                // init
                var timeout;
                if(options.auto){;
                    timeout = setTimeout(function(){
                        animate("next",false);
                    },options.pause);
                };        
                
                if(options.numeric) setCurrent(0);
            
                if(!options.continuous && options.controlsFade){                    
                    $("a","#"+options.prevId).hide();
                    $("a","#"+options.firstId).hide();                
                };                
                
            });
          
        };
    
    })(jQuery);
    
    -->
    
    </script>
    This is what it shows in define_main_page.php
    Code:
    <a href="http://www.lulu.com/content/466605"><img src="images/large/e-start-book.gif" alt="get your manual today" title="Have you got yours yet? Join the 1000ís of Zen Cart users that have bought the only comprehensive owners manual !" /></a>
    
    <p>This content is located in the file at: <code> /languages/english/html_includes/YOUR_TEMPLATE/define_main_page.php</code></p>
    
    <p>You can quickly edit this content via Admin->Tools->Define Pages Editor, and select define_main_page from the pulldown.</p>
    
    <p><strong>NOTE: Always backup the files in<code> /languages/english/html_includes/your_template</code></strong></p>
    in my admin area under define page editor
    I've added some stuff already to the define_main_page.php under it....so I'm sorta confused on what I'm supposed to do when I keep reading to do it to the define_main_page.php
    Thank you

  2. #2
    Join Date
    Apr 2012
    Posts
    8
    Plugin Contributions
    0

    Default Re: Having problems with easyslider

    I got it figured out

  3. #3
    Join Date
    Apr 2012
    Posts
    1
    Plugin Contributions
    0

    Default Re: Having problems with easyslider

    Quote Originally Posted by WitchysHeart View Post
    I got it figured out
    What was the solution. I am facing similar issues with a different template.

 

 

Similar Threads

  1. Looking for a tutorial to integrate EasySlider 1.7
    By ray-the-otter in forum All Other Contributions/Addons
    Replies: 21
    Last Post: 2 Dec 2011, 06:49 AM
  2. installed easyslider and need help with stylesheet
    By bn17311 in forum Templates, Stylesheets, Page Layout
    Replies: 0
    Last Post: 2 Nov 2011, 11:41 AM
  3. how i can change the view way for the EasySlider?
    By shahram in forum General Questions
    Replies: 0
    Last Post: 26 Aug 2011, 05:27 AM
  4. Yellow1912's css javascript loader breaks Ajax EasySlider
    By dutchy in forum All Other Contributions/Addons
    Replies: 3
    Last Post: 27 Oct 2010, 11:23 AM
  5. Using JQuery Easyslider for homepage banner help
    By TrvlFox in forum Templates, Stylesheets, Page Layout
    Replies: 2
    Last Post: 26 Sep 2009, 09:01 PM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •