Blogger адаптивный виджет похожие сообщения с картинками

Как в блоггере сделать виджет похожие сообщения

Новый виджет похожие сообщения для блоггера подойдет, как для обычных шаблонов так и для новых тем contempo, soho, emporio, notable.

Плюсы виджета:
  • Написан на чистом скрипте JS.
  • Понятен для поисковых ботов.
  • Не создает ссылки со значением Undefined, если сообщению не задан ярлык, что в свою очередь не допускает создания страниц с ошибкой 404.

Установка виджета для новых тем:

1) Откройте раздел Тема - Изменить HTML
2) Перед закрывающим тегом </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) Найдите строку ]]></b:skin> перед ней добавьте CSS код:

.post-related { display: inline-block; background: #fff; padding: 10px; width:100%; } .post-box .heading { margin-bottom: 10px; text-align: center; margin-top: 10px; position: relative; } .post-box .heading:after { content: "" ; position: absolute; top: 100%; left: 50%; margin-left: -11px; width: 21px; height: 1px; margin-top: 2px; background: #b565a7; } .item-related { width: 31.6%; display: block; float: left; margin-right: 10px; height: 100%; } .item-related:last-child { margin: 0!important; } .item-related .link {display: block; margin: -1px; margin-bottom: 0;} .item-related img {margin-left:0px !important; display: block; opacity: 1; width: 100%; height: 200px; object-fit: cover; } .item-related h3 { padding: 15px; font-weight: 400; font-size: 14px; line-height: 1.71429; font-family: Muli; text-transform: uppercase; } img.noops-smly { padding: 0 !important; margin-top: -2px !important; width: 19px; display: inline; }

4) Найдите HTML код:

  <div class='post-bottom'>
            <div class='post-footer'>
              <!-- Footer bylines -->
              <b:include name='footerBylines'/>
            </div>
            <b:include cond='data:view.isSingleItem and data:widget.type == &quot;Blog&quot;' data='{ shareButtonClass: &quot;post-share-buttons-bottom&quot;, overridden: true }' name='maybeAddShareButtons'/>
            <b:include cond='data:view.isMultipleItems or data:widget.type == &quot;PopularPosts&quot;' data='post' name='postJumpLink'/>
          </div>

После него добавьте скрипт:

