Индексируемый раздел в Blogger


Индексируемый раздел в Blogger

В Blogger не предусмотрена возможность создания полноценных разделов. Все что можно сделать, это прикрепить к сообщениям метки, а после вывести их в блог с помощью гаджетов "Ярлыки" или "Страницы". Но такие рубрики не полноценны, к ним невозможно добавить описание и они не индексируются поисковыми системами.

Как создать индексируемый раздел в Blogger?

Чтобы создать индексируемый раздел в Blogger необходимо выполнить следующее: 

  1. Создать новую страницу под раздел с ЧПУ ссылкой
  2. Написать полноценный текст, описывающий рубрику; 
  3. Добавить мета теги Description и Keywords
  4. Отключить комментирование;
  5. Вывести статьи нужного ярлыка на страницу.

Такие образом, у вас получится страница с правильной ссылкой, описанием и ключевыми словами. На ней будет расположен текст раздела и статьи с необходимым ярлыком.


Как вывести сообщения одного ярлыка на статическую страницу


Вывод сообщений определенного ярлыка на статическую страницу осуществляется с помощью специального скрипта.

место для вставки кода

Код скрипта добавляется в режиме HTML редактирования статьи ниже всего написанного текста. 

При необходимости, вносятся некоторые изменения в шаблон блога.

Существует несколько скриптов, позволяющих делать это. Они отличаются дизайном  выводимых публикаций.

Ниже представлены 4 варианта. Выбирайте любой понравившийся. А если хотите, то можете использовать их все, для каждого раздела свой стиль оформления. 

Вариант 1

1 вариант скрипта

Одновременно, на страницу выводится 7 сообщений с картинкой, заголовком и превью. Переход к следующим записям осуществляется с помощью кнопок навигации. Статьи расположены в один ряд. 

Для вставки используйте следующий код:

<style>#contenitore{border:1px solid #666;width:100%;margin:0 auto}#el_box{margin:0px}.elementi{border:2px solid #7FFFD4;margin:10px 0;padding:10px;height:100px}.elementi img{background:#1E90FF;padding:3px;float:left;height:80px;margin-right:5px;width:80px}.elementi h6,.elementi h6 a{font-size:18px!important;margin:0;color:#000000}.elementi:hover{background-color:#00FA9A;}.elementi p{font:14px times; text-align:justify;color:#696969;line-height:15px;margin:4px 0}#caricamento{color:#888;font-family:times;font-size:10px;letter-spacing:-100px;text-align:center;text-shadow:-5px 0 1px #444;background:#262626 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiutZIvNYu7dqG_-71b7kL_ZICLLwJkge9fm3HpcZmoMV_ldUTYzdAyp1d4HLlFMRlYZcoVF99I1amwnk0j2g51-uEVBV7QBGaZxhZ8cf4EWkOFnXMq7RoG9sNVkyDfUStHn876taDn0M8/s300-no/ajax_loader.gif)) no-repeat 50% 50%;height:950px;border:1px solid #afe5f3;}#navigazione{border:1px solid #B0E0E6;color:#000000;font-family:times;font-size:16px;text-align:center;margin:0px}#navigazione:hover{background-color:#7FFFD4;}#navigazione a{color:#000000!important;font-family:times!important;font-size:16px!important;font-weight:400!important;display:block;padding:5px 10px}#navigazione span{padding:5px 10px}#navigazione .next{float:right}#navigazione .previous{float:left}#navigazione .home{text-align:center}#navigazione a:hover,#navigazione span.noactived{color:transparant!important}</style>

<script type="text/javascript">
  //<![CDATA[
 var numfeed = 7;var startfeed = 0;var urlblog = "https://адрес.blogspot.com/";var characnumber = 250;var urlprevious, urlnext;function maskolisfeed(johny,banget){var showfeed = johny.split("<");for(var i=0;i<showfeed.length;i++){if(showfeed[i].indexOf(">")!=-1){showfeed[i] = showfeed[i].substring(showfeed[i].indexOf(">")+1,showfeed[i].length);}}showfeed = showfeed.join("");showfeed = showfeed.substring(0,banget-1);return showfeed;}function mostrapost(json) {var entry, posttitle, posturl, postimg, postcontent;var showblogfeed = "";urlprevious = "";urlnext = "";for (var k = 0; k < json.feed.link.length; k++) {if (json.feed.link[k].rel == 'previous') {urlprevious = json.feed.link[k].href;}if (json.feed.link[k].rel == 'next') {urlnext = json.feed.link[k].href;}}for (var i = 0; i < numfeed; i++) {if (i == json.feed.entry.length) { break; }entry = json.feed.entry[i];posttitle = entry.title.$t;for (var k = 0; k < entry.link.length; k++) {if (entry.link[k].rel == 'alternate') {posturl = entry.link[k].href;break;}}if ("content" in entry) {postcontent = entry.content.$t;} else if ("summary" in entry) {postcontent = entry.summary.$t;} else {postcontent = "";}if ("media$thumbnail" in entry) {postimg = entry.media$thumbnail.url;} else {postimg = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJK5RTPRVTDd4OErG1rCWgTZpKZfrb9m-UBGfHuDGZ_YVhn84vu6yxj3MoD0dg_5vQO7BnUhJ01EpYlMw3IXwa20FzATpHNoG4x4as11UKQyjyzPlQBdRoMv2JeYwqCerIr-xteReHVzk/s300-no/no-immagini.jpg";}showblogfeed += "<div class='elementi'>";showblogfeed += "<a href='" + posturl + "' target='_blank'><img src='" + postimg + "' /></a>";showblogfeed += "<h6><a href='" + posturl + "'>" + posttitle + "</a></h6>";showblogfeed += "<p>" + maskolisfeed(postcontent,characnumber) + "...</p>";showblogfeed += "</div>";}document.getElementById("el_box").innerHTML = showblogfeed;showblogfeed = "";if(urlprevious) {showblogfeed += "<a href='javascript:feed_nav(-1);' class='previous'> Предыдущие</a>";} else {showblogfeed += "<span class='noactived previous'> Предыдущие </span>";}if(urlnext) {showblogfeed += "<a href='javascript:feed_nav(1);' class='next'>Следующие</a>";} else {showblogfeed += "<span class='noactived next'>Следующие </span>";}showblogfeed += "<a href='javascript:feed_nav(0);' class='home'>В начало</a>";document.getElementById("navigazione").innerHTML = showblogfeed;}function feed_nav(url){var p, parameter;if(url==-1) {p = urlprevious.indexOf("?");parameter = urlprevious.substring(p);} else if (url==1) {p = urlnext.indexOf("?");parameter = urlnext.substring(p);} else {parameter = "?start-index=1&max-results=" + numfeed + "&orderby=published&alt=json-in-script"}parameter += "&callback=mostrapost";incluirscript(parameter);}function incluirscript(parameter) {if(startfeed==1) {removerscript();}document.getElementById("el_box").innerHTML = "<div id='caricamento'></div>";document.getElementById("navigazione").innerHTML = "";var archievefeed = urlblog + "/feeds/posts/default/-/Готовим дома"+ parameter;var el_box = document.createElement('script');el_box.setAttribute('type', 'text/javascript');el_box.setAttribute('src', archievefeed);el_box.setAttribute('id', 'Ip_etichette');document.getElementsByTagName('head')[0].appendChild(el_box);startfeed = 1;}function removerscript() {var elemen = document.getElementById("Ip_etichette");var parent = elemen.parentNode;parent.removeChild(elemen);}onload=function() { feed_nav(0); }//]]></script><div id="el_box"></div><div id="navigazione"></div>

Перед сохранением и публикацией, необходимо внести следующие изменения:

7 - это количество выводимых статей на страницу, можете заменить на свое усмотрение;
https://адрес.blogspot.com/ - меняете на адрес своего блога;
Готовим дома - заменяете на название ярлыка, сообщения которого хотите выводить на странице.


Вариант 2


2 вариант скрипта

Одновременно на странице расположено 10 сообщений с картинками, заголовками и частью текста. Переход к просмотру других статей возможен с помощью кнопок навигации. Публикации располагаются в два ряда. Хорошо адаптируются под любой размер экрана.

Для вставки используйте следующий код:

<div id="recentpostsdp"></div><div id="dewaplokisnavfeed"></div>
<style scoped="" type="text/css">
#recentpostsdp .recentpostel{width:47%;background:#E0FFFF;display:inline-block;margin:0 20px 10px 0;padding:15px;overflow:hidden;box-shadow:0 2px 3px rgba(0,0,0,0.06),0 2px 3px rgba(0,0,0,0.1)}
#recentpostsdp .recentpostel:nth-child(even){margin:0 0 10px 0}
#recentpostsdp .recentpostel img{background:#ecf0f1;padding:0;float:left;margin:0;margin-right:10px;width:72px}
#recentpostsdp .recentpostel h6,.recentpostel h6 a{text-decoration:none;font-size:18px;font-weight:400;margin:0;color:#000000}
#recentpostsdp .recentpostel:hover{background-color:#fefefe}
#recentpostsdp .recentpostel p{font-size:14px;text-align:left;color:#555;line-height:normal;margin:5px 0}
#recentpostload{letter-spacing:-10px;text-align:center;background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgmKhxhDB64h8W17G8MmrRk9rQ_itIN3lW9RBAchbuv1k1dwDa1eXB_uXEpuckPvDVeKVc9Avdym_MlkIBB-oM7llTkQ_39aWzhoCaWOfYqyGxjX3hFZfBs3rwLdm_SKA_6wGHY_hKtlkIj/s1600/ellipsis-preloader.gif) no-repeat 50% 50%;height:470px}
#dewaplokisnavfeed{display:table;padding:5px 10px 5px 0;text-align:left;margin:15px auto}
#dewaplokisnavfeed a{color:#141414;font-size:12px;font-weight:400;display:block;padding:5px 10px}
#dewaplokisnavfeed span{padding:0;cursor:pointer;transition:all .3s}
#dewaplokisnavfeed .next,#dewaplokisnavfeed .previous{position:relative;overflow:hidden;display:inline-block;background:#7FFFD4;color:#222;padding:10px 16px;font-size:1rem;border-radius:99em;box-shadow:0 2px 3px rgba(0,0,0,0.06),0 2px 3px rgba(0,0,0,0.1)}
#dewaplokisnavfeed .next{float:right;margin:0 0 0 10px}
#dewaplokisnavfeed .previous{float:left;margin:0 10px 0 0}
#dewaplokisnavfeed .home{text-align:center;display:table;background:#7FFFD4;color:#222;font-size:1rem;float:none;padding:10px 16px;border-radius:99em;margin:auto;box-shadow:0 2px 3px rgba(0,0,0,0.06),0 2px 3px rgba(0,0,0,0.1)}
#dewaplokisnavfeed a:hover,#dewaplokisnavfeed span.noactived{color:#ccc}
#dewaplokisnavfeed i{font-family:fontawesome;font-style:normal}
#dewaplokisnavfeed .next:hover,#dewaplokisnavfeed .previous:hover,#dewaplokisnavfeed .home:hover{background:#fff;color:#222;box-shadow:0 10px 21px rgba(0,0,0,0.15),0 6px 6px rgba(0,0,0,0.12)}
@media screen and (max-width:993px){#recentpostsdp .recentpostel{width:96.5%;margin:0 0 10px 0}} #recentpostsdp .recentpostel {padding:5px;}
</style><br />

<script type='text/javascript'>
//<![CDATA[
var numfeed = 10; // 
var startfeed = 0;
var urlblog = "Ссылка";
var charac = 50;
var urlprevious, urlnext;
function dewafeed(e,t){for(var n=e.split("<"),r=0;r<n.length;r++)-1!=n[r].indexOf(">")&&(n[r]=n[r].substring(n[r].indexOf(">")+1,n[r].length));return n=n.join(""),n=n.substring(0,t-1)}function showrecentpostsdp(e){var t,n,r,a,i,s="";urlprevious="",urlnext="";for(var l=0;l<e.feed.link.length;l++)"previous"==e.feed.link[l].rel&&(urlprevious=e.feed.link[l].href),"next"==e.feed.link[l].rel&&(urlnext=e.feed.link[l].href);for(var d=0;d<numfeed&&d!=e.feed.entry.length;d++){t=e.feed.entry[d],n=t.title.$t;for(var l=0;l<t.link.length;l++)if("alternate"==t.link[l].rel){r=t.link[l].href;break}i="content"in t?t.content.$t:"summary"in t?t.summary.$t:"",a="media$thumbnail"in t?t.media$thumbnail.url:"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiqS6ANb5GLHvDyarCN6mxGsrvRYFV1b6eDUjV8X7MUz8h27Ron_3-VJfe-PtUmn6z977WxG3REd63xd1A7vLQAXB2XufqnvrGiT-cc2nvbI_XsNNiA4LFOjUCl_ecDOZCx4K_PJi2caBy5/s1600/no-image.png",s+="<div class='recentpostel'>",s+="<a href='"+r+"'><img src='"+a+"' /></a>",s+="<h6><a href='"+r+"'>"+n+"</a></h6>",s+="<p>"+dewafeed(i,charac)+"</p>",s+="</div>"}document.getElementById("recentpostsdp").innerHTML=s,s="",s+=urlprevious?"<a href='javascript:navigasifeed(-1);' class='previous'><i class='fas fa-arrow-left'></i></a>":"<span class='noactived previous'><i class='fas fa-arrow-left'></i></span>",s+=urlnext?"<a href='javascript:navigasifeed(1);' class='next'><i class='fas fa-arrow-right'></i></a>":"<span class='noactived next'><i class='fas fa-arrow-right'></i></span>",s+="<a href='javascript:navigasifeed(0);' class='home'><i class='fas fa-home'></i></a>",document.getElementById("dewaplokisnavfeed").innerHTML=s}function navigasifeed(e){var t,n;-1==e?(t=urlprevious.indexOf("?"),n=urlprevious.substring(t)):1==e?(t=urlnext.indexOf("?"),n=urlnext.substring(t)):n="?start-index=1&max-results="+numfeed+"&orderby=published&alt=json-in-script",n+="&callback=showrecentpostsdp",incluirscript(n)}function incluirscript(e){1==startfeed&&removerscript(),document.getElementById("recentpostsdp").innerHTML="<div id='recentpostload'></div>",document.getElementById("dewaplokisnavfeed").innerHTML="";var t=urlblog+"/feeds/posts/default/-/Ярлык"+e,n=document.createElement("script");n.setAttribute("type","text/javascript"),n.setAttribute("src",t),n.setAttribute("id","dewalabel"),document.getElementsByTagName("head")[0].appendChild(n),startfeed=1}function removerscript(){var e=document.getElementById("dewalabel"),t=e.parentNode;t.removeChild(e)}onload=function(){navigasifeed(0)};
//]]></script>

Перед сохранением и публикацией, необходимо внести следующие изменения:

10 - количество выводимых статей на страницу можно заменить на свое число;
Ссылка  - вместо этого слова вставляете ссылку на ваш блог;
Ярлык - заменяете на название ярлыка, сообщения которого хотите выводить на странице.

Если скрипт не срабатывает или отображается некорректно, то добавьте в шаблон, перед тегом </head> следующий код: 

<link href="//netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.css" rel="stylesheet"/> <script src='https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js'></script>

3 Вариант


3 вариант скрипта

Статьи в данном варианте выводятся в 3 ряда в виде изображений и заголовков. Одновременно на странице расположено 30 публикаций. Переход к следующим записям с помощью кнопок навигации.

Для вставки используйте следующий код:

<style>
  #resultados {  }
  #loadingscript {  }
  /* стили для отдельного блока*/
.paginaposts {
    border: 2px solid #32CD32;
    float: left;
    height: 75px;
    margin: 1px;
    padding: 22px;
    width: 220px;
    background: #FFFFFF;
  }
/* стили для ссылок */
  .paginaposts a {
    color: #0000FF;
    display: block;
    font-size: 12px;
    text-decoration: none;
    text-indent: 0px;
  }
  /*для картинок */
.paginaposts img {
    float: left;
    height: 70px;
    width: 70px;
    padding: 2px;
    margin: 2px 5px 2px 2px;
  }
  /* для заголовков */
.paginaposts h6 {
    height: 45px;
    margin: 0;
    font-weight: normal;
  }
 /* эффект при наведении мышки */
 .paginaposts:hover {
    background-image: -moz-linear-gradient(100% 100% 90deg, #00FFFF, #4B0082);
    background-image: -webkit-gradient(linear, left bottom, left top, from(#B0E0E6), to(#B0E0E6));
    filter:progid: DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr='#00FFFF', EndColorStr='#00FFFF');
    border: 2px solid #FF4500;
  }
 /* нижний блок с количеством записей */
 #paginacion {
    color: #000000;
    font-family: times;
    font-size: 18px;
    height: 15px;
    line-height: 22px;
    padding: 20px 0;
    text-align: center;
  }
 /* постраничная навигация */
#paginacion span, #paginacion a {
    border: 1px solid #000080;
    color: #000080;
    display: inline-block;
    font-family: times;
    font-size: 18px;
    margin: 0 2px;
    padding: 0 5px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    text-indent: 0px;
  }
  #paginacion span.actual {
    color: #000080;
    padding: 0 5px;
    -moz-box-shadow: 0 0 30px #fff inset;
    -webkit-box-shadow: 0 0 30px #fff inset;
    box-shadow: 0 0 30px #fff inset;
  }
  #paginacion a:hover {
    color: #fff;
    -moz-box-shadow: 0 0 20px #666 inset;
    -webkit-box-shadow: 0 0 20px #666 inset;
    box-shadow: 0 0 20px #666 inset;
    text-decoration: none;
  }
  #paginacion .antesdespues { border: none; }
  #paginacion .antesdespues:hover {
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
  }
  #paginacion span.deshabilitado {
    border: none;
    color: #000080;
  }
  #totales {text-align:center;}
</style><script type="text/javascript">
//<![CDATA[
var postporpagina = 30; // число записей на странице
var urlsitio = "Ссылка"; // адрес блога
var minpaginas = 5; // минимальное количество страниц
var maxpaginas = 10; // максимальное количество страниц
var imgxdefecto = "https://upload.wikimedia.org/wikipedia/ru/thumb/a/ac/No_image_available.svg/600px-No_image_available.svg.png"; // адрес изображения если картинки нет
var firsttime = 0;
var paginaactual = 1;
var cantidadpaginas = 0;
var cantidadposts = 0;
function showpageposts(json) {
  var entry, posttitle, posturl, postimg;
  var salida = "";
  if(cantidadpaginas==0) {
    cantidadposts = parseInt(json.feed.openSearch$totalResults.$t);
    cantidadpaginas = parseInt(cantidadposts / postporpagina) + 1;
  }
  for (var i = 0; i < postporpagina; i++) {
    if (i == json.feed.entry.length) { break; }
    entry = json.feed.entry[i];
    posttitle = entry.title.$t;
    for (var k = 0; k < entry.link.length; k++) {
      if (entry.link[k].rel == 'alternate') {
        posturl = entry.link[k].href;
        break;
      }
    }
    if ("media$thumbnail" in entry) {
      postimg = entry.media$thumbnail.url;
    } else {
      postimg = imgxdefecto;
    }
    salida += "<div class='paginaposts'>";
    salida += "<a href='" + posturl + "' target='_blank'><img src='" + postimg + "' /></a>";
    salida += "<h6><a href='" + posturl + "' target='_blank'>" + posttitle + "</a></h6>";
    salida += "</div>";
  }
 document.getElementById("resultados").innerHTML = salida;
  paginacion();
}
function paginacion() {
  contadorP = 0;
  salida = "";
  if(paginaactual>1) {
    salida += "<a class='antesdespues' href='javascript:incluirscript(" + parseInt(paginaactual-1) + ")'>следующие</a>";
  } else {
    salida += "<span class='deshabilitado'>следующие</span>";
  }
  if (cantidadpaginas<(maxpaginas+1)) {
    for (contadorP = 1; contadorP <= cantidadpaginas; contadorP++){
      if (contadorP==paginaactual) {
        salida += "<span class='actual'>" + contadorP + "</span>";
      } else {
        salida += "<a href='javascript:incluirscript(" + contadorP + ")'>" + contadorP + "</a>";
      }
    }
  } else if(cantidadpaginas>(maxpaginas-1)) {
    if(paginaactual<minpaginas) {
      for (contadorP=1; contadorP<(maxpaginas-2); contadorP++){
       if (contadorP == paginaactual) {
         salida += "<span class='actual'>" + contadorP + "</span>";
       } else {
         salida += "<a href='javascript:incluirscript(" + contadorP + ")'>" + contadorP + "</a>";
       }
     }
     salida += " ... ";
     salida += "<a href='javascript:incluirscript(" + parseInt(cantidadpaginas-1) + ")'>" + parseInt(cantidadpaginas-1) + "</a>";
     salida += "<a href='javascript:incluirscript(" + cantidadpaginas + ")'>" + cantidadpaginas + "</a>";
    } else if(cantidadpaginas-(minpaginas-1)>paginaactual&&paginaactual>(minpaginas-1)) {
      salida += "<a href='javascript:incluirscript(1)'>1</a>";
      salida += "<a href='javascript:incluirscript(2)'>2</a>";
      salida += " ... ";
      for (contadorP=paginaactual-2; contadorP<=paginaactual+2; contadorP++) {
        if (contadorP==paginaactual) {
          salida += "<span class='actual'>" + contadorP + "</span>";
        } else {
          salida += "<a href='javascript:incluirscript(" + contadorP + ")'>" + contadorP + "</a>";
        }
      }
      salida += " ... ";
      salida += "<a href='javascript:incluirscript(" + parseInt(cantidadpaginas-1) + ")'>" + parseInt(cantidadpaginas-1) + "</a>";
      salida += "<a href='javascript:incluirscript(" + cantidadpaginas + ")'>" + cantidadpaginas + "</a>";
    } else {
      salida += "<a href='javascript:incluirscript(1)'>1</a>";
      salida += "<a href='javascript:incluirscript(2)'>2</a>";
      salida += " ... ";
      for (contadorP=cantidadpaginas-(minpaginas+1); contadorP<=cantidadpaginas; contadorP++) {
        if (contadorP==paginaactual) {
          salida += "<span class='actual'>" + contadorP + "</span>";
        } else {
          salida += "<a href='javascript:incluirscript(" + contadorP + ")'>" + contadorP + "</a>";
        }
      }
    }
  }
  if (paginaactual<contadorP-1) {
    salida += "<a class='antesdespues' href='javascript:incluirscript(" + parseInt(paginaactual+1) + ")'>предыдущие</a>";
  } else {
    salida += "<span class='deshabilitado'>предыдущие</span>";
  }
 document.getElementById("paginacion").innerHTML = salida;
  var iniciopagina = (paginaactual * postporpagina) - (postporpagina - 1);
  var finalpagina = paginaactual * postporpagina;
  var totales = "Всего сообщений: " + cantidadposts + " - из них показано " + iniciopagina + "-" + finalpagina + " записей";
  document.getElementById("totales").innerHTML = totales;
}
function incluirscript(pagina) {
  if(firsttime==1) {removerscript();}
 document.getElementById("resultados").innerHTML = "<div id='loadingscript'>загрузка ...</div>";
 document.getElementById("paginacion").innerHTML = "";
  document.getElementById("totales").innerHTML = "";
  var iniciopagina = (pagina * postporpagina) - (postporpagina - 1);
  var archivo = urlsitio + "/feeds/posts/default/-/Ярлык?start-index=" + iniciopagina;
  archivo += "&max-results=" + postporpagina;
  archivo += "&orderby=published&alt=json-in-script&callback=showpageposts";
  var nuevo = document.createElement('script');
  nuevo.setAttribute('type', 'text/javascript');
  nuevo.setAttribute('src', archivo);
  nuevo.setAttribute('id', 'TEMPORAL');
  document.getElementsByTagName('head')[0].appendChild(nuevo);
  firsttime = 1;
  paginaactual = pagina;
}
function removerscript() {
  var el = document.getElementById("TEMPORAL");
  var padre = el.parentNode;
  padre.removeChild(el);
}
onload=function() { incluirscript(1); }
//]]>
</script>
<div id="resultados" ></div>
<div style="clear:both;"></div>
<div id="paginacion"></div>
<div id="totales"></div>

Перед сохранением и публикацией, необходимо внести следующие изменения:

30 - количество выводимых статей на странице, можете заменить на свой вариант;
Ссылка  - вместо этого слова вставляете ссылку на ваш блог;
Ярлык - заменяете на название ярлыка, сообщения которого хотите выводить на странице.

4 вариант

4 вариант скрипта

В данном варианте статьи выводятся в один ряд в виде картинок с заголовком и текстом. Хорошо адаптируются под любое устройство. Сразу на странице выводится 10 статей, подгруздка следующих публикаций производится при помощи кнопки "Дальше". 

Для вставки в статью используйте следующий код:

<div id="result-desc"></div><ul id="feed-container"></ul><div id="feed-nav"></div>
<script type="text/javaScript">  var label="Ярлык"; </script>

Перед публикацией поменяйте слово "Ярлык" на необходимый заголовок ярлыка.

Чтобы скрипт сработал, необходимо в шаблон внести изменения. А именно, перед </body> добавить следующий код:

<b:if cond='data:blog.pageType != &quot;index&quot;'>
<style type='text/css'>
#table-outer{padding:7px 10px;margin:0 auto}
#table-outer table{width:auto;margin:0 auto}
#table-outer form{font:inherit}
#table-outer label{display:block;text-align:right;margin:0 10px 0 0;padding:4px 0 0}
#table-outer select[disabled]{opacity:.4}
#post-searcher{display:block;margin:0;padding:0}
#table-outer input,#table-outer select{width:100%;border:1px solid #dedede;border-radius:5px;margin:0;padding:5px;font-family: Roboto,sans-serif!important;font-size:16px!important;font-weight:500!important;text-transform:capitalize!important;outline:0;color:#333!important;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
#table-outer select option{min-height:1.4em!important;}
#table-outer input#feed-q{padding:5px 10px!important;}
#feed-container{background:#fff;display:block;clear:both;margin:0;padding:0;list-style:none;overflow:hidden;position:relative;border-top:none}
#feed-container {list-style:none;margin:0;padding:0;border-top:1px solid #eee;color:#555;width:auto;float:left;display:inline}
#feed-container li .inner{margin:15px 0;height:auto;overflow:hidden;word-wrap:break-word;text-overflow:ellipsis}
#feed-container li a{text-decoration:none;color:#2C2C2C;font-weight:700}
#feed-container li a:hover{text-decoration:none;color:#E94141}
#feed-container li .news-text{margin-top:5px;line-height:1.3em!important}
#feed-container li img{margin:0 15px 5px 0;padding:7px 7px 7px 0;float:left;display:block;}
#result-desc{margin:0;padding:0;}
#result-desc div,#result-desc span{display:block;margin:0;padding:5px 0 7px;color:#D64D52}
#result-desc div{color:inherit}
#feed-nav{margin:10px 0 30px;text-align:center;font-weight:500}
#feed-nav a,#feed-nav span{border:1px solid #dedede;border-radius:5px;padding:0;color:#757575;text-decoration:none;display:block;height:30px;line-height:32px}
#feed-nav a,#feed-nav span:hover{color:#1B1B1B}
#feed-nav a:active,#feed-nav a:hover{color:#555}
#feed-nav span{cursor:wait}
@media (max-width:600px){#table-outer table{margin:0 auto;width:100%}
#feed-container,#table-outer{margin:0 auto}
#feed-container li .inner{margin:5px auto;height:auto}
#feedContainer li{float:none;display:block;width:auto;height:auto}
#feed-container li .news-text, #feedContainer:after,#feed-container li img{display:!important}
}
.post-body{min-height:300px;background:url()50% 50% no-repeat!important;}
</style>
<script type='text/javascript'>
//<![CDATA[
//Script Recent Pos By Label
document.write;var loadToc,loadCategories,_toc={init:function(){var e={homePage:"https://"+window.location.hostname,maxResults:10,numChars:270,thumbWidth:140,thumbHeight:95,navText:"Дальше &#9660;",resetToc:"Больше постов нет",noImage:"https://2.bp.blogspot.com/-11FkySHGB5Y/TpZ6SSbsF2I/AAAAAAAAA94/zK10UaL7jgo/s1600/images.jpeg",loading:"<span>:Загрузка...</span>"},t=(window,document),n=function(e){return t.getElementById(e)},a={e:n("result-desc"),f:n("feed-container"),g:n("feed-nav"),h:t.getElementsByTagName("head")[0],i:0,j:null,k:"published",l:0,m:""},l={a:function(){old=n("temporer-script"),old.parentNode.removeChild(old)},b:function(e){var i=t.createElement("script");i.type="text/javascript",i.id="temporer-script",i.src=e,n("temporer-script")&&l.a(),a.h.appendChild(i)},c:function(t,n,i){a.i++,a.e.innerHTML=e.counting,a.g.innerHTML=e[1==t?"searching":"loading"],0===t?l.b(null!==n?e.homePage+"/feeds/posts/summary/-/"+n+"?alt=json-in-script&start-index="+(a.i*e.maxResults+1)+"&max-results="+e.maxResults+"&orderby="+i+"&callback=loadToc":e.homePage+"/feeds/posts/summary/-/"+label+"?alt=json-in-script&start-index="+(a.i*e.maxResults+1)+"&max-results="+e.maxResults+"&orderby="+i+"&callback=loadToc"):1==t&&l.b(e.homePage+"/feeds/posts/summary/-/"+label+"?alt=json-in-script&start-index="+(a.i*e.maxResults+1)+"&max-results="+e.maxResults+"&q="+n+"&orderby="+i+"&callback=loadToc"),a.j=null!==n?n:null,a.l=t,a.a.disabled=!0,a.b.children[0].disabled=!0},d:function(n){var i;if(a.g.innerHTML="",a.e.innerHTML="<div>Всего постов: "+n.feed.openSearch$totalResults.$t+" </div>","entry"in n.feed){for(var r,s,o,d,c=n.feed.entry,u="0 Komentar",m=0;m<e.maxResults&&m!=c.length;m++){r=c[m].title.$t,o="summary"in c[m]?c[m].summary.$t.replace(/<br ?\/?>/gi," ").replace(/<(.*?)>/g,"").replace(/<iframe/gi,"").substring(0,e.numChars):"",d="media$thumbnail"in c[m]?c[m].media$thumbnail.url.replace(/\/s[0-9]+\-c/,"/s"+e.thumbWidth):e.noImage.replace(/\/s[0-9]+\-c/,"/s"+e.thumbWidth);for(var h=0,b=c[m].link.length;b>h;h++)s="alternate"==c[m].link[h].rel?c[m].link[h].href:"#";for(var p=0,g=c[m].link.length;g>p;p++)if("replies"==c[m].link[p].rel&&"text/html"==c[m].link[p].type){u=c[m].link[p].title;break}i=t.createElement("li"),i.innerHTML='<div class="inner"><img style="width:'+e.thumbWidth+"px;height:"+e.thumbHeight+'px;" src="'+d+'" alt="'+r+'"><a class="toc-title" href="'+s+'" target="_blank" title="'+r+'">'+r+'</a><div class="news-text">'+o+'&hellip;<br style="clear:both;"></div></div>',a.f.appendChild(i)}i=t.createElement("a"),i.href="#load-more",i.innerHTML=e.navText,i.onclick=function(){return l.c(a.l,a.j,a.k),!1}}else i=t.createElement("a"),i.href="#reset-content",i.innerHTML=e.resetToc,i.onclick=function(){return a.i=-1,a.e.innerHTML=e.counting,a.f.innerHTML="",l.c(0,null,"published"),a.a.innerHTML=a.a.innerHTML,a.b.children[0].innerHTML=a.b.children[0].innerHTML,!1};a.g.appendChild(i),a.a.disabled=!1,a.b.children[0].disabled=!1}};loadToc=l.d,loadCategories=l.e,l.b(e.homePage+"/feeds/posts/summary/-/"+label+"?alt=json-in-script&start-index="+(a.i+1)+"&max-results="+e.maxResults+"&orderby=published&callback=loadToc"),l.b(e.homePage+"/feeds/posts/summary/-/"+label+"?alt=json-in-script&max-results=0&orderby=published&callback=loadCategories"),a.a.onchange=function(){a.i=-1,a.f.innerHTML="",a.g.innerHTML=e.counting,a.b.children[0].innerHTML=a.b.children[0].innerHTML,l.c(0,null,this.value),a.k=this.value},a.c.onsubmit=function(){return a.i=-1,a.f.innerHTML="",a.m=a.d.value,l.c(1,a.d.value,a.k),!1}}};_toc.init();
//]]>
</script>
</b:if>

Почему скрипт не работает

Если вы все сделали по инструкции, а у вас ничего не появилось, то не спешите говорить, что это не работает. Посмотрите причины, по которым скрипт может не срабатывать.

1. Вставлен код с ошибкой - при копировании захвачены лишние элементы из текста или скопирован не полностью. 

2. Не правильно вставлена ссылка - забыли вставить ссылку или прописали неверно. Она должна быть такого формата: https://news-sawich.blogspot.com/

Также, нужно быть внимательным и при добавлении ссылки чтобы ничего не удалить.
 
3. Неправильно вставлен ярлык - ярлыки чувствительны к регистру. Поэтому, если у вас в блоге название прописано с большой буквы, например: Ярлык, а вы вставляете с маленькой, как: ярлык. То скрипт работать не будет. Все должно быть идентично.

Дальше, если вы используете ярлык из нескольких слов, то разделять слова лучше не пробелом, а символом: %20. Например: готовим%20дома.

4. Установлены несовместимые виджеты - в некоторых шаблонах если установлен виджет "Избранное сообщение" или "Популярные сообщения", также "Последние публикации", то скрипт не срабатывал.
 
Итак, в данной статье мы научились делать индексируемые разделы в Blogger. Рассмотрели 4 различных варианта скрипта для вывода сообщений определенного ярлыка на статическую страницу. Разобрались с причинами, почему скрипт может не работать.

Рекомендуем

Комментарии