Ana içeriğe atla

Blogger Menü Çubuğu Altında Otomatik Yeni Slider Eklentisi

Blogger, Ana sayfa Menü gezinme çubuğunun hemen altına eklenebilen gövde kısmında büyük resim, yazı linki ve hemen sağ tarafında alt alta sıralı 5 adet farklı yazılardan oluşan Otomatik Yeni Slider Eklentisi. İmrenerek kullanmak istediğiniz özel tasarım blog temalarını aratmayacak kadar güzel, her blog yazarının sahip olması gerektiği, kurulumu biraz dikkat edilerek yapıldığında çok basit bir eklenti. Menü Çubuğu Altında Otomatik Yeni Slider Eklentisi ilk bakışta size zor gibi gelebilir. Ancak eklentinin nasıl kurulduğu ile ilgili adımları iyice okuyarak takip ettiğinizde çok basit bir şekilde blogunuza kurabileceksiniz.

Bir önceki yazımızda, farklı bir slider eklentisi olan, etiketleri kullanarak menü çubuğunun altında, blog kayıtlarının üstünde otomatik olarak ilerleyen Manşet formatında Slider Etiket Eklentisinden bahsetmiştim. Bu yeni eklentimizde aynı etiket mantığı ile çalışmakta. Sadece etiketleri değiştirerek her hafta okuyucu kitlenize etiketleriniz yardımı ile farklı yazılarınızı Yeni Slider gadgetinizde sunabilirsiniz.

Otomatik Slider Eklentisinin mantığı bir önceki yazımda belirttiğim gibi, blog yazılarınıza eklediğiniz etiketlerin şablon kodlarınızda bulunan Feeds yardımı ile okunarak, Yazı başlık linki, Yazı resmi ve Yazı kısa açıklamsının akıcı olarak  dönüşümünden oluşuyor. Eklentinin diğer özellikleri, etiketinize bağlı olarak, kaç adet resimli açıklamalı yazınızın otomatik dönmesini  belirleyebiliyorsunuz.  Hazırsanız Otomatik Yeni Slider Eklenti kurulum aşamalarına başlayalım. DEMO

Menü Çubuğu Altında Otomatik Yeni Slider Eklenti Kurulumu :

1. Blogger kumanda penelinize girerek, öncelikle “Çok önemliBlogunuzun yedeğini alın.
2. Blogger kumanda paneli → Şablon → Html’yi Düzenle yolunu takip ederek şablon kodlarınızı açın ve (CTRL + F) ile, ( ]]></b:skin> ) bu etiketi bulun. Etiketi bulduğunuzda aşağıdaki kodları kopyalayın ve bulduğunuz etiketin üstüne yapıştırıp kaydedin.
* 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;} 
3. Bu yaptığımız işle ile, Blog yerleşim alanına bir Gadget eklemiş oluyoruz. İşlemi tamamlamak için devam ediyoruz. 4. Html kodlarınızda Ctrl+F yardımı ile, aşağıdaki etiketi bulun ; <div class='column-center-outer'> Bulduğunuz bu etiketin hemen üst kısmına aşağıda verilen kodları yapıştırın. 5. Özel şablonlarda bu etiket <div id='main-wrapper'> olarak bulunmaktadır. Kullandığınız şablon özelliğine göre arayacağınız etiketi belirleyin.
<b:if cond='data:blog.url == data:blog.homepageUrl'>
 <div id='slide-wrapper'>
<b:section class='slide' id='slide' preferred='yes'/>
 </div>
</b:if>  
6. Şu ana kadar yaptığımız işlemler sonucunda, Blog yerleşim alanına eklediğimiz boş gadgetimiz aşağıdaki resim gibi görülmekte. Ancak biz kod eklemeye devam edeceğiz.

  7. (CTRL + F) ile, ( ]]></b:skin> ) bu etiketi bulun. Etiketi bulduğunuzda aşağıdaki kodları kopyalayın ve bulduğunuz etiketin üstüne yapıştırıp kaydedin.