<script id='related-posts' type='text/javascript'> /*<![CDATA[*/ var relatedTitles = new Array(); var relatedTitlesNum = 0; var relatedUrls = new Array(); var thumburl = new Array(); function related_results_labels_thumbs(json) { for (var i = 0; i < json.feed.entry.length; i++) { var entry = json.feed.entry[i]; relatedTitles[relatedTitlesNum] = entry.title.$t; try {thumburl[relatedTitlesNum]=entry.media$thumbnail.url;} catch (error){ s=entry.content.$t;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!="")) {thumburl[relatedTitlesNum]=d;} else {if(typeof(defaultnoimage) !== 'undefined') thumburl[relatedTitlesNum]=defaultnoimage; else thumburl[relatedTitlesNum]="http://4.bp.blogspot.com/-ZoL4BRpPhkw/U6wnup4_6gI/AAAAAAAAACA/sKpM61pmJPo/s1600/no_pic_available.jpg";} } if(relatedTitles[relatedTitlesNum].length>35) relatedTitles[relatedTitlesNum]=relatedTitles[relatedTitlesNum].substring(0, 35)+"..."; for (var k = 0; k < entry.link.length; k++) { if (entry.link[k].rel == 'alternate') { relatedUrls[relatedTitlesNum] = entry.link[k].href; relatedTitlesNum++; } } } } function removeRelatedDuplicates_thumbs() { var tmp = new Array(0); var tmp2 = new Array(0); var tmp3 = new Array(0); for(var i = 0; i < relatedUrls.length; i++) { if(!contains_thumbs(tmp, relatedUrls[i])) { tmp.length += 1; tmp[tmp.length - 1] = relatedUrls[i]; tmp2.length += 1; tmp3.length += 1; tmp2[tmp2.length - 1] = relatedTitles[i]; tmp3[tmp3.length - 1] = thumburl[i]; } } relatedTitles = tmp2; relatedUrls = tmp; thumburl=tmp3; } function contains_thumbs(a, e) { for(var j = 0; j < a.length; j++) if (a[j]==e) return true; return false; } function printRelatedLabels_thumbs(current) { for(var i = 0; i < relatedUrls.length; i++) { if((relatedUrls[i]==current)||(!relatedTitles[i])) { relatedUrls.splice(i,1); relatedTitles.splice(i,1); thumburl.splice(i,1); i--; } } var r = Math.floor((relatedTitles.length - 1) * Math.random()); var i = 0; while (i < relatedTitles.length && i < 20 && i<maxresults) { tmb = thumburl[r].replace('s72-c/','s300-c/'); document.write('<div class="item-related"><a href="' + relatedUrls[r] + '" class="link"><img width="150" height="100" src="'+tmb+'"/></a><h3><a href="' + relatedUrls[r] + '">'+relatedTitles[r]+'</a></h3></div>');i++; if (r < relatedTitles.length - 1) { r++; } else { r = 0; } } relatedUrls.splice(0,relatedUrls.length); thumburl.splice(0,thumburl.length); relatedTitles.splice(0,relatedTitles.length); } 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 } /*]]>*/ </script>
                  <div class='post-related'>
                    <div class='post-box'>
                      <h4 class='heading common-heading'> <i class="fa fa-th-list" aria-hidden="true"></i> Рекомендуем</h4>
                    </div>
                    <b:loop values='data:post.labels' var='label'>
                      <script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/>                             
                    </b:loop> 
                    <script type='text/javascript'>
                      var defaultnoimage=&quot;http://1.bp.blogspot.com/_u4gySN2ZgqE/SosvnavWq0I/AAAAAAAAArk/yL95WlyTqr0/s400/noimage.png&quot;;
                      var maxresults=3; // Number Of Posts
                      removeRelatedDuplicates_thumbs();
                      printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);
                    </script>
                  </div>    

5) Сохраните тему.

Установка виджета для обычных шаблонов:

Для обычных тем блоггера установка виджета похожих сообщений осуществляется таким же образом, как и для новых тем, за исключением 4 пункта. Вам нужно найти другой код, чтобы добавить после него скрипт. Какой именно нужно найти код смотрите в этой статье, после заголовка: Установка виджета для обычных шаблонов.

Так же читайте: Всплывающий виджет похожие посты для Blogger

Всплывающий виджет похожие сообщения (related posts)

Blogger - blogspot устанавливаем на сайт - блог всплывающий виджет похожие сообщения (related posts).

День добрый друзья, наконец то настала долгожданная суббота, можно отдохнуть и взяться за улучшение своих сайтов и блогов. Сегодня у нас нечто особенное в программе, мы покажем, как установить на сайт - блог крутейший виджет похожих сообщений. Он существенно отличается от своих старших братьев. К примеру он всплывает на странице сообщения после прокрутки страницы вниз, если вернуть страницу в исходное состояние виджет прячется обратно. Так же он имеет несколько других замечательных функций: его можно свернуть или закрыть, как страницу браузера и естественно в нем присутствует функция отзывчивого дизайна (responsive design). Еще к плюсам можно отнести его легкость, то есть он не так нагружает страницу, как предыдущие версии. Пример виджета смотрим на тестовом блоге.

Для установки нужно перейти в раздел Шаблон - Изменить HTML ищем код ]]></b:skin> и перед ним вставляем:


/* Recommended Widget */
#chslidingbox{background:#fff;width:100%;max-width:355px;height:305px;position:fixed;overflow:hidden;border:none;right:-360px;z-index:99;text-align:left;box-shadow:0 1px 0 0 rgba(0,0,0,0.03);transition:all .4s ease-out;}
.chslidingbox-title{background:#9eb2c0;color:#fff;display:block;height:45px;line-height:45px;width:100%;font-size:14px;text-transform:capitalize;font-weight:700;letter-spacing:.5px}
.chslidingbox-title span a{font-family:initial;float:right;height:40px;margin:0 0 0 15px;text-align:center;color:#fff;font-size:20px}a#chslidingbox-close, a#chslidingbox-close {margin-right:15px;}
.chslidingbox-title > span > h2{font-size:20px!important;font-weight:normal!important;}.chslidingbox-container{border:none;float:left;width:100%;height:auto;margin:3px}.chslidingbox-container > div{border:none;margin:3px 0;padding:10px 0}
.chslidingbox-container > div > span {font-size:14px;}.show{bottom:84px;}
.hide{bottom:-145px;}
.related-post{font-size:70%}
.related-post h4 {font-size:150%;margin:0 0 .5em;}
.related-post-style-2{margin-top:-20px;padding-top:15px;list-style:none}.related-post-style-2 li {padding:0 10px 10px 10px;overflow:hidden;}.related-post-style-2 li:first-child {border-top:none}.related-post-style-2 
.related-post-item-thumbnail{width:45px;height:45px;max-width:none;max-height:none;border:0;padding:0;border-radius:3px;float:left;margin:2px 10px 0 0}.related-post-style-2 .related-post-item-title{font-weight:700;font-size:130%;line-height:normal}
a.related-post-item-title {color:#95a5a6;transition:all .4s ease-out;}
a:hover.related-post-item-title {color:#2ecc71;text-decoration:none;}.related-post-style-2 .related-post-item-summary {display:block;overflow:hidden;}

Затем ищем код <data:post.body/> которых в шаблоне может быть два, нам нужен второй по счету и после него выкладываем следующий код:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='show' id='chslidingbox'>
    <div class='chslidingbox-title chslidingbox-www'>
      <span style='float:left;margin:0 15px;'>Рекомендуем </span>
        <span><a href='javascript:void(0);' id='chslidingbox-close' title='close'>&#215;</a></span>
        <span><a href='javascript:void(0);' id='chslidingbox-minimize' title='minimize'>&#8722;</a></span>
        <span><a href='javascript:void(0);' id='chslidingbox-maximize' title='maximize'>+</a></span>
    </div>
    <div class='chslidingbox-container'>
<div class='related-post' id='sliding-tab'/>
<script type='text/javascript'>
var labelArray = [<b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'>
&quot;<data:label.name/>&quot;<b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if>
</b:loop></b:if>];
var relatedPostConfig = {homePage: &quot;<data:blog.homepageUrl/>&quot;,widgetTitle: &quot;&lt;h4&gt;&lt;/h4&gt;&quot;,numPosts: 4,summaryLength: 0,
titleLength: &quot;auto&quot;,thumbnailSize: 45,noImage: &quot;data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAA3NCSVQICAjb4U/gAAAADElEQVQImWOor68HAAL+AX7vOF2TAAAAAElFTkSuQmCC&quot;,containerId: &quot;sliding-tab&quot;,newTabLink: true,moreText: &quot;&quot;,widgetStyle: 2,callBack: function() {}};
</script>
<script src='https://cdn.rawgit.com/Indzign/theme/master/recommended.js' type='text/javascript'/>         
</div>
</div>
</b:if>
 
И последний шаг, находим код </body> и перед ним добавляем код:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script type='text/javascript'>
//<![CDATA[
$(window).scroll(function(){$("#chslidingbox").css($(this).scrollTop()>400?{right:"0px"}:{right:"-360px"})}),$(document).ready(function(){var i=$("#chslidingbox"),s=$("#chslidingbox-close"),o=$("#chslidingbox-minimize"),l=$("#chslidingbox-maximize");l.hide(),s.click(function(){i.css({right:"-350px"}),i.fadeOut("slow")}),o.click(function(){i.toggleClass("hide"),$(this).hide(),l.show()}),l.click(function(){i.toggleClass("hide"),$(this).hide(),o.show()})});
//]]>
</script>
</b:if>

Сохраняете свой шаблон и проверяете, что в итоге получилось.

Обычный вариант виджета

виджет похожих сообщений

Blogger - blogspot, как установить (добавить) на сайт или блог виджет похожие сообщения (статьи, посты) - related posts.

На сегодняшний день любому вебмастеру или блоггеру сложно представить себе сайт или блог без виджета схожих между собой постов. К сожалению стандартные шаблоны blogger не имеют в своем репертуаре подобного виджета. Поэтому владельцу веб-ресурса нужно устанавливать его самому. И сегодня мы с вами разберем, как это делается, но прежде поговорим о его пользе.

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

В этой статье будет размещено два разных варианта виджета похожих сообщений. Отличаются они друг от друга лишь тем, что у первого заголовок выезжает при наведении мыши на картинку к посту. У второго заголовок виден без этого эффекта.

1.) Для установки первого варианта перейдите в раздел Шаблон - Изменить HTML ищем код ]]></b:skin> и перед ним вставляем код:

/* MBL Thumbnail Related Posts With ToolTips --- */

    #related-posts h2 {
    font: 18px Oswald;
    color: #999;
    text-transform: uppercase;
    padding: 10px;
    text-align: center;
    }

    .related-post .post-thumbnail {
     z-index: 1;
     position: relative;
     width: 98px;
     height: 98px;
     margin: 0;
     display: block;
     border-right: 1px solid #fff;
     border-bottom: 1px solid #fff;
     -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
     border-radius: 5px;
     -webkit-box-shadow: inset 2px 2px 5px #444;
     -moz-box-shadow: inset 2px 2px 5px #444;
     box-shadow: inset 2px 2px 5px #555;
    }
    .related-post {
     float: left;
     position: relative;
     width: 98px;
     height: 98px;
     margin: 0 10px 10px 0;
     background: #F6F6F6;
     -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
     border-radius: 5px;
     }
    .related-post .related-post-title {
     display: none;
     float: left;
     background: #000;
     color: #fff;
     text-shadow: none;
     font-weight: bold;
     padding: 10px;
     position: absolute;
     top: -20px;
     left: 40px;
     z-index: 2;
     width: 200px;
     -webkit-box-shadow: 0 0 2px #444;
     -moz-box-shadow: 0 0 2px #444;
     box-shadow: 0 0 2px #444;
    }
    .related-post:hover .related-post-title {display: block;}

После ищем код  <div class='post-footer'> их в шаблоне может быть два, нам нужно найти второй и сразу после него вставить следующий код:


 <div id='related-posts'>
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <script type='text/javascript'>//<![CDATA[
      var ry='<h2>Рекомендуем:</h2>';rn='<h3>&nbsp;&nbsp;&nbsp;No related post available</h3>';rcomment='comments';rdisable='disable comments';commentYN='no';
    var dw='';titles=new Array();titlesNum=0;urls=new Array();timeR=new Array();thumb=new Array();commentsNum=new Array();comments=new Array();function related_results_labels(c){for(var b=0;b<c.feed.entry.length;b++){var d=c.feed.entry[b];titles[titlesNum]=d.title.$t;for(var a=0;a<d.link.length;a++){if('thr$total' in d){commentsNum[titlesNum]=d.thr$total.$t+' '+rcomment}else{commentsNum[titlesNum]=rdisable};if(d.link[a].rel=="alternate"){urls[titlesNum]=d.link[a].href;timeR[titlesNum]=d.published.$t;if('media$thumbnail' in d){thumb[titlesNum]=d.media$thumbnail.url}else{thumb[titlesNum]='http://lh3.ggpht.com/--Z8SVBQZ4X8/TdDxPVMl_sI/AAAAAAAAAAA/jhAgjCpZtRQ/no-image.png'};titlesNum++;break}}}}function removeRelatedDuplicates(){var b=new Array(0);c=new Array(0);e=new Array(0);f=new Array(0);g=new Array(0);for(var a=0;a<urls.length;a++){if(!contains(b,urls[a])){b.length+=1;b[b.length-1]=urls[a];c.length+=1;c[c.length-1]=titles[a];e.length+=1;e[e.length-1]=timeR[a];f.length+=1;f[f.length-1]=thumb[a];g.length+=1;g[g.length-1]=commentsNum[a]}}urls=b;titles=c;timeR=e;thumb=f;commentsNum=g}function contains(b,d){for(var c=0;c<b.length;c++){if(b[c]==d){return true}}return false}function printRelatedLabels(a){var y=a.indexOf('?m=0');if(y!=-1){a=a.replace(/\?m=0/g,'')}for(var b=0;b<urls.length;b++){if(urls[b]==a){urls.splice(b,1);titles.splice(b,1);timeR.splice(b,1);thumb.splice(b,1);commentsNum.splice(b,1)}}var c=Math.floor((titles.length-1)*Math.random());var b=0;if(titles.length==0){dw+=rn}else{dw+=ry;dw+='<div class="clear"/></div><ul>';while(b<titles.length&&b<20&&b<maxresults){if(y!=-1){urls[c]=urls[c]+'?m=0'}if(commentYN=='yes'){comments[c]=' - '+commentsNum[c]}else{comments[c]=''};dw+='<div class="related-post"><div class="related-post-title">'+titles[c]+'</div><a href="'+urls[c]+'" rel="nofollow"><img border="0" class="post-thumbnail" alt="'+titles[c]+'" src="'+thumb[c]+'"/></a></div></div>';if(c<titles.length-1){c++}else{c=0}b++}dw+='</ul>'};urls.splice(0,urls.length);titles.splice(0,titles.length);document.getElementById('related-posts').innerHTML=dw};
    //]]></script>
    <b:loop values='data:post.labels' var='label'>
    <script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&quot;' type='text/javascript'/>
    </b:loop>
    <script type='text/javascript'>var maxresults=6;removeRelatedDuplicates();printRelatedLabels(&#39;<data:post.url/>&#39;);</script>
    </b:if>
    </div>
    <div class='clear'/>

Выделенный зеленым участок определяет количество отображаемых постов.
Сохраняем шаблон и смотрим, что получилось.

2.) Теперь переходим к установке второго варианта. Все в том же разделе Шаблон - Изменить HTML ищем код </head> и перед ним вставляем код:

<!--Related Posts with thumbnails Scripts and Styles Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
#related-posts{float:left;width:auto;padding:10px;}
#related-posts a{border-right: 1px dotted #eaeaea;}
#related-posts a:hover{background: #EEEEEE;}
#related-posts h2{margin-top: 10px;background:none;font:18px Oswald;padding:3px;color:#999999; text-transform:uppercase;}
#related-posts .related_img {margin:5px;border:2px solid #f2f2f2;object-fit: cover;width:110px;height:100px;transition:all 300ms ease-in-out;-webkit-transition:all 300ms ease-in-out;-moz-transition:all 300ms ease-in-out;-o-transition:all 300ms ease-in-out;-ms-transition:all 300ms ease-in-out;-webkit-border-radius: 5px;  -moz-border-radius: 5px; border-radius: 5px; }
#related-title {color:#666;text-align:center;padding: 0px 5px 10px;font-size:12px;width:110px; height: 40px;}
#related-posts .related_img:hover{border:2px solid #E8E8E8;opacity:.7;filter:alpha(opacity=70);-moz-opacity:.7;-khtml-opacity:.7}</style>
<script type='text/javascript' src='http://helplogger.googlecode.com/svn/trunk/relatedposts.js' />
</b:if>
<!--Related Posts with thumbnails Scripts and Styles End-->

После, как и в первом варианте находим код <div class='post-footer'> помним, что их может быть два, нам же нужен второй и после него выкладываем следующий код:

<!-- Related Posts with Thumbnails Code Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='related-posts'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast != &quot;true&quot;'>
</b:if>
<script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=25&quot;' type='text/javascript'/></b:loop>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=5;
var relatedpoststitle=&quot;<b>Рекомендуем:</b>&quot;;
removeRelatedDuplicates_thumbs();
printRelatedLabels_thumbs();
</script>
</b:if>
<!-- Related Posts with Thumbnails Code End-->

Как и в первом случае код выделенный зеленым определяет количество отображаемых сообщений.

Сохраняем шаблон и проверяем результат установки второго варианта. Если вы все сделали правильно никаких проблем не должно возникнуть.



Поделиться в социальных сетях:
Facebook Twitter Vkontakte

Рекомендуем

15 Коммент.

Оставить комментарий
avatar
Opossum
июля 24, 2018

Использую тему emporio, но такого кода, после которого нужно вставить скрипт, просто нет.

более менее похожий кусок (не факт, правда, что форма комментов даст это нормально опубликовать):











ну как-то это не похоже на то где нужно вставить скрипт, да и не срабатывает в разных вариантах.

Ответить
avatar
Марк Корвин
июля 25, 2018

В теме Emporio попробуйте поставить скрипт после <data:post.body/>

Ответить
avatar
Opossum
июля 25, 2018

Ох, спасибо, наконец-то заработало) из множества вариантов это первый

Ответить
avatar
John
января 17, 2019

Здравствуйте. Снова вас беспокою.
В прошлый раз спрашивать по повожу индексации яндекса, в другой статье вашей.
В общем если вас не затруднит ответь, вот вопросы:
1. Возможно ли запретить индексирования стандартного виджета "популярные сообщения" и js "похожие сообщения", взятого из этой темы? Из за этих виджетов, в поиске выдается еще десяток страниц, где берется текст из виджетов. По идеи !--noindex-- можно было бы попробовать прикрыть, но это только для яндекса, хотелось бы универсальный вариант, если такой есть. Убирать виджеты не особо хотелось бы.

2. При поиске сайт+текст, выдает в поиске еще ссылки на другие страницы, где встречается данный текст, в описании других страниц пишется - "титл главной страницы ... название текста, который я ввел". Если ввести популярный сайт+текст, если есть схожий текст на других страницах, в описании пишется - "текст descr ... название текста"
Возможно ли реализовать вариант как на топовых сайтах? Что бы, если выдается в поиске другие страницы, в описание вначале указывался descr ссылающий страницы ... после указывался название текста, который я ввел.

Пока что не смог найти решение данного симбиоза, если выше сказанное можно так обозвать. Заранее благодарен за ответ.

Ответить
avatar
John
января 17, 2019

По поводу второго вопроса, наверное поиск берет с титла текст, как в шапке в изображении лого alt указан такой же как в титле. Как сразу же после титла идет текст из верхнего меню.
Скорее всего так, но не уверен. Есть ли способ, изменить виджет, что бы alt лого можно было менять через дизайн?
Вот нашел код шапки с алт
a expr:href='data:blog.homepageUrl' style='display: inline-block'
img expr:alt='data:title' expr:id='data:widget.instanceId + "_headerimg"' expr:src='data:sourceUrl' style='display: block'/
/a
-------------------------------------
И чуть ниже код отвечающий за настройку алт через дизайн, точнее титл
b:includable id='title'
b:tag cond='data:blog.url != data:blog.homepageUrl' expr:href='data:blog.homepageUrl' name='a'
data:title/

Ответить
avatar
Марк Корвин
января 19, 2019

Попробуйте в шаблоне обрамить код виджетов noindex.
Для гугла разве что шифровать кода виджетов и то это не хорошая политика.

Ответить
avatar
Марк Корвин
января 19, 2019

Изменить alt лого можно только в редакторе HTML

Ответить
avatar
John
января 19, 2019

Спасибо за ответ.

Ответить
avatar
John
января 19, 2019

По поводу виджетов у меня сложилось двоякое мнение. Если почитать статьи по поводу виджетов "похожие публикации" и "популярные публикации", в них будет сказано о большой пользе использовании их, для тех же поисковиков.
На деле если посмотреть популярные сайты, в моем случае связанные с софтом, у них или виджетов нет выше написанных или есть, но в заголовки виджетов просто в стилях div или p.
Хотя на других не менее популярных сайта, похожие публикации будут в тегах h2 или h3, на одном сайте вообще виджет "похожие публикации" был заголовок h2, а ссылки в нем h3.
По идеи, h1 тег только 1 и должен принадлежат заголовку статьи. Одно я видел на всех этих сайта, h1 не принадлежал названию сайта, но если почитать владельцев многих блогов, у везде написано, что на главной сайта должен h1 принадлежать названию сайта.
По поводу h2-h4 тегах, бытует два мнения, первое что теги эти должны принадлежать только статье на странице, другие пишут что эти теги под хлам, например для виджетов. Ну на главной или в тех же категориях, h2 понятно занимает место для заголовков статей, хотя некоторые писали что делали для h1 тег и поисковики на ура принимали.

Каша какая-то получается. У себя, с главной убрал новости, для заголовки статей сделал h1, в ярлыках можно было сделать h2, но смысла нету, как все равно в роботе они прикрыты, загловки виджетов сделал в стиле dev, но пока не уверен, возможно позже сделаю h3 или h4 их.

По поводу шифрования, то же читал, но вроде почти им ни кто не пользуется, если полазить по сайтам, у всех виджеты открытого типа. Как выше писал, некоторые их наоборот заголовки делают в тегах h2.

А что вы думаете по этой всей теме?
Не много не по теме, но не могли вы скинуть свой title для главной и постов, желательно с b:if cond, если вас не затруднит. Заранее спасибо.

Ответить
avatar
Марк Корвин
января 21, 2019

Главное это наличие тега H1 в заголовках блога и публикациях. Не страшно, если заголовок виджета H2 или H3.

Ответить
avatar
Владимир
марта 25, 2019

Добрый день!
Вы сами пробовали этот виджет? Можете сказать, использует ли он все ключевые слова для подбора похожих сообщений или только одно?
У меня уже стоит подобный виджет, и, судя по предлагаемым им сообщениям, он как раз использует одно из ключевых слов, а не все.

Ответить
avatar
Марк Корвин
марта 25, 2019

Здравствуйте. Пробовал не то слово, если присмотреться, то можно заметить, что данный виджет установлен в моем шаблоне, так что я юзаю его по полной😁. Вы знаете, что такое ярлыки в Blogger? В общем этот виджет показывает те сообщения, которые относятся к определенному ярлыку, то есть он не осуществляет поиск по ключевым словам заголовков или текста сообщений.

Ответить
avatar
Владимир
апреля 01, 2019

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

Ответить
avatar
Марк Корвин
апреля 01, 2019

Тогда перед скриптом виджета он же JS добавьте:
<b:if cond='data:blog.pageType == &quot;item&quot;'>
А после него:
</b:if>
Сохраните тему.

Ответить
avatar
Владимир
апреля 05, 2019

Я уже добавил !=index, теперь все нормально. И поправил некоторые параметры, чтобы виджет лучше вписался в мою тему. Кстати о них можно было бы написать в статье (заголовок виджета, шрифты и цвета, количество предлагаемых сообщений, caps для их названий и количество выводимых символов, ...)

Ответить