За блог на платформата Blogger (blogspot). Създаване, водене, персонализиране, дизайн, притурки в примери. Препоръки и съвети за начинаещи и напреднали блогъри.

Търсене

Breaking

Карта на блога по азбучен ред

Карта на блога
Този вариант на карта на блога или съдържанието на публикациите в Blogger е почти същият като предишния, обикновената карта на блога по дата на публикуване, която в действителност е само един списък със заглавията.


    Карта на блога по азбучен ред


    Но ако в предишният вариант публикациите са сортирани по дата на публикуване, в този са подредени по азбучен ред, започвайки от буквата от А и стигайки до буквата Я. Така посетителите могат по-лесно да намират публикациите въз основа на заглавието им. Ето как изглежда.
    И тук скриптовете са два. Ще ви ги представя поотделно и заедно, за да е удобно за използване на картата постоянно или временно.
    Първо добавете този CSS код над </ style> или ]]> </ b: skin>.


    CSS код



    /* Blogger Sitemap Simple Title Only Sort By Title (Alphabetically) */
    #sitemap4 .judul {font-size:150%; background-color:#008c5f; color:#fff; font-weight:500; text-align:center; margin-bottom:20px; padding:15px;}
    #sitemap4 a {color:#666; text-decoration:none; transition:all .3s ease;}
    #sitemap4 a:hover {color:#000;}
    #sitemap4 ol {margin:0px; padding:0px;}

    #sitemap4 ol li {color:#666; font-weight:300; list-style-type:decimal; margin:0px; padding:10px; line-height:1.5em; -webkit-margin-start:40px !important;}



    След това създайте нова страница, която да е статична, изберете режима на HTML редактор. Копирайте и запазете целия скрипт по-долу в този редактор без да променяте нищо в него. Това е чист Javascript, да, не е jQuery.

    JS код



    <div id="sitemap4">Loading....</div>
    <script> //<![CDATA[
    /* Blogger Sitemap Simple Title Only Sort By Title (Alphabetically) */
    var start=1;var max=150;var sitemap4Arr=new Array();function runSitemap4(){var scpt=document.createElement('script');scpt.src='/feeds/posts/summary?alt=json&callback=sitemap4&start-index='+start+'&max-results='+max;document.body.appendChild(scpt)} function sitemap4(root){var elem=document.getElementById('sitemap4');if(!elem)return;elem.innerHTML='';var feed=root.feed;if(feed.entry.length>0){for(var i=0;i<feed.entry.length;i++){var entry=feed.entry[i];var title=entry.title.$t;for(var j=0;j<entry.link.length;j++){if(entry.link[j].rel=="alternate"){var url=entry.link[j].href;if(url&&url.length>0&&title&&title.length>0){sitemap4Arr.push({'url':url,'judul':title})} break}}} if(feed.entry.length>=max){start+=max;runSitemap4()} else{var print='',a=sitemap4Arr.sort(function(a,b){return a.judul>b.judul?1:-1});for(var x=0;x<a.length;x++){print+='<li><a href=\"'+a[x].url+'\" title=\"'+a[x].judul+'\">'+a[x].judul+'</a></li>'} elem.innerHTML='<div class=\"judul\">Total Post: '+a.length+'</div><ol>'+print+'</ol>'}}} runSitemap4();

    //]]> </script>



    Целият код за статична страница



    <style>
    /* Blogger Sitemap Simple Title Only Sort By Title (Alphabetically) */
    #sitemap4 .judul {font-size:150%; background-color:#008c5f; color:#fff; font-weight:500; text-align:center; margin-bottom:20px; padding:15px;}
    #sitemap4 a {color:#666; text-decoration:none; transition:all .3s ease;}
    #sitemap4 a:hover {color:#000;}
    #sitemap4 ol {margin:0px; padding:0px;}
    #sitemap4 ol li {color:#666; font-weight:300; list-style-type:decimal; margin:0px; padding:10px; line-height:1.5em; -webkit-margin-start:40px !important;}
    </style>
    <div id="sitemap4">Loading....</div>
    <script> //<![CDATA[
    /* Blogger Sitemap Simple Title Only Sort By Title (Alphabetically) */
    var start=1;var max=150;var sitemap4Arr=new Array();function runSitemap4(){var scpt=document.createElement('script');scpt.src='/feeds/posts/summary?alt=json&callback=sitemap4&start-index='+start+'&max-results='+max;document.body.appendChild(scpt)} function sitemap4(root){var elem=document.getElementById('sitemap4');if(!elem)return;elem.innerHTML='';var feed=root.feed;if(feed.entry.length>0){for(var i=0;i<feed.entry.length;i++){var entry=feed.entry[i];var title=entry.title.$t;for(var j=0;j<entry.link.length;j++){if(entry.link[j].rel=="alternate"){var url=entry.link[j].href;if(url&&url.length>0&&title&&title.length>0){sitemap4Arr.push({'url':url,'judul':title})} break}}} if(feed.entry.length>=max){start+=max;runSitemap4()} else{var print='',a=sitemap4Arr.sort(function(a,b){return a.judul>b.judul?1:-1});for(var x=0;x<a.length;x++){print+='<li><a href=\"'+a[x].url+'\" title=\"'+a[x].judul+'\">'+a[x].judul+'</a></li>'} elem.innerHTML='<div class=\"judul\">Total Post: '+a.length+'</div><ol>'+print+'</ol>'}}} runSitemap4();

    //]]> </script>

    Здраве за всички вас! Не забравяйте да правите добро на други хора!

    Ще съм благодарна да оцените моя труд и кликнете върху звездичките по-долу. Или гласувайте за блога ми на:

    BGtop

    Няма коментари:

    Публикуване на коментар