/* 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}
 
8. Yukarıda verilen kodlar için Genişlik ve Yükseklik ayarları mavi ile belirtilmiştir. Temanızın genişliğine göre bu, ( width:600px; height:298px; ) ayarları değiştirerek eklentiyi sayfanızın genişliğine göre düzenleyin. 9. Aşağıda verilen kod içinde ( 1.8.2/jquery.min.js ) kırmızı renkli olan. Blogunuzda daha önceden kullandığınız bir eklentide varsa bu satırdaki kodları silin. Daha önceden kullanmadı iseniz olduğu gibi bırakın. 10. Şimdi, Şablon, Html kodlarınız içinde bulunan ( </head> ) kapanış etiketini, CTRL+F penceresinde aratıp bulun. 11. Aşağıdaki kodları kopyalayıp bulduğumuz ( </head> ) etiketinin üst kısmına yapıştırın.
<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>

12. numposts = 10; Yukarıdaki kod içinde mavi ile belirtilen etiketinize bağlı yazı sayısı (10 adet) belirtilmiştir. Bence yeterli bir sayıdır. Ancak etiketinizde daha fazla yazı varsa bu sayısı değiştirebilirsiniz. Şimdi şablonunuz kaydedin ve Yerleşim alanına gidin.
13. Yukarıda 6’ıncı maddedeki resimde gördüğünüz gibi yerleşim alanında “Slide” isimli bir boş bir Gadget ekle alanı göreceksiniz. Gadget ekle tıklayın ve HTML/JavaScript gaggetini açıp Aşağıdaki kodları kopyalayıp gadget içine yapıştırın.
<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/-/etiket?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/-/etiket?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>
14. Yukarıdaki kod içinde mavi ile belirttiğim “etiket” isminin olduğu her iki yere etiketinizi yazın ve gadgeti kaydedin. Gadgeti tutun ve Blog kayıtları gadgetinin üst kısmına sürükleyip bırakarak blogunuzu kaydedin. Şu anda blogunuzu ön izleyerek, Blogger Menü Çubuğu Altında Otomatik Yeni Slider Eklentisini görebilirsiniz. Biraz dikkat ve sabırla bu işlemi yapabilirsiniz. Farklı eklentilerde buluşmak üzere kolay gelsin.

Bu blogdaki popüler yayınlar

Paint Net ile Resim arka plan Görüntüyü Şeffaf Yapma

Paint Net Resim editörü ile, Web sitenize yükleyeceğiniz resmin arka plan görüntüsünü görülmez şeffaf, transparan yaparak kullanabilirsiniz. Site başlık resmi, arka plan resmi, banner, logo, transparan resim ve çeşitli efekt araçlarını Paint.NET ücretsiz resim editörünü kullanarak yapmanız mümkün. Bilgisayarınıza Paint.NET ücretsiz resim editör programını kurmadı iseniz aşağıda verilen bağlantı linki ile programı indirip ücretsiz kullanın. 
Paint.NET resim editör programını zip sıkıştırmasından çıkardıktan sonra kurdugunuzda, program Ingilizce olarak karşınıza çıkacaktır. Diğer zip dosyasını da kurarak Türkçe’e çevrilmiş olarak göreceksiniz. Paint.NET ücretsiz bir program olmasına rağmen çok fazla seçeneği sizlere sunuyor. Resimlerinizi istediğiniz gibi tanzim edebileceğiniz ücretsiz bir resim editörü.

NOT: Programın kurulum ve çalışması için işletim sisteminizde, NET Framework 4.5 yüklü olması gerektiğini unutmayın.

Lisans: Ücretsiz, İşletim Sistemi: Win8/Win7/Vista/WinXP/Win8.1
Kurulu…

Windows İşletim Sistemi 32 Bit ve 64 Bit Arasındaki Fark

Windows İşletim Sistemi kullanan, bilgisayar kullanıcısı 64 bit işletim sistemlerini kullanmayı düşünerek bir çoğu bu sisteme geçmiş, ancak oyun ve performans deneyiminde sıkıntı yaşayarak tekrar 32 bit işletim sisteme geri dönmek durumunda kalmıştır. 32 Bit ve 64 Bit arasındaki sorunlar devam ederken ister istemez insan bu iki sitemi merak etmektedir. Bu iki sitem arasındaki fark, 32 bit ve 64 bit terimleri bir bilgisayarın işlemcisinin (CPU) veri bilgilerini işleme şekilleriyle ilgilidir. Windows’un 32 bit ve 64 bit sürümleri sırasıyla 32 bit ve 64 bit işlemciye sahip bilgisayarlar için tasarlanmıştır. Windows’un 64 bit sürümü 32 bit sürümüne nazaran daha fazla bellek (Ram) kullanımına sebep olur. Bu da performansı olumsuz yönde etkiler. O yüzden bilgisayarınızın performansına göre 32 bit veya 64 bit işletim sistemi seçmenizde fayda vardır. Örneğin, sahip olduğunuz RAM 4 GB ve altındaysa 32 bit sistem kullanmalısınız. Bu değerler üstündeyse 64 bit kullanmanızda bir sakınca yoktur ki…

Windows 10 Denetim Masası Komutlarına Kısa Yoldan Ulaşma

Windows 10 işletim sistemi arama penceresine tıklayarak bulmak istediğiniz komut dosyalarını kısa yoldan bir tıklama ile erişim ve kullanma ile ilgili açıklamalar. Bilgisayarınıza Windows 10 işletim sistemini yeni kurdu iseniz denetim masasını bulmak için zorlanıyor olabilirsiniz. Denetim masasını arama çubuğuna yazarak bulabileceğiniz gibi daha kolay bir şekilde de ulaşmanız mümkündür. Denetim masasında bulunan komut dosyalarına kısa yoldan ulaşmak için ilgili adımları inceleyin.
Windows 10 Denetim masası kısayol komut dosyalarını açma :1. Sol köşede bulunan 4 ad. kareden oluşan Windows 10 İcon’una maus'unuzu getirin ve sağ düğmesine tıklayarak çalıştırın.
2. Karşınıza Windows 10 Denetim masası komut seçenekleri çıkacaktır.
3. Denetim masasında mevcut olan birçok komutları artık bir tıklama ile açıp kullanabilirsiniz.

Paint ile Resim Boyutlandırma Seo

Windows yazılımında bulunan ücretsiz Paint resim proğramı ile blog resimlerini boyutlandır. Her bilgisayarda Windows işletim sistemi yüklü olduğundan windows’un ücretsiz resim proğramı Paint bulunmaktadır. Dinamik blogger yazı çubuğuna resim yazı ekleme , Blogger Favicon’unu kendin tasarla ve Blogger özel tema şablonuna slayt resmi yükleme ile ilgili yazımda ücretsiz resim proğramı Paint kullanımından sizlere bahsetmiştim.Google, Seo (Arama motoru optimizasyonu) sistemine haddinden fazla önem vermektedir.




Çünki Google bu sistem içinde gelişimini devam ettirmektedir.Bizlere düşen en büyük görev, kullanmakta olduğumuz ücretsiz Google ürünü Blogger’u en iyi şekilde optimize ederek hem kendimize hemde Google destek vermektir.Blog’unuzu optimize etmeniz gereken birçok uygulama mevcuttur.Biz bugün yazı içeriklerimize eklediğimiz ve blog hızını etkileyen resimlerin boyutlandırılması konusunu inceleyeceğiz.
Resim uzantıları ve resim boyutlandırılması neden önemlidir?

1. Blog yazı tasarımınında

Facebook Candy Crush Saga Oyunu Çalışmıyor Çözüm

Candy Crush Saga, Facebook oyun platformunda 64 milyon kişinin beğenisini kazanmış ilgi çekici oyunu mutlaka biliyor ve oynuyorsunuzdur. Kişisel olarak oyunları pek sevmesem de aile içerisinde, Facebook oyunları çok sıkça oynanır. Sebeb her nedense 2 gündür Facebook Candy Crush oyunu açılmıyor Adobe Flash Player yüklenmesi gerektiği uyarısı veriyor. Evde mobil olarak açılan Candy Crush oyunu, farklı 2 bilgisayar da denendiğinde çalışmıyordu. IE, Firefox, Google Chrome tüm tarayıcılar da denendi mümkün değil oyunu açamadık.
Tarayıcılar silinip tekrar kuruldu, Adobe Flash Player 12 son sürüm yüklendi hayır oyun açılamıyor ısrarla Flash yüklenmesi gerektiği ekranda yazıyordu. Geliştirici sitesine yardımcı olmaları için yorum ve ileti yazdım. Yardımcı olabileceklerini düşündüm. Yazdığım yoruma verilen cevapta konunun en ilginç tarafıydı. Verilen cevapta dil desteklerinin olmadığı ve forumlara bakmam isteniyordu. Böyle bir cevaba güldüm. Google1998 senesinde arama motorlarına başladığında …