mas template

Modifikasi Slider Lofslidernews Otomatis Maknyus

Kali ini saya akan berikan satu lagi tutorial membuat slider otomatis dari Lofslidernews. Slider ini buatan landofcoder.com, demo aslinya bisa dilihat disini. Abu Farhan, seorang master blogger Indonesia juga pernah membuat slider ini yang bekerja berdasarkan popular post, tapi kekurangannya jika gambar yang dipakai ukurannya kecil atau ukuran tingginya lebih besar, gambar pada slider seperti kegenjet dan kurang enak dilihat. Disini saya hanya memodifikasi agar gambar terlihat simetris meskipun ukuran tinggi lebih besar, tapi tetap harus menggunakan gambar dengan ukuran besar jika ingin hasil yang lebih bagus. Slider ini juga saya buat agar bisa menampilkan artikel terbaru juga per kategori atau label.

Sekilas bentuk dari slider ini seperti slider yang ada pada template Sporty Magazine2 dari Borneo Templates. Banyak perbedaan mendasar dari kedua slider ini, disamping kode-kode pembentuk slider, Lofslidernews mampu menampilkan berapapun post yang ingin Anda tampilkan pada slider, karena gambar pagination kecil bergerak dinamis dari atas  kebawah kemudian kembali lagi keatas menggunakan efek Easing. Gerak dari gambar utama pada slider ini pun dari kanan ke kiri seperti pada Looped Slider yang akan saya bahas lain waktu.Untuk lebih jelasnya silahkan lihat demonya dibawah :

lofslidernews


Sebelum masuk ke tutorial membuat slider ini, saya mau kasih tau dulu kalau slider ini agak ribet dalam pengaturan panjang dan lebar image, baik yang besar maupun yang kecil (pagination). Juga slider ini lebih banyak menggunakan kode script, yang bagi blog prioritas SEO akan sangat merugikan. Tapi semua itu bisa diatasi dengan mengkompres dan meringkas kode-kode script pada slider di Google Code.

Oke, jika Anda berminat perhatikan baik-baik tutorial cara pemasangan slider ini sebagai berikut :
  1. Setelah masuk ke dashboard blogger, pilih blog yang akan dipasang slider ini.
  2. Kemudian masuk ke Template >> Edit HTML (centang kotak expand widget templates)
  3. Di back up dulu templatenya, jika sewaktu-waktu terjadi kesalahan bisa dikembalikan ke bentuk semula.
  4. Pertama yang harus Anda lakukan adalah membuat satu buah kolom kosong diatas blog post, seperti gambar di bawah ini (jika pada template yang Anda pakai sudah terdapat satu kolom kosong seperti gambar dibawah, langkah ini tidak perlu dilakukan) :
    lofslidernews

    Caranya, letakkan kode berikut di atas kode ]]></b:skin>
    /* Slide Content
    ----------------------------------------------- */
    .slide-wrapper {padding:0 auto;margin:0 auto;width:auto;float: left;
    word-wrap: break-word; overflow: hidden;} 
    .slide {color: #666666;line-height: 1.3em;}
    .slide ul {list-style:none;margin:0 0 0;padding:0 0 0;}
    .slide li {margin:0;padding-top:0;
    padding-right:0;padding-bottom:.25em;
    padding-left:0px;text-indent:0px;line-height:1.3em;}
    .slide .widget {margin:0px 0px 6px 0px;}

    Kemudian untuk memunculkannya pada layout (diatas blog post), anda harus memanggilnya. Cari kode <div id='main-wrapper'> kemudian letakkan kode berikut dibawahnya :
    <b:if cond='data:blog.url == data:blog.homepageUrl'>
          <div id='slide-wrapper'>
    <b:section class='slide' id='slide' preferred='yes'/>
          </div>
    </b:if> 
  5. Save template dulu, sekarang masuk ke Layout/Tata Letak, Anda cek apa sudah terpasang satu kolom di atas Blog Post? Jika sudah ada, masuk lagi ke Edit HTML. Kemudian masukkan kode berikut di atas kode ]]></b:skin> :
    /* Lofslidernews */
    #slider{background-color:#e2e2e2;background-image: -moz-linear-gradient(top,#f6f6f6 0,#e2e2e2 100%); background-image: -ms-linear-gradient(top,#f6f6f6 0,#e2e2e2 100%); background-image: -o-linear-gradient(top,#f6f6f6 0,#e2e2e2 100%); background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0,#f6f6f6),color-stop(100%,#e2e2e2)); background-image: -webkit-linear-gradient(top,#f6f6f6 0,#e2e2e2 100%); background-image: linear-gradient(to bottom,#f6f6f6 0,#e2e2e2 100%);
    border-radius:4px;-moz-border-radius:4px;-webkit-border-radius:4px;border:1px solid #999;box-shadow:0 0 4px #888;-moz-box-shadow:0 0 4px #888;-webkit-box-shadow:0 0 4px #888;padding:10px;margin:4px;position:relative;overflow:hidden;width:600px;height:298px;}
    .slider-main-outer{position:relative;height:100%;width:400px;z-index:3;overflow:hidden}
    ul.slider-main-wapper li h3{z-index:10;position:absolute;bottom:-14px;width:385px;background:url(http://4.bp.blogspot.com/-bp2HK6MdDXg/T5aB6vI5GPI/AAAAAAAAF98/gwCsmb8Fcks/s1600/transparant.png);padding:10px}
    ul.slider-main-wapper li h3 p{color:#FFF;font-size:12px;padding-top:5px;display:block;margin:0}
    ul.slider-main-wapper li h3 a{color:#FFF;font-size:16px;line-height:25px;margin:0}
    ul.slider-main-wapper li .imgauto{width:405px;height:298px;overflow:hidden;margin:0;padding:0}
    ul.slider-main-wapper{height:298px;width:405px;position:absolute;overflow:hidden;margin:0;padding:0}
    ul.slider-main-wapper li{overflow:hidden;list-style:none;height:100%;width:405px;float:left;margin:0;padding:0}
    .slider-opacity li{position:absolute;top:0;left:0;float:inherit}
    ul.slider-main-wapper li img{list-style:none;width:405px;height:auto;padding:0}
    ul.slider-navigator{top:0;position:absolute;width:100%;margin:0;padding:0}
    ul.slider-navigator li{cursor:pointer;list-style:none;width:100%;overflow:hidden;margin:0;padding:0}
    .slider-navigator-outer{position:absolute;right:10px;top:10px;z-index:10;height:300px;width:200px;overflow:hidden;color:#333}
    .slider-navigator li h5{color:#333;font:11px Arial;margin:0;padding:5px 10px 0 0}
    .slider-navigator li div{background-color:#e2e2e2;background-image: -moz-linear-gradient(top,#fff 0,#e2e2e2 100%); background-image: -ms-linear-gradient(top,#fff 0,#e2e2e2 100%); background-image: -o-linear-gradient(top,#fff 0,#e2e2e2 100%); background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0,#fff),color-stop(100%,#e2e2e2)); background-image: -webkit-linear-gradient(top,#fff 0,#e2e2e2 100%); background-image: linear-gradient(to bottom,#fff 0,#e2e2e2 100%)color:#444;text-shadow:1px 1px 1px #fff;height:56px;position:relative;margin:0px 0px 3px 10px;padding:0 5px;border:1px solid #c0c0c0;}
    .slider-navigator li.active div,.slider-navigator li:hover div{color:#0178d3;border:1px solid #999}
    .slider-navigator li img{border:#ddd solid 1px;height:44px;width:60px;float:left;margin:5px 5px 5px 0}
    .slider-navigator li.active img{border:#eee solid 1px}
    .slider-navigator li.active h5{color:#0178d3}
    Perhatikan kode warna merah diatas, itu dalah ukuran panjang dan lebar slider, silahkan disesuaikan dengan ukuran pada template Anda. Pada demo yang saya gunakan panjang main-wrapper 630px tapi karena ada padding slider sebesar 10px, ukuran yang saya gunakan untuk slider hanya 600px.

  6. Masih di Edit HTML, masukkan kode script berikut ini diatas </head> :
    <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'/>
    <script src='http://yourjavascript.com/24211643151/jquery.easing.js' type='text/javascript'/>
    <script type='text/javascript'>
    //<![CDATA[

    (function($) {

    var types = ['DOMMouseScroll', 'mousewheel'];

    $.event.special.mousewheel = {
        setup: function() {
            if ( this.addEventListener )
                for ( var i=types.length; i; )
                    this.addEventListener( types[--i], handler, false );
            else
                this.onmousewheel = handler;
        },
       
        teardown: function() {
            if ( this.removeEventListener )
                for ( var i=types.length; i; )
                    this.removeEventListener( types[--i], handler, false );
            else
                this.onmousewheel = null;
        }
    };

    $.fn.extend({
        mousewheel: function(fn) {
            return fn ? this.bind("mousewheel", fn) : this.trigger("mousewheel");
        },
       
        unmousewheel: function(fn) {
            return this.unbind("mousewheel", fn);
        }
    });


    function handler(event) {
        var args = [].slice.call( arguments, 1 ), delta = 0, returnValue = true;
       
        event = $.event.fix(event || window.event);
        event.type = "mousewheel";
       
        if ( event.wheelDelta ) delta = event.wheelDelta/120;
        if ( event.detail     ) delta = -event.detail/3;
       
        // Add events and delta to the front of the arguments
        args.unshift(event, delta);

        return $.event.handle.apply(this, args);
    }

    })(jQuery);

    /**
     * @version        $Id:  $Revision
     * @package        jquery
     * @subpackage    lofslidernews
     * @copyright    Copyright (C) JAN 2010 LandOfCoder.com <@emai:landofcoder@gmail.com>. All rights reserved.
     * @website     http://landofcoder.com
     * @license        This plugin is dual-licensed under the GNU General Public License and the MIT License
     */
    // JavaScript Document
    (function($) {
         $.fn.lofJSidernews = function( settings ) {
             return this.each(function() {
                // get instance of the lofSiderNew.
                new  $.lofSidernews( this, settings );
            });
          }
         $.lofSidernews = function( obj, settings ){
            this.settings = {
                direction            : '',
                mainItemSelector    : 'li',
                navInnerSelector    : 'ul',
                navSelector          : 'li' ,
                navigatorEvent        : 'click',
                wapperSelector:     '.slider-main-wapper',
                interval               : 4000,
                auto                : true, // whether to automatic play the slideshow
                maxItemDisplay         : 5,
                startItem            : 0,
                navPosition            : 'vertical',
                navigatorHeight        : 60,
                navigatorWidth        : 210,
                duration            : 600,
                navItemsSelector    : '.slider-navigator li',
                navOuterSelector    : '.slider-navigator-outer' ,
                isPreloaded            : true,
                easing                : 'easeInOutQuad'
            }   
            $.extend( this.settings, settings ||{} );   
            this.nextNo         = null;
            this.previousNo     = null;
            this.maxWidth  = this.settings.mainWidth || 600;
            this.wrapper = $( obj ).find( this.settings.wapperSelector );   
            this.slides = this.wrapper.find( this.settings.mainItemSelector );
            if( !this.wrapper.length || !this.slides.length ) return ;
            // set width of wapper
            if( this.settings.maxItemDisplay > this.slides.length ){
                this.settings.maxItemDisplay = this.slides.length;   
            }
            this.currentNo      = isNaN(this.settings.startItem)||this.settings.startItem > this.slides.length?0:this.settings.startItem;
            this.navigatorOuter = $( obj ).find( this.settings.navOuterSelector );   
            this.navigatorItems = $( obj ).find( this.settings.navItemsSelector ) ;
            this.navigatorInner = this.navigatorOuter.find( this.settings.navInnerSelector );
           
            if( this.settings.navPosition == 'horizontal' ){
                this.navigatorInner.width( this.slides.length * this.settings.navigatorWidth );
                this.navigatorOuter.width( this.settings.maxItemDisplay * this.settings.navigatorWidth );
                this.navigatorOuter.height(    this.settings.navigatorHeight );
               
            } else {
                this.navigatorInner.height( this.slides.length * this.settings.navigatorHeight );   
               
                this.navigatorOuter.height( this.settings.maxItemDisplay * this.settings.navigatorHeight );
                this.navigatorOuter.width(    this.settings.navigatorWidth );
            }       
            this.navigratorStep = this.__getPositionMode( this.settings.navPosition );       
            this.directionMode = this.__getDirectionMode(); 
           
           
            if( this.settings.direction == 'opacity') {
                this.wrapper.addClass( 'slider-opacity' );
                $(this.slides).css('opacity',0).eq(this.currentNo).css('opacity',1);
            } else {
                this.wrapper.css({'left':'-'+this.currentNo*this.maxSize+'px', 'width':( this.maxWidth ) * this.slides.length } );
            }

           
            if( this.settings.isPreloaded ) {
                this.preLoadImage( this.onComplete );
            } else {
                this.onComplete();
            }
           
         }
         $.lofSidernews.fn =  $.lofSidernews.prototype;
         $.lofSidernews.fn.extend =  $.lofSidernews.extend = $.extend;
       
         $.lofSidernews.fn.extend({
                                 
            startUp:function( obj, wrapper ) {
                seft = this;

                this.navigatorItems.each( function(index, item ){
                    $(item).click( function(){
                        seft.jumping( index, true );
                        seft.setNavActive( index, item );                   
                    } );
                    $(item).css( {'height': seft.settings.navigatorHeight, 'width':  seft.settings.navigatorWidth} );
                })
                this.registerWheelHandler( this.navigatorOuter, this );
                this.setNavActive(this.currentNo );
               
                if( this.settings.buttons && typeof (this.settings.buttons) == "object" ){
                    this.registerButtonsControl( 'click', this.settings.buttons, this );

                }
                if( this.settings.auto )
                this.play( this.settings.interval,'next', true );
               
                return this;
            },
            onComplete:function(){
                setTimeout( function(){ $('.preload').fadeOut( 900 ); }, 400 );    this.startUp( );
            },
            preLoadImage:function(  callback ){
                var self = this;
                var images = this.wrapper.find( 'img' );
       
                var count = 0;
                images.each( function(index,image){
                    if( !image.complete ){                 
                        image.onload =function(){
                            count++;
                            if( count >= images.length ){
                                self.onComplete();
                            }
                        }
                        image.onerror =function(){
                            count++;
                            if( count >= images.length ){
                                self.onComplete();
                            }   
                        }
                    }else {
                        count++;
                        if( count >= images.length ){
                            self.onComplete();
                        }   
                    }
                } );
            },
            navivationAnimate:function( currentIndex ) {
                if (currentIndex <= this.settings.startItem
                    || currentIndex - this.settings.startItem >= this.settings.maxItemDisplay-1) {
                        this.settings.startItem = currentIndex - this.settings.maxItemDisplay+2;
                        if (this.settings.startItem < 0) this.settings.startItem = 0;
                        if (this.settings.startItem >this.slides.length-this.settings.maxItemDisplay) {
                            this.settings.startItem = this.slides.length-this.settings.maxItemDisplay;
                        }
                }       
                this.navigatorInner.stop().animate( eval('({'+this.navigratorStep[0]+':-'+this.settings.startItem*this.navigratorStep[1]+'})'),
                                                    {duration:500, easing:'easeInOutQuad'} );   
            },
            setNavActive:function( index, item ){
                if( (this.navigatorItems) ){
                    this.navigatorItems.removeClass( 'active' );
                    $(this.navigatorItems.get(index)).addClass( 'active' );   
                    this.navivationAnimate( this.currentNo );   
                }
            },
            __getPositionMode:function( position ){
                if(    position  == 'horizontal' ){
                    return ['left', this.settings.navigatorWidth];
                }
                return ['top', this.settings.navigatorHeight];
            },
            __getDirectionMode:function(){
                switch( this.settings.direction ){
                    case 'opacity': this.maxSize=0; return ['opacity','opacity'];
                    default: this.maxSize=this.maxWidth; return ['left','width'];
                }
            },
            registerWheelHandler:function( element, obj ){
                 element.bind('mousewheel', function(event, delta ) {
                    var dir = delta > 0 ? 'Up' : 'Down',
                        vel = Math.abs(delta);
                    if( delta > 0 ){
                        obj.previous( true );
                    } else {
                        obj.next( true );
                    }
                    return false;
                });
            },
            registerButtonsControl:function( eventHandler, objects, self ){
                for( var action in objects ){
                    switch (action.toString() ){
                        case 'next':
                            objects[action].click( function() { self.next( true) } );
                            break;
                        case 'previous':
                            objects[action].click( function() { self.previous( true) } );
                            break;
                    }
                }
                return this;   
            },
            onProcessing:function( manual, start, end ){            
                this.previousNo = this.currentNo + (this.currentNo>0 ? -1 : this.slides.length-1);
                this.nextNo     = this.currentNo + (this.currentNo < this.slides.length-1 ? 1 : 1- this.slides.length);               
                return this;
            },
            finishFx:function( manual ){
                if( manual ) this.stop();
                if( manual && this.settings.auto ){
                    this.play( this.settings.interval,'next', true );
                }       
                this.setNavActive( this.currentNo );   
            },
            getObjectDirection:function( start, end ){
                return eval("({'"+this.directionMode[0]+"':-"+(this.currentNo*start)+"})");   
            },
            fxStart:function( index, obj, currentObj ){
                    if( this.settings.direction == 'opacity' ) {
                        $(this.slides).stop().animate({opacity:0}, {duration: this.settings.duration, easing:this.settings.easing} );
                        $(this.slides).eq(index).stop().animate( {opacity:1}, {duration: this.settings.duration, easing:this.settings.easing} );
                    }else {
                        this.wrapper.stop().animate( obj, {duration: this.settings.duration, easing:this.settings.easing} );
                    }
                return this;
            },
            jumping:function( no, manual ){
                this.stop();
                if( this.currentNo == no ) return;       
                 var obj = eval("({'"+this.directionMode[0]+"':-"+(this.maxSize*no)+"})");
                this.onProcessing( null, manual, 0, this.maxSize )
                    .fxStart( no, obj, this )
                    .finishFx( manual );   
                    this.currentNo  = no;
            },
            next:function( manual , item){

                this.currentNo += (this.currentNo < this.slides.length-1) ? 1 : (1 - this.slides.length);   
                this.onProcessing( item, manual, 0, this.maxSize )
                    .fxStart( this.currentNo, this.getObjectDirection(this.maxSize ), this )
                    .finishFx( manual );
            },
            previous:function( manual, item ){
                this.currentNo += this.currentNo > 0 ? -1 : this.slides.length - 1;
                this.onProcessing( item, manual )
                    .fxStart( this.currentNo, this.getObjectDirection(this.maxSize ), this )
                    .finishFx( manual    );           
            },
            play:function( delay, direction, wait ){   
                this.stop();
                if(!wait){ this[direction](false); }
                var self  = this;
                this.isRun = setTimeout(function() { self[direction](true); }, delay);
            },
            stop:function(){
                if (this.isRun == null) return;
                clearTimeout(this.isRun);
                this.isRun = null;
            }
        })
    })(jQuery)

     //]]>
    </script>
    <script type='text/javascript'>
    //<![CDATA[
    imgr = new Array();
    imgr[0] = "http://2.bp.blogspot.com/-uitX7ROPtTU/Tyv-G4NA_uI/AAAAAAAAFBY/NcWLPVnYEnU/s1600/no+image.jpg";
    showRandomImg = true;
    aBold = true;
    summaryPost = 70;
    summaryTitle = 20;

    numposts = 10;

    function removeHtmlTag(strx,chop){
        var s = strx.split("<");
        for(var i=0;i<s.length;i++){
            if(s[i].indexOf(">")!=-1){
                s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
            }
        }
        s =  s.join("");
        s = s.substring(0,chop-1);
        return s;
    }

    function showrecentposts(json) {
        j = (showRandomImg) ? Math.floor((imgr.length+1)*Math.random()) : 0;
        img  = new Array();

          for (var i = 0; i < numposts; i++) {
            var entry = json.feed.entry[i];
            var posttitle = entry.title.$t;
            var pcm;
            var posturl;
            if (i == json.feed.entry.length) break;
            for (var k = 0; k < entry.link.length; k++) {
                  if (entry.link[k].rel == 'alternate') {
                    posturl = entry.link[k].href;
                    break;
                  }
            }
           
            for (var k = 0; k < entry.link.length; k++) {
                  if (entry.link[k].rel == 'replies' && entry.link[k].type == 'text/html') {
                    pcm = entry.link[k].title.split(" ")[0];
                    break;
                  }
            }
           
            if ("content" in entry) {
                  var postcontent = entry.content.$t;}
            else
            if ("summary" in entry) {
                  var postcontent = entry.summary.$t;}
            else var postcontent = "";
           
            postdate = entry.published.$t;
       
        if(j>imgr.length-1) j=0;
        img[i] = imgr[j];
       
        s = postcontent    ; a = s.indexOf("<img"); b = s.indexOf("src=\"",a); c = s.indexOf("\"",b+5); d = s.substr(b+5,c-b-5);

        if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")) img[i] = d;

        //cmtext = (text != 'no') ? '<i><font color="'+acolor+'">('+pcm+' '+text+')</font></i>' : '';


        var month = [1,2,3,4,5,6,7,8,9,10,11,12];
        var month2 = ["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];

        var day = postdate.split("-")[2].substring(0,2);
        var m = postdate.split("-")[1];
        var y = postdate.split("-")[0];

        for(var u2=0;u2<month.length;u2++){
            if(parseInt(m)==month[u2]) {
                m = month2[u2] ; break;
            }
        }

        var daystr = day+ ' ' + m + ' ' + y ;
       
        var trtd = '<li style="position:relative;"><div class="imgauto"><a href="'+posturl+'"><img width="405" height="298" class=" " src="'+img[i]+'"/></a></div><h3><a href="'+posturl+'">'+posttitle+'</a><p>'+daystr+' / '+pcm+' comments</p></h3></li>';                   
            document.write(trtd);      
                   
                  j++;
        }
       
    }


    function showrecentposts1(json) {
        j = (showRandomImg) ? Math.floor((imgr.length+1)*Math.random()) : 0;
        img  = new Array();
       
          for (var i = 0; i < numposts; i++) {
            var entry = json.feed.entry[i];
            var posttitle = entry.title.$t;
            var pcm;
            var posturl;
            if (i == json.feed.entry.length) break;
            for (var k = 0; k < entry.link.length; k++) {
                  if (entry.link[k].rel == 'alternate') {
                    posturl = entry.link[k].href;
                    break;
                  }
            }
           
            for (var k = 0; k < entry.link.length; k++) {
                  if (entry.link[k].rel == 'replies' && entry.link[k].type == 'text/html') {
                    pcm = entry.link[k].title.split(" ")[0];
                    break;
                  }
            }
           
            if ("content" in entry) {
                  var postcontent = entry.content.$t;}
            else
            if ("summary" in entry) {
                  var postcontent = entry.summary.$t;}
            else var postcontent = "";
           
            postdate = entry.published.$t;
       
        if(j>imgr.length-1) j=0;
        img[i] = imgr[j];
       
        s = postcontent    ; a = s.indexOf("<img"); b = s.indexOf("src=\"",a); c = s.indexOf("\"",b+5); d = s.substr(b+5,c-b-5);

        if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")) img[i] = d;

        //cmtext = (text != 'no') ? '<i><font color="'+acolor+'">('+pcm+' '+text+')</font></i>' : '';


        var month = [1,2,3,4,5,6,7,8,9,10,11,12];
        var month2 = ["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];

        var day = postdate.split("-")[2].substring(0,2);
        var m = postdate.split("-")[1];
        var y = postdate.split("-")[0];

        for(var u2=0;u2<month.length;u2++){
            if(parseInt(m)==month[u2]) {
                m = month2[u2] ; break;
            }
        }

        var daystr = day+ ' ' + m + ' ' + y ;
       
        var trtd = '<li><div><img width="60" height="44" class="alignnone" src="'+img[i]+'"/><h5>'+posttitle+'</h5></div></li>';                   
            document.write(trtd);      
                   
                  j++;
        }
       
    }

     //]]>
    </script>
    Perhatikan kode script warna merah paling atas, jika pada template Anda sudah terpasang script itu seri berapapun, kode script itu tidak usah diikutkan. numposts:10; adalah jumlah post yang tampil pada slider
  7. Save templates lagi, pemasangan kode-kode di Edit HTML selesai. Sekarang Anda kembali ke Layout/Tata Letak. Masukkan kode di bawah ini ke dalam kolom kosong diatas Blog Post yang sudah Anda buat pertama kali, klik Add a Gadget >> HTML/Javascript :
    <div class='lof-main-wapper' id='slider'>
    <div class='slider-main-outer'>
    <ul class='slider-main-wapper'>
    <script>                   
    document.write("<script src=\"/feeds/posts/default/-/misteri?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts\"><\/script>");
    </script>
    </ul>
    </div>
    <div class='slider-navigator-outer'>
    <ul class='slider-navigator'>
    <script>                   
    document.write("<script src=\"/feeds/posts/default/-/misteri?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts1\"><\/script>");
    </script>
    </ul>
    </div>
    </div>
    <script type='text/javascript'>
    jQuery(document).ready(function($){   
        $('#slider').lofJSidernews({
            interval:6000,
            duration:800,
            mainWidth: 405,
            navigatorWidth: 200,
            maxItemDisplay:5,
            easing:'easeInOutQuad',
            auto:true,
            isPreloaded: false
        });
    });   
    </script>
    Keterangan :
    Tulisan warna merah (misteri) adalah label yang saya masukkan pada slider. Silahkan diganti dengan label yang ingin ditampilkan.
  8. Terakhir save, selesai.
Agak rumit ya? pelan-pelan nanti juga bisa. Baca tutorialnya dengan teliti jangan ada yang kelewatan karena menurut saya ini agak sedikit rumit dalam pengaturan panjang dan lebar. Jangan lupa kopinya diminum dulu, nanti keburu dingin. Jika masih ada yang kurang jelas, bisa ditanyakan pada kolom komentar dibawah. Itu tadi tutorial membuat slider Lofslidernews kali ini, silahkan dicoba dan semoga bermanfaat.

NB :
To Assal Ali, I will make tutorial slider in Johny Jogos template for you, next after this post
Jika Anda menyukai Artikel di blog ini, Silahkan klik disini untuk berlangganan gratis via email, dengan begitu Anda akan mendapat kiriman artikel setiap ada artikel yang terbit di Creating Website

191 comments:

  1. Thamks kk..!
    Reupload Template yang Creating Website Modifikasi donx..! Url : http://www.maskolis.com/2012/01/template-creating-website-modifikasi.html Soalnya link downloadnya mati!

    ReplyDelete
    Replies
    1. Itu yang bikin adik saya, dia lupa password masuk ke blogger.
      Coba nanti saya buatkan yang baru mas

      Delete
    2. wkwk bikin template bisa, paswosrd lupa wkwk
      coba cek gan hasil tutor atas ni rjk2berinfo.blogspot.com/

      Delete
  2. Wah baru saja saya pasang slider sporti ini ada yang baru lagi..

    jadi bingung nih..

    Tapi makasih yach atas share nya..

    ReplyDelete
    Replies
    1. Oia mas javascript nya kan panjang tu,apa kah bisa di minimalis dengan googlecode..

      Kalo bisa kode mana saja yang musti di simpan..

      makasih sebelumnya..

      Delete
    2. Kode pada langkah nomer 6 itu simpan aja di google code mas

      Delete
    3. Dari mana sampe mana mas..
      apakah dari ujung lor sampe ujung kidul gitu..soalnya di situ ada pengaturan lebar tinggi gambarnya..saya masih bingung mas :D :D

      Maklum masih awam >_<

      Delete
    4. dari kode yang diawali : // tapi itu ada dua jadi dipotong satu-satu, trus dijadikan dua

      Delete
    5. Eh kok muncul sebagian
      maksudnya dari //<![CDATA[ sampai //]]>

      Delete
    6. Terima kasih mas,udah saya laksanakan,
      namun masih ada sedikit kendala, js yang no 2 setelah di pasang ga mau tampil,kemudian bagaimana supaya gambar pada slider itu full..

      Tolong di liat mas..
      http://ashshaffat.blogspot.com/

      Delete
    7. yang script ini : http://ashshaffat.googlecode.com/files/jquery.easing1.js

      Cara nyimpennya salah mas, coba perhatikan cara nyimpen di google code disini :
      http://www.maskolis.com/2012/05/mengatasi-loading-blog-dengan-google.html

      Delete
    8. Alhamdulillah sekarang sudah lancar dan normal, terma kasih mas atas semuanya,semoga Allah senantiasa menyelimuti keluarga maskolis dengan ke bahagiaan..

      Untuk masalah tampilan saya mohon maaf karena sudah merubahnya,template aslinya adalah johny wusss..

      Delete
    9. Sipp mantab.
      Kalo bisa label yg ditampilkan di slider yang judulnya pendek-pendek aja mas biar nggak nabrak bawahnya di navigation slider kecil

      Delete
  3. Kodenya byuanyak banget ya mas.....
    Pengen nyoba sih...tapi blog yang mana yah...yang satu sudah ada...yang satu lagi juga sudah ada...yang khusus kontes seo kata maskolis kurang bagus....(sudah bikin yang kontes seo mas dengan jhony wuzz...hehehe...tapi belum diisi postingan...tapi memang wus mas)....ya baca saja lah biar tambah pinter kaya Maskolis ....

    ReplyDelete
    Replies
    1. Tutorial membuat slidr yg dulu2 biasanya kode script semua saya ringkes di google code jadi keliatan dikit.
      Sebenernya sama aja kok mas, bedanya untuk slider ini, cuma satu yg direngkes di yourjavascript jadi keliatan buaynaaakkk bgt

      Delete
  4. hny bisa bilang wauuww gitu! :)

    mas ada gk kira2 slider yg tnpa pake jquery dan hny pake css dan html? dan cr pasangx tanpa edit HTML? hny penambahan widget sj...

    ReplyDelete
    Replies
    1. Mana ada, keknya semua slider pasti pake javascript
      Eh.. ada ding, itu yang bawaan widget dari blogger, slidshow dari picassa tapi ya gitu bentuknya

      Delete
    2. soalx udah tekat bulat ni mas gk akan tambah HTML lg, klo mengurangi sy mau :)

      trus sy liat maskolis gk pake autoping, seo monitor dan Get FreeBL dan dll yg sejenis, sprti yg ada dlm widget siteinfo pny sy.., bhkn sy liat sebgian blogger masang lbh dr sepuluh...,sebeanrx itu penting gk sh mas??? mf kayak wartawan ni bnyk nanya :)

      Delete
    3. Nggak penting, itu bikin berat loading, sebenernya alexa sama PR yang saya pasang di blog ini buat promosi, kemarin ada orang indosatm2 yg nawarin kerjasama, tapi harganya belum cocok

      Coba liat di blog mas Naufal, widget.js masih keliatan nggak? Kemarin udah aku pasang kode buat nonaktif widget.js. Gimana tambah cepet nggak?

      Delete
    4. makasih bnyk mas.., gk nyangka maskolis mau menyempatkan diri tuk buka akun blog sy, skali lg makasih.., pantas rasa2x ko ada yg aneh dgn blog sy, tambah cepat aja pdhl jaringan disini naik turun :)

      Alhamdulillah skrg loadtimex 576ms, kemarin 8-ratusan, pagesizex 138.2kB, kemarin 180 lbh..., makasih mas :D

      Delete
  5. mas kok link download template nya pada mokad ya?
    jadi gak bisa download" de, terutama di page ke 8.

    ReplyDelete
    Replies
    1. Yg mana aja yg nggak bisa di download mas
      Kasih tau saya, nanti diperbaiki

      Delete
  6. cuman koment hadiirrrrr...

    btw,template contohnya kapan di bagiin mas?? :D

    ReplyDelete
    Replies
    1. Baru juga kemarin bagi template, 3 hari lagi biar tambah bagus dulu ya..

      Awas ada kereta mingggirrrrrrrrrrrrr

      Delete
    2. kasihan mas panjix dr kemarin2 disuruh minggir tp gk nyadar2 jg hhehehe...

      Awas ada kereta mingggirrrrrrrrrrrrr

      Delete
    3. wah pantesan mas pernah bilang awas ada kerata... taunya avatar saya iah..ga ngeh :D
      jawa punya mas..hehehe bogor ga ada..heheh

      Delete
    4. Mas Naufal kemarin Pilgub di Makassar pilih siapa?

      Bogor ada KRL commuter, tambah mahal ongkosnya pelayanan gak ada peningkatan ya? Pak Dahlan memang Is preettttttt bisanya cuma senyum2 doank di TV..... hahahahahaha

      Delete
    5. pepatah mengatakan banyak bicara banyak juga bohongnya,,..hahahah

      oya mas,saya berhasil bikin template Johny Wusss responsive...dah 4 hari utek sana sini..akhirnya bisa juga,..heheh e...bisa di cek mas..wakakakak (lg berbunga-bunga)

      Delete
    6. masihproses.blogspot.com.. lau ada yg salah di koreksi ya mas

      Delete
    7. Ganti dulu blog readers ke anybody, saya nggak bisa liat
      Permission denied

      Delete
    8. Sipp.. cek disini : http://mattkersley.com/responsive/
      Kalo bisa ukurannya jgn terlalu lebar, dibuat biasa aja. Buat juga kotak searchnya nongol di responsif layout

      Delete
    9. nah itu masalahnya mas..heheeh dr tadi bingung ..
      menyesusaikan postingan aja bingung..biar ga kecil.. kan harus nya mengikuti layoutnya.. harusnya law pake .mobile-post-outer berubah,tapi ini ngga.. ..

      Delete
    10. alhamdulillah mas ketemu, postingan udah bisa sama dengan layoutnya...
      tinggal lebar sama serach nya yang belom ketemu caranya.

      Delete
    11. Ah mboh mas... aku juga nggak ngerti responsif.. hahahaha

      Ntar aku tak belajar dulu responsif, kalo bisa tak kasih tau ya

      Delete
    12. 45% warga makassr gk memilih, termasuk sy, pdhl kemari2x sy memilih, gk tau napa mgkn prosedurx yg agak ribet, milih atw gk milih yg penting ngeblog tetap jalan :D

      Delete
  7. OMG!
    Thanks so much, this one is very interesting too.
    I can't express how much I'm grateful...
    Thanks again!

    ReplyDelete
    Replies
    1. you're welcome
      Johny Jogos slider maybe in the next post bro

      Delete
  8. Asalamualaikum Maskolis, saya mau tanya ni Sebelumnya mohon maaf banget Kalau OOT.

    Cara Memperbaiki Tab Views yang tidak bisa di klik gimana ya mas? coz saya dahulu menggunakan tutorialnya maskolis sebagai panduan. Matur Nuwun.

    kiosbisnis.com

    ReplyDelete
    Replies
    1. Wa'alaikum salam Mas Adit, wah baru beredar lagi, kemana aja mas? Skripsi ya?
      Yang ini <script src="https://masolis-javascript.googlecode.com/svn/trunk/tab-viewmaskolis.js"/> udah rusak soalnya Google code kena banned, ganti ini aja :
      <script type='text/javascript'>
      //<![CDATA[function tabview_aux(TabViewId,id){var TabView=document.getElementById(TabViewId);var Tabs=TabView.firstChild;while(Tabs.className!="Tabs")Tabs=Tabs.nextSibling;var Tab=Tabs.firstChild;var i=0;do{if(Tab.tagName=="A"){i++;Tab.href="javascript:tabview_switch('"+TabViewId+"', "+i+");";Tab.className=(i==id)?"Active":"";Tab.blur()}}while(Tab=Tab.nextSibling);var Pages=TabView.firstChild;while(Pages.className!='Pages')Pages=Pages.nextSibling;var Page=Pages.firstChild;var i=0;do{if(Page.className=='Page'){i++;if(Pages.offsetHeight)Page.style.height=(Pages.offsetHeight-2)+"px";Page.style.overflow="auto";Page.style.display=(i==id)?'block':'none'}}while(Page=Page.nextSibling)}function tabview_switch(TabViewId,id){tabview_aux(TabViewId,id)}function tabview_initialize(TabViewId){tabview_aux(TabViewId,1)}
      //]]>
      </script>

      Delete
    2. Sip sip sip, terima kasih mas, saya aja baru menginjak ke semester 6 mas hehe.

      Kebetulan banyak kegiatan di kampus kemarin, Dan sekarang kebetulan saya sedang Kerja Praktek juga mas, jadi antara blogging dengan dunia nyata 25 : 75 lah. Apalagi saya juga sembari jual beli online terutama Handphone mas buat nambah uang jajan selama kuliah, jadi kadang sampai lupa buat ngurusi blog.

      Sekali lagi matur nuwun atas jawabannya, nanti malam akan saya praktekan. Sukses selalu mas :)

      Delete
    3. Sama-sama mas Adit
      Semoga kerja praktek nya juga lancar

      Delete
  9. Hanya bisa tersenyum Mas ^_^

    Aku ga mau kegoda untuk pake slider, aku rasa 1001 Ebook udah pas dengan yang sekarang sederhana tapi elegan (hehehe puji diri sendiri)

    Pokoknya Mantap dech, mungkin suatu saat kalo punya blog baru lagi baru mau pake slider2an.

    Sukses terus buat Maskolis. ^_^

    ReplyDelete
  10. Lg nunggu tutorial slider yang johny jogos .. kapan nih mas ?? mantep tuh mas bwt blog mini game online .. kan kebetulan blog saya jg khusus bwt mini game online..

    ReplyDelete
    Replies
    1. Oke nanti segera dibuat mas, blog mas Donie bakal nampang di showcase nanti, ini bocoran jgn kasih tau siapa2 ya.....

      Delete
    2. hahahahaha .. iya deh gak di kasih tw ke siapa2 ..biar jadi rahasia . rahasia umum maksudnya ..hehehe

      Delete
  11. Mas saya coba pasang slider Carousel untuk post page dari http://www.maskolis.com/2012/04/membuat-slider-carousel-otomatis.html dan cssnya dari Johny Lebay, tapi tampilan halaman depan untuk tab widget, slider atas berubah, juga related post juga berubah.!!??
    Sepertinya kodenya bentrok ya..? kode pa aja yang mesti di pasang jika ingin slider Carousel seperti Johny Lebay agar tidak bertabrakan dengan yang sudah adaa...

    ReplyDelete
    Replies
    1. Nggak bentrok kokk mas, mesti bener masangnya, yg langkah nomer 6, perhatikan showrecentposts itu mesti dikasih nomer belakang beda, misal di template mas Adhy udah ada showrecentposts mesti dibikin beda jadi showrecentposts6 misalnya... gitu

      Delete
    2. Ok mas...makasih buanget...
      Mau dicoba dulu...tar lapor lagi hasilnya...hehehe..

      Delete
  12. maaf mas nggk nyambung dgn yg d post..
    sya mau tnya..hehe.. ada tutorial tentang membuat login/register facebook di blogger nggk,,
    tutorial d blog laen pada sulit d phami mas bhasanya, beda sma maskolis...hehehe..
    trimakasih sebelumnya...

    ReplyDelete
    Replies
    1. mungkin yg kyk d kompas.com..hehe..(jelajahi dgn fb)

      Delete
    2. Wah malah saya nggak tau itu mas... maaf ya
      Jarang sekali mainan FB jadi tiap ada tutorial FB yg berhubungan dgn blogger saya lewati

      Delete
    3. oh gitu...hehe.. ok..makasih.. sukses trus maskolis.. d tunggu slalu postingan2 kenthir dan bermanfaatnya..hehe

      Delete
  13. mas kolis mau nanya blog sya http://banyak-game.blogspot.com/
    mau tak ganti slid seperti ini gimana caranya mas,.bagian2 mana aja yang harus di ganti,..mksi mas,.

    ReplyDelete
    Replies
    1. Hapus semua loopedslider pada template itu, CDD, HTML dan javascriptnya. Baru dimasukkan kode siatas. Tapi yg pada langkah no. 6 mesti digabung dan ganti numposts nya

      Delete
  14. mas mau nanya...
    itu yang themes "Johny Tampan"
    klo mau nambahin menu di sidebar yg tanpa "Menu Accordion" dibawahnya Membuat Menu Accordion gimana mas?
    seperti di widgets sidebar paling atas, khan bukan Membuat Menu Accordion.
    mau bikin di bawah jg dibawahnya.
    bisa bantu...???
    http://movietube.siomponk.com

    ReplyDelete
    Replies
    1. mesti ditambah lagi sidebar-wrappernya mas Herry.
      Misalnya sidebar2-wrapper, juga sidebar2 dan sidebar2 .widget contohnya seperti membuat sidebar1 pada template itu.

      KEmudian letakkan dibawah id='sidebar-wrapper'

      Delete
    2. thq mas kolis pengarahannya, dah sukses...
      visit mas: http://movietube.siomponk.com

      Delete
  15. Maskolis,kenapa di template saya nggak bisa ya...
    yang keluar cuma gambar putih saja...
    coba lihat blogku di www.blog91919.blogspot.com/
    apa ada yang salah kode nya...

    ReplyDelete
    Replies
    1. Kode yg langkah nomer 6 digabung dengan slider bawaan mas, atau hapus dulu kode CSS HTML dan javascript pembentuk slider bawaan. Kemudian baru dipasang slider diatas

      Delete
  16. Mas tolongin saya dong,kenapa headline news nya ga jalan ya,saya udah ganti feature headline news lain tapi tetap ga jalan tapi pas ganti url lain jalan..hizk hizk :(

    sekarang saya putuskan ganti template wuss..

    http://pay-cell.blogspot.com/

    ReplyDelete
    Replies
    1. Udah nggak usah dipasang aja headline newsnya bikin berat. Itu tampilannya udah oke.
      Cuma kalo postingan ada emoticonnya ada bordernya, cara ngilanginnya hapus kode ini :
      .post img,table.tr-caption-container{border:4px solid #ccc}

      Delete
    2. Oke mas nanti tak otak atik lagi,mungkin saya telat memasang headline nya sehingga si mbah ga mau baca semua postingan yang saya buat.

      Maaf mas untuk kode itu fungsinya buat apa yach,dan nanti pengaruhnya apa,saya kurang paham :D

      Delete
  17. maskolis sya dlu prnah nanya d sni mas soal cara membuat video category seperti blog adiknya mas --> maskolis.blogspot.com

    kok smpe skrang blum ada tutorial.a .. soal.a sya sdah dri dlu nunggu.. sjak sbelum mas brhenti untk smentara ngurus blog krn ad urusan.. dn kembali blog smpe skr.. pliss mas... buatin tutorial nya mas.. soal.a tampilannya bagus.. oh ya dn jka dah ada tutorial.a cocok nggak tuh video category saya msukin di blog ane yng johny jogos (game) --> gameterpilih.blogspot.com

    truss sya jga mw nanya mas ada gak template yng nyesuain ukuran sesuai ukuran screen pc msalkan kita main d notebook maka ukurannya full notebook (tanpa ad y ksong) bgitupun ukuran yng lebih besar.. laptop maka ukuran otomatis membesar.. sesuai ukuran laptop..?

    klo ada mas tolong d request

    ReplyDelete
    Replies
    1. Nggak ada yang khusus pada widget video category, tinggal cara postingnya aja seperti di artikel ini :
      http://www.maskolis.com/2012/06/johny-crottube-template-iseng-sambil.html

      Tapi khusus video dari youtube, kalo dari yg lain saya nggak tau

      Yang kedua, templatenya mesti responsif itu mas, di tambahkan @media and screen saya belum mendalamai itu

      Delete
    2. Maksud sya video category yang warna biru di bwah slide pada blog adikmas yang template berita warna biru .. sya lupa namanya.. yng ada slide carousel.a

      klo gak ada.., mas kan yng bikin tmplate.a tuh.. caranya video category.a gmana..

      atau kan udah ada tutorial Membuat Widget Label Tertentu dengan Satu Thumbnail
      nah cara edit.a agar bisa seperti video category yang di template tsb.. gimana ?

      Delete
    3. Tinggal dicari aja yang kode CSS nya #maskois bikin pake itu

      Udah byk tu yg buat template responsif mas, tinggal dicari di Google

      Delete
  18. tambahan mas .. pada blog ane yang diatas johny jogos saya mw pindahin related games nya seperti pada demo diatas jdi nanti saya gantikan iklan yng d blog saya dengan related game.. (mksudnya tukar) cek tampilan blog sya mas gameterpilih.blogspot.com (ucentgame)

    setelah lihat pada artikelnya mas.. pda bagian bawahnya tuh ada iklan nah itu sya akan tukar posisikan dngn related artikel.a/game.a gmana mas ?

    ReplyDelete
    Replies
    1. Nggak ngerti maksudnya saya pertanyaan ini?
      Bisa dikasih screenshotnya mas?

      Delete
    2. itu tuh mas blog ane gameterpilih.blogspot.com
      gimana agar related articlenya sama seperti yang demo http://johnydarkmag.blogspot.com/ diatas.. simple aja kan (posisi)

      sbelumnya liat dlu mas bentuk tampilan related postnya di blog ane..

      kan mas yang buat tuh...
      beda kan? sya mw samain gmana tuh mas ?

      Delete
    3. Seperti ini maksudnya :
      http://www.maskolis.com/2012/03/membuat-related-post-thumbnail-dan.html

      Kalo iya warna background dll dirubah sendiri ya

      Delete
    4. ia mas.. tapi saya sudah ada di blog.. krna bawaan template johny jogos..

      tapi sya mau tampilan.a seperti itu mas.. posisi.a pada bawah post sebelah kanan dan jumlah post.a.. cara editnya.. gmana mas sya mesti cari kode apanya untuk mindahin.a
      agar seperti posisi related post sama dengan yang mas contohkan

      Delete
    5. klo gitu gini aja mas.. cara hapus related post nya pada template johny jogos gimana mas.. sya mw bikin ulang..

      Delete
    6. mas udah berhasil.. setelah saya utak atik.. dn akhirnya jdi.. coba di cek mas.. maksud saya seperti ini.. dn mas tolong bri tanggapan.a yah..
      ini contoh maksud saya related post visit this --> http://www.ucentgame.cc.cc/2012/10/jungle-assasins-game.html

      thanks sebelumnya

      Delete
    7. oh ya! maskolis bsa nggak.. related postnya di beri tombol next agar semua yang terkait bisa tampil.. klo bisa kasi tau donk cara.a ???

      Delete
  19. Maskolis Memang Mantep.. Salut.. Like this ..

    ReplyDelete
  20. mas mohon pencerahannya kok ada yang aneh dengan slider saya mas coba di cek mas!!http://downgames-movie.blogspot.com/

    cek di :

    makasi banyak ms

    ReplyDelete
  21. maskolis, ini gimana kok di template saya kode tidak ada, saya baru mulai tancap tkp ini

    ReplyDelete
  22. Mantabs Mas slidernya...Thanks. Cuman kayaknya ada yang salah sama slider ini setelah dipasang di blog ane Mas. Tidak seperti yang di demo nya Mas. perpindahan slide yang di demo seperti berpantul pantul, sedangkan yang dipasang di blog ane...biasa saja seperti slider pada umumnya...mohon pencerahannya...o ya blog ane ini www.propertijabar.com, boleh kunjungan buat lihat slidernya Mas....sekali lagi thanks Mastah...

    ReplyDelete
    Replies
    1. Tinggal ganti aja mas, kode langkah nomer 7 dari :
      easing:'easeInOutQuad', jadi
      easing:'easeOutBounce',

      Delete
  23. Cakep banget template yang ini... Maskolis, coba bikin forum buat pengunjung setia nya.. Pasti dijamin rame.. :D

    ReplyDelete
  24. sangat menarik dilihat, dan tentunya sangat bermanpaat sekali Mas.
    terimakasih.

    ReplyDelete
  25. nice bangaet sy sdh pake, tp gmn kalau mau ganti warna di setiap gambar slide kecilnya??? mohon bantuanya mas...

    ReplyDelete
  26. kalo mau pake loflider yg demo ke 4 gmn mas.. cara bikin otomatisnya?

    ReplyDelete
  27. Askum. Mas Boleh minta link dari download template ini gak http://johnydarkmag.blogspot.com/?

    ReplyDelete
  28. Nanti klo template jhonnydarkmag nya udah jadi posting yaa

    ReplyDelete
  29. saya tidak membetulkan segala-galanya, ia muncul, tetapi jquery tidak berfungsi

    ReplyDelete
  30. ngga jalan, cuman satu doank muncul judul postingannya, padahal harusnya 10, ??? :d

    ReplyDelete
  31. mas saya pengguna template borneo, apakah slider ini bisa saya gunakan di blog saya, meski saya pakai template borneo tapi utk slider bawaan borneo tdk saya tampilkan. saya coba ikuti cara diatas tapi koq kyknya ada file yg bentrok ya mas, gmn solusinya. klo pun harus ada file html yg hrs saya hapus itu yg mana ya?

    ReplyDelete
    Replies
    1. Hi Ayu Dewi,

      2 (dua) blog kami juga menggunkan Template yg sama seperti template blog kamu dan saya juga menggunakab > Modifikasi Slider Lofslidernews Otomatis Maknyus < di 2(dua) blog Template Template yg sama seperti template blog kamu dan hal hasil > Modifikasi Slider Lofslidernews Otomatis Maknyus < berhasil terpasang di 2(dua) blog kami :)

      Delete
    2. saya sudah coba pasang and its work, tapi kyknya ada yg ane di tempat saya ada pic yg tampil doble gitu mas coba deh liat dimari www.medanmetropolis.com ini salahnya apa ya?

      Delete
  32. mas cara membuat postingannya hanya judulnya saja gimana di home/beranda hehe..trimakasih mohon bimbingannya

    ReplyDelete
  33. Dear Maskolis,

    Terima kasih kami ucapkan iya maskolis buat

    > Modifikasi Slider Lofslidernews Otomatis Maknyus <

    Sesuai dgn judul artikel diatas mank cocok sekali dengan

    > Slider Lofslidernews Otomatis <

    dan Slider Lofslidernews Otomatis nya kami pasang di 2(dua) blog kami anatra lain :

    1. http://www.technology-portfolio.net
    2. http://luswandy-ngeblog.blogspot.com

    Sblmnya kami minta maaf iya maskolis krn kami berkomnetar sambil meninggalkan 2 URL blog kami, tp ini wujud dr apresasi kami terhadap karya2 maskolis :).

    Terima Kasih

    ReplyDelete
  34. mas kholis saya mau menanyakan blog saya kok silidernya terlebah jadi dua..gambarnya agar tetap fixed gimana ya : http://percab1.blogspot.com/ mohon bimbingannya

    ReplyDelete
  35. I am receiving this error: Error parsing XML, line 870, column 7: The content of elements must consist of well-formed character data or markup.

    How do I fix it?

    ReplyDelete
    Replies
    1. The code no 2 in main wrapper is giving me the error. The element type "b:if" must be terminated by the matching end-tag ""

      Delete
  36. Aslkm, Maaf mas saya kurang paham dengan: Keterangan :
    Tulisan warna merah (misteri) adalah label yang saya masukkan pada slider. Silahkan diganti dengan label yang ingin ditampilkan.
    maksudnya apa ya, label itu apa? mohon penjelasnnya terimakasih

    ReplyDelete
    Replies
    1. Maaf bang Kolis, bukannya melangkahi, saya ijin share...
      bang ucusejahtera, waktu abang buat suatu post dalam blog abang, disebelah kirikan ada tulisan " SETELAN ENTRI " trus dibawahnya ada tulisan " LABEL " nah waktu abang membuat suatu post pasti mengisi label tersebut, : Contoh abang menulis tentang makanan pastinya labelnya ya " MAKANAN " itulah yang abang ganti untuk Tulisan ( Misteri ) Yang berwarna merah pada contoh di atas.

      Cari dulu label apa yang cocok untuk di tampilkan di slide nya, baru ganti tulisan ( Misteri ) itu dengan label abang.

      Delete
  37. Makasih bang atas semua ketersediaan abang untuk selalu berbagi kepada kami semua, Semoga abang makin sukses dan sehat selalu agar tetap exsis dalam memberikan ilmu yang berharga ini.di kemudian hari.

    ReplyDelete
  38. Bang kolis yang terhormat..
    bagaimana caranya agar slide nya mempunyai keterangan gambar, agar semakin sempurna slidenya bang, soalnya kalo jmlh comentnya yang di tampilkan ada kurangnya dikit...

    jangan di hiraukan bang bila pertanyaan dan permintaan itu terlalu merepotkan abang.

    ReplyDelete
    Replies
    1. Penambahannya agak banyak mas, coba perhatikan slider pada template ini : http://johnyjijay.blogspot.com/

      Pehatikan kode css dan tambahan pada kode scriptnya

      Delete
    2. thx mas , baru bls..
      makasih atas ilmunya mas...

      salam

      Delete
  39. mas kolis pas di !! step no 4 yang ((((Kemudian untuk memunculkannya pada layout (diatas blog post), anda harus memanggilnya. Cari kode kemudian letakkan kode berikut dibawahnya :
    view plainprint?))))

    teruskan masukin kode dibawhnya ya ,
    kenapa saya ada tulisan merah yang mengatakan
    More than one section was found with id: slide. Section IDs should be unique.

    maksudnya apa mastolong dibantu?

    ReplyDelete
  40. Mas...
    saya sudah terapkan di blog sya..
    tapi saya mau nanya ni mas..?
    bagaimana cara mengecilkan gambar yang ada pada yang bergerak itu mas...?
    dan cara membingkai gambar tersebut?
    terima kasih banyak yoo

    ReplyDelete
    Replies
    1. blog saya yang ini mas : http://softsharest.blogspot.com/

      Delete
    2. Cari kode ini :
      .slider-navigator li img{border:#ddd solid 1px;height:44px;width:60px;float:left;margin:5px 5px 5px 0}

      Silahkan dirubah, height dan width pda kode itu

      Delete
  41. I got an error when i put this code in my template

    when i put the second code below (div id='main-wrapper') then i receive this error: Error al analizar XML, línea 653, columna 182: The element type "b:if" must be terminated by the matching end-tag ""

    please help me!!!

    ReplyDelete
    Replies
    1. Do not in translate position when you took the code above.

      Delete
    2. Mas i'm trying to replace Johny Sompret Banget template slide-show for this one. Could you tell me if i have to remove some script from this template before fallow this instruccion, and wich one do i have to remove?

      Delete
  42. maskolis,, sy coba2 pasang slider diatas pada blog geleigege.blogspot.com tapi kok gambar slide gak muncul y? klu ada waktu tolong koreksinya,, makasih

    ReplyDelete
    Replies
    1. sy jawab sendiri maskolis :D,, ternyata slidenya sdh normal setelah terlebih dahulu sy kuras abis smua isinya. skali lagi terima kasih banyak smoga maskolis rejekinya smakin baik krn sdh banyak membantu org lain,, aminn

      Delete
  43. terima kasih tutorialnya dan sudah berhasil dipasang diblog saya iqbalanas.com

    ReplyDelete
  44. ngga jalan, cuman satu doank muncul judul postingannya, padahal harusnya 10

    ReplyDelete
  45. mas kolis blog saya akbaripa.blogspot.com
    yang menu1 drop1 dll,,itu bagaimana mengeditnya yah,biar bisa berfungsi..makasih mas,,

    ReplyDelete
  46. gagal terus membuat slidernya kenapa ya mas apa yang salah padahal sudah sesuai bisa lihat di siarkan.blgospot.com

    ReplyDelete
  47. keren bgt mas,,,, tp ada yg mo saya tanyakan, untuk menghilangkan tgl dan comment di big imagenya, edit apa ya?

    ReplyDelete
  48. mas kalo slider ini mau diterapkan di template johny sompret banget kode yg mana saja yg harus dihapus / dirubah? mohon bantuannya mas :)

    ReplyDelete
  49. mas..help..saya dah kotak katik, tapi kenapa ya tetep slider saya gak bisa gerak-gerak, dan gak bisa di klik...please help... blog saya bisnisyuk.com

    ReplyDelete
  50. keren slidernya mas..makasih telah berbagi template dan ilmunya,sekalian ijin pakai template jony ganteng,semoga mendapat balasan dari yang maha Kuasa,amin. silahkan mampir mas di blog saya http://variasipartmotor.blogspot.com/

    ReplyDelete
  51. makasih infonya ya bro, sy dah pake script-nya nih
    visit my blog: http://e-basindo.blogspot.com

    ReplyDelete
  52. keren banget mas makasih http://inilahmisteri.blogspot.com/

    ReplyDelete
  53. kok gak berhasil ya,,
    ini hasilnya amazingunesco.blogspot.com

    ReplyDelete
  54. Mas slide nya kok gk mau kurang apa nieh mas? tolong http://lahpisle.blogspot.com/

    ReplyDelete
  55. slide nya keren mas sudah saya terapkan di blog saya
    http://dhonieblog.blogspot.com hasilnya maknyus dan top dah

    ReplyDelete
  56. Waw keren banget mas. udah ane pasang coba liat http://www.bloggerawn98.com

    ReplyDelete
  57. slidenya Ahli Kompi mau diganti juga ah seperti di atas

    ReplyDelete
  58. Assalamualaikum maskolis,

    mas. mau nanya ni
    kalo slidernya nggak berfungsi caranya gimana ya?
    nih blog saya : http://aulianza-blog.blogspot.com/
    mohon bantuannya mas ya!
    Terimakasih.

    Wassalam.

    ReplyDelete
    Replies
    1. ini email saya mas : aulianza@yahoo.com

      Delete
  59. mas, saya pake slider ini tapi tampilan slidernya di blog saya kok ngga sempurna, apa sya ada yg salah dalam mencopy javascriptnya,,?? tolong di liet ya mas
    pesona-belitung.blogspot.com

    ReplyDelete
    Replies
    1. ini email saya mas : ikhsyidblog@gmail.com

      Delete
  60. Mas, thanks bangget ya. Dah jalan. Tinggal rubah-rubah dikit.

    http://tokohamsterjakarta.blogspot.com/

    ReplyDelete
  61. mas kolis tnya,,, setelah saya pasang kenapa gambarnya gakt ampil ya? kok malah no image?? ada yg peru di perbaiki gak mas? udah aku jalankan apa yang udah ada di tutorial ni....

    ReplyDelete
  62. < div id='main-wrapper '>
    itu gak ada sama gue

    ReplyDelete
    Replies
    1. sm dengan template saya mas. cb cari yang ini

      div class='clearfix' id='main-wrapper'>

      pengalaman pribadi itu berhasil.di inginbelajar31.blogspot.com

      Thnk buat maskolis ilmu yang sgt berharga buat newbe

      Delete
    2. Sama saya juga seperti itu. Gmana ya?

      Delete
  63. Asyik banget nih nge-modif slider nya! Kebetulan saya belum pernah pakai slider beginian, jadi cuma bisa baca-baca postingan nya dlu nih. :D

    ReplyDelete
  64. dah muncul slidenya tapi koq di klik gak ada respons aliat gak kebuka halaman yang di klik mas
    trus cara pindah posisinya gmn ya mas, munculnya di pojok kanan atas pengennya seh di sidebar kanan, makasi mas..

    ReplyDelete
    Replies
    1. Maap ni ye om admin ane jawab pertanyaan dari agan ivan..

      agan masukin berapa label ? di atas kan ada 2 tulisan "misteri" , 2 "misteri" itu di isi harus di isi 1 label yang sama , bukan 2 label .
      Fungsi "misteri" yang ke-1 : menampilkan Slider yang Gede ( membuka postingan )
      Fungsi "mister" yang ke-2 : menampilkan slider yang kecil (Untuk Menampilkan Jumlah Postingan di label itu , klo di klik postingan nya bakal tampil di slider yang gede)

      CMIIW^^

      Delete
    2. Udah kok mas Iko dah saya masukin di 2 tulisan yg warna merah dgn nama label yg sama yang saya mau tampilkan tapi ttp aja mas koq gk respons waktu di klik :( apa ada yg salah lagi ya... hikzz..

      Delete
  65. mantapp.... nih.... mas....
    terimasih.. baru aja... ane pake... hehehehehe.. muantepp... loh... mas.....

    ReplyDelete
  66. my blog is asfalistikosklados.blogspot.gr
    can u see it and tell me why the first slider doesnt work ?
    thanks

    ReplyDelete
  67. Mas Kenapa ya silde saya gk jalan?
    saya masih bingung yang mana harus di ganti untuk menjalankan slide nya mas.

    ReplyDelete
  68. my blog is asfalistikosklados.how can i put this slider in my blog cause i have other slider and doesnt work when i try to put this

    ReplyDelete
  69. cara mencoba mengunduh kok ngak bisa ya mas, harus pakek yang berbayar gitu mas

    ReplyDelete
  70. wah mantap gan terimakasih,,,,, succsess

    ReplyDelete
  71. Assalamualaikum mas Kolis,
    Saya pengguna template "Johny Ajaib" dan mempergunakannya untuk website berita. Slider yang diatas sudah terpasang manis di web saya. Pertanyaannya, apakah bisa slider tsb dijadikan renponsive slider agar terlihat di laman ponsel? Jika bisa, bagaimana seharusnya kode dan penempatannya dlam template.
    email saya : redaksi.kluetmedia@gmail.com

    mohon pencerahannya masa, trimakasih

    ReplyDelete
  72. hi im using your http://cargam-mangazine.blogspot.com/ template just want to ask how can i make the slider on the top work and the labe 1 to label 7 to appear kindly visit so you can see it www.stunninginterestingfacts.com the other parts is working perfectly. i tried to follow your instructions in this site http://www.maskolis.com/2013/01/modifikasi-slider-lofslidernews.html but theres something wrong about it take a look www.entireasia.blogspot.com i put the slider on top and make it work but the problem is the slider on the bottom stock and its not working anymore. i already translated all the comment here one by one i cant find the answer so i decided to make a comment here.

    1. how can i make the top slider work w/o making the bottom slider stop to work
    2. how can i make the label1 to label7 appear? just like in this sample http://cargam-mangazine.blogspot.com/

    thank you for your help ^_^

    ReplyDelete
  73. Pas saya Find kok gak ketemu.? Mohon bantuannya ]]>

    ReplyDelete
  74. Thanks banget maskolis, Semua nya work, sudah saya coba di blog saya.
    Follow my blog , Backlink ?? Just Coment oke..
    http://ndandys.blogspot.com/

    ReplyDelete
  75. DINA SHOP : Barang yang Kami Tawarkan Semuanya Barang Asli Original Garansi Resmi Distributor dan Garansi TAM .
    Semua Produk Kami Baru dan Msh Tersegel dLm BOX_nya.
    BERMINAT HUB-SMS:0896-9198-6257 ATAU KLIK WEBSET RESMI KAMI http://www.dina-shop7.blogspot.com/
    BlackBerry>Samsung>Nokia>Apple>Acer>Dell>Nikon>DLL

    Dijual

    Ready Stock !
    BlackBerry 9380 Orlando - Black
    Rp.900.000,-

    Ready Stock !
    BlackBerry Curve 8520 Gemini
    Rp.500.000,-

    Ready Stock !
    BlackBerry Bold 9780 Onyx 2
    Rp.800.000,-

    Ready Stock !
    Blackberry Curve 9320
    Rp.700.000,-

    Ready Stock !
    Samsung Galaxy Tab 2 (7.0)
    Rp. 1.000.000

    Ready Stock !
    Samsung Galaxy Nexus I9250 - Titanium Si
    Rp.1.500.000,-

    Ready Stock !
    Samsung Galaxy Note N7000 - Pink
    Rp.1.700.000

    Ready Stock !
    Samsung Galaxy Y S5360 GSM - Pure White
    Rp.500.000,-

    Ready Stock !
    Nokia Lumia 800 - Matt Black
    Rp.1.700.000,-

    Ready Stock !
    Nokia Lumia-710-white
    Rp. 900.000,-

    Ready Stock !
    Nokia C2-06 Touch & Type - Dual GSM
    Rp.450.000,-

    Ready Stock !
    Nokia Lumia 710 - Black
    Rp. 900.000,-

    Ready Stock !
    Apple iPhone 4S 16GB (dari XL) - Black
    Rp.1.200.000,-

    Ready Stock !
    Apple iPhone 4S 16GB (dari Telkomsel)
    Rp.1.200.000,-

    Ready Stock !
    Apple iPod Touch 4 Gen 8GB
    Rp.700.000

    Ready Stock !
    APPLE iPod Nano 8GB - Pink
    Rp.500.000,-

    Ready Stock !
    Acer Aspire 4752-2332G50Mn Core i3 Win7 Home
    Rp 1.300.000

    Ready Stock !
    Acer Aspire S3-951-2364G34iss
    Rp. 1.200.000,-

    Ready Stock !
    Acer Aspire 5951G Core i7 2630 Win 7
    Rp. 2.500.000,-

    Ready Stock !
    Acer Aspire 4755G Core i5 2430 Win 7 Home Premium Green
    Rp. 2.500.000,-

    Ready Stock !
    Nikon D7000 kit 18-105mm
    Rp.1.700.000

    Ready Stock !
    Nikon D90 Kit 18-105mm Vr
    Rp 1.300.000

    Ready Stock !
    Nikon Coolpix L 120 Red
    Rp. 900.000

    Ready Stock !
    Nikon Coolpix P 500 Black
    Rp 1.000.000

    ReplyDelete
  76. Wah mantap mas slidernya,, oy mas kalau template yg seperti di demo dmn downloadnya ya??

    ReplyDelete
  77. Maskolis kalo adanya ( class='main-wrapper'> ) gimana dong?

    saya pakai Tempalte Jhony Asal Responsive

    ReplyDelete
  78. bisa untuk blog video youtube gak mas?

    ReplyDelete
  79. mas ini ada koreksi kesalahan di kode untuk box html yang mas tulis di atas

    main-wapper? mungkin main-wrapper.

    dan anyway, saya sudah cari-cari main-wrapper ini ga nemu2 di kotak edit html

    ReplyDelete
  80. This comment has been removed by the author.

    ReplyDelete
  81. kok di html template saya ga ada kode div id='main-wrapper' mas?

    ReplyDelete
  82. Ass.WWb.Mau tanya Mas gambar pagination nya ga muncul kenapa ya? mungkin gak kompak theme nya dg sya. http://pkbm-prisma.blogspot.com/

    ReplyDelete
    Replies
    1. assalamualaikum..
      mas, mohon bimbingannya dong.
      uda aku coba, tapi slide shownya gx nampil
      http://pemboeroeilmoe.blogspot.com/

      Mohon sangat pencerahannya maskolis

      Delete
  83. Produk dijamin asli
    TILLA SHOP : Barang yang Kami Tawarkan Semuanya Barang Asli Original Garansi Resmi Distributor dan Garansi TAM .
    Semua Produk Kami Baru dan Msh Tersegel dLm BOX_nya.
    BERMINAT HUB-SMS:0896-9198-6275 ATAU KLIK WEBSET RESMI KAMI
    BlackBerry>Samsung>Nokia>Apple>Acer>Dell>Nikon>DLL

    Dijual

    Ready Stock !
    BlackBerry 9380 Orlando - Black
    Rp.900.000,-

    Ready Stock !
    BlackBerry Curve 8520 Gemini
    Rp.500.000,-

    Ready Stock !
    BlackBerry Bold 9780 Onyx 2
    Rp.800.000,-

    Ready Stock !
    Blackberry Curve 9320
    Rp.700.000,-

    Ready Stock !
    Samsung Galaxy Tab 2 (7.0)
    Rp. 1.000.000

    Ready Stock !
    Samsung Galaxy Nexus I9250 - Titanium Si
    Rp.1.500.000,-

    Ready Stock !
    Samsung Galaxy Note N7000 - Pink
    Rp.1.700.000

    Ready Stock !
    Samsung Galaxy Y S5360 GSM - Pure White
    Rp.500.000,-

    Ready Stock !
    Nokia Lumia 800 - Matt Black
    Rp.1.700.000,-

    Ready Stock !
    Nokia Lumia-710-white
    Rp. 900.000,-

    Ready Stock !
    Nokia C2-06 Touch & Type - Dual GSM
    Rp.450.000,-

    Ready Stock !
    Nokia Lumia 710 - Black
    Rp. 900.000,-

    Ready Stock !
    Apple iPhone 4S 16GB (dari XL) - Black
    Rp.1.200.000,-

    Ready Stock !
    Apple iPhone 4S 16GB (dari Telkomsel)
    Rp.1.200.000,-

    Ready Stock !
    Apple iPod Touch 4 Gen 8GB
    Rp.700.000

    Ready Stock !
    APPLE iPod Nano 8GB - Pink
    Rp.500.000,-

    Ready Stock !
    Acer Aspire 4752-2332G50Mn Core i3 Win7 Home
    Rp 1.300.000

    Ready Stock !
    Acer Aspire S3-951-2364G34iss
    Rp. 1.200.000,-

    Ready Stock !
    Acer Aspire 5951G Core i7 2630 Win 7
    Rp. 2.500.000,-

    Ready Stock !
    Acer Aspire 4755G Core i5 2430 Win 7 Home Premium Green
    Rp. 2.500.000,-

    Ready Stock !
    Nikon D7000 kit 18-105mm
    Rp.1.700.000

    Ready Stock !
    Nikon D90 Kit 18-105mm Vr
    Rp 1.300.000

    Ready Stock !
    Nikon Coolpix L 120 Red
    Rp. 900.000

    Ready Stock !
    Nikon Coolpix P 500 Black
    Rp 1.000.000

    ReplyDelete
  84. Produk dijamin asli
    TILLA SHOP : Barang yang Kami Tawarkan Semuanya Barang Asli Original Garansi Resmi Distributor dan Garansi TAM .
    Semua Produk Kami Baru dan Msh Tersegel dLm BOX_nya.
    BERMINAT HUB-SMS:0896-9198-6275 ATAU KLIK WEBSET RESMI KAMI
    BlackBerry>Samsung>Nokia>Apple>Acer>Dell>Nikon>DLL

    Dijual

    Ready Stock !
    BlackBerry 9380 Orlando - Black
    Rp.900.000,-

    Ready Stock !
    BlackBerry Curve 8520 Gemini
    Rp.500.000,-

    Ready Stock !
    BlackBerry Bold 9780 Onyx 2
    Rp.800.000,-

    Ready Stock !
    Blackberry Curve 9320
    Rp.700.000,-

    Ready Stock !
    Samsung Galaxy Tab 2 (7.0)
    Rp. 1.000.000

    Ready Stock !
    Samsung Galaxy Nexus I9250 - Titanium Si
    Rp.1.500.000,-

    Ready Stock !
    Samsung Galaxy Note N7000 - Pink
    Rp.1.700.000

    Ready Stock !
    Samsung Galaxy Y S5360 GSM - Pure White
    Rp.500.000,-

    Ready Stock !
    Nokia Lumia 800 - Matt Black
    Rp.1.700.000,-

    Ready Stock !
    Nokia Lumia-710-white
    Rp. 900.000,-

    Ready Stock !
    Nokia C2-06 Touch & Type - Dual GSM
    Rp.450.000,-

    Ready Stock !
    Nokia Lumia 710 - Black
    Rp. 900.000,-

    Ready Stock !
    Apple iPhone 4S 16GB (dari XL) - Black
    Rp.1.200.000,-

    Ready Stock !
    Apple iPhone 4S 16GB (dari Telkomsel)
    Rp.1.200.000,-

    Ready Stock !
    Apple iPod Touch 4 Gen 8GB
    Rp.700.000

    Ready Stock !
    APPLE iPod Nano 8GB - Pink
    Rp.500.000,-

    Ready Stock !
    Acer Aspire 4752-2332G50Mn Core i3 Win7 Home
    Rp 1.300.000

    Ready Stock !
    Acer Aspire S3-951-2364G34iss
    Rp. 1.200.000,-

    Ready Stock !
    Acer Aspire 5951G Core i7 2630 Win 7
    Rp. 2.500.000,-

    Ready Stock !
    Acer Aspire 4755G Core i5 2430 Win 7 Home Premium Green
    Rp. 2.500.000,-

    Ready Stock !
    Nikon D7000 kit 18-105mm
    Rp.1.700.000

    Ready Stock !
    Nikon D90 Kit 18-105mm Vr
    Rp 1.300.000

    Ready Stock !
    Nikon Coolpix L 120 Red
    Rp. 900.000

    Ready Stock !
    Nikon Coolpix P 500 Black
    Rp 1.000.000

    ReplyDelete
  85. manteb, kayaknya cocok nih ditaruh di templateku...

    ReplyDelete
  86. gambarnya gak work mas malah no image semua , padahal kan postinganku ada imagenya .

    ReplyDelete
  87. This comment has been removed by the author.

    ReplyDelete
  88. Tks atas kode nya mas, sangat membantu.

    ReplyDelete
  89. Idzin simak @Mas mantap dan akurat....@Mas artikel nya yah salam sukses...?
    Karrysta - http://karristaent.blogspot.com

    ReplyDelete
  90. Hola Maskolis. Con algunos tutoriales que muestra como el de arriba, no he tenido suerte. Por si no lo ha notado, algunos que dicen abierto no muestran nada y es imposible entonces seguir las indicaciones al pie de la letra para los óptimos resultados.

    ReplyDelete
  91. This comment has been removed by the author.

    ReplyDelete
  92. terima kasih slider maknyus'a, sudah berhasil terpasang di web saya..
    inspirasi-idebisnis.com

    ReplyDelete
  93. ane nyari main-wrapper kok ngak ada ya bang???

    ReplyDelete
  94. Wah-wah, buat widget nih butuh perjuangan banget, nyesuaiin ukuran slide sama blog saya susah banget. Apalagi ngubah1 kode di atas nunggu nya lama amat. Tapi alhamdulilah widget nya udah pas. Visit ya -> http://farrijtriannafiu.blogspot.com/

    ReplyDelete
  95. makasih tutorialnya gan, berhasil dipasang. silahkan dicek dan tolong diberikan masukan tentang kekurangannya....

    ReplyDelete
  96. mas klo slidernya jai random post gmn ?

    ReplyDelete
  97. kode ini "div id='main-wrapper'" gk ada mas di blog ane, gmn dunk ???

    ReplyDelete
  98. Maaf aku masi awam di blogspot.

    mengapa ya, image link di template blogspot itu mesti selalu pakai http://1.bp.blogspot.com/ ?

    kalau saya mengganti link image untuk template misalnya ( https://lh6.googleusercontent.com/-vmc48TG6CR4/UtOnY-LNjQI/AAAAAAAAAVM/shYcVz09V4o/w28-h85-no/navmiddle.png )
    apakah berpengaruh untuk SEO ?

    atau bagaimana kalau aku ingin buat link image dg mode ( bp.blogspot.com ) ?
    mohon pencerahan ?

    ReplyDelete
  99. mas, mau nanya, kenapa slider di blog saya tidak bergerak atau berganti secara otomatis.

    coba dilihat blog saya : http://www.steven-amikomjogja.web.id

    ReplyDelete
  100. no image ? bagai mana nih maskolis... solusi nya?? gak kedetek gambar post nya bingung ...

    ReplyDelete
  101. Mas, salah satu konten di slider saya klik kok slidernya tetep keluar ya? padahal di Demonya tidak keluar pas di klik...

    ReplyDelete
  102. Halo mas, mau tanya, ada template untuk expedisi export /import tidak? thanks

    ReplyDelete
  103. Nitip link ya mas :)

    http://inisukabumi.blogspot.com/

    ReplyDelete

No comment moderation in this page
Do not put the link in this comment, I'll make it disappear forever
I hate when people play cheat to increase their blog, meanwhile everyone else do it politely and honestly

 
CREATING WEBSITE © 2012 the other blog Mas Template | Look at this Johny Template | Powered by Blogger