Притурки. Статистика за блога с нов дизайн

Pepa Tabakova

събота

Здравейте, приятели. Много начинаещи блогъри инсталират на блоговете си притурка за статистически данни със скриптове от трети страни. И аз съм направила същото. Инсталирала съм дори няколко. Но ние, които сме на платформата Blogger, разполагаме с надеждна, доказана, "наша" притурка за статистика.
За съжаление тя показва само броя на посещенията в блога ни. Иначе, всичко е наред, само дето външният ѝ вид е доста непривлекателен.

Притурка Статистика за блога

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

Първа стъпка

➤Преди всичко трябва да инсталирате притурката за статистика;

➤Контролен панел ➔ Оформление ➔ Добавяне на притурка ➔ Статистика в блога;

➤Преместете притурката в страничната колона;

➤Запазете подредбата;

Втора стъпка

Отидете в раздела "Тема", намерете затварящия маркер </ head> и над него поставете следния код:

font-weight:700;}
.counts .count {display:inline-block;font-size:16px;height:30px;
vertical-align:top;direction:ltr;float:right;color:#333;font-weight:700!important;}
.counts:hover .titles:before {color:#333!important;border-radius:2px;border-color:rgba(255,255,255,0.1);}
.counter-wrapper.text-counter-wrapper:before, .counts:before {display:inline-block;

font-size:13px;font-family:FontAwesome;font-style:normal;font-weight:normal;margin:0 10px 0 10px;float:left;width:10px;text-align:center;}
.counter-wrapper.text-counter-wrapper:before, .counts:before {
display:block;background-color:#DCDCDC;
color:#333;width:35px;height:35px;font-size:18px;line-height:35px;border-radius:2px;margin:0px 8px 0 0;}
.counter-wrapper.text-counter-wrapper:before {content:"\f06e";}
.counts.post2:before {content:"\f044";}
.counts.comment:before {content:"\f0e6";}
#Stats1_content {width:auto;height:auto;background-color:#DCDCDC;
}
</style>

В кода с червено отбелязах и местата, които определят цвета на основния фон. Може да ги замените с желан от вас. Таблицата на цветовете е тук.

Трета стъпка

➤Отново идете в "Тема" ➔ кликнете върху списъка с притурки ➔ намерете идентификационния номер на притурката за статистически данни. Обикновено това е Stats1.

➤Кликнете върху него и ще бъдете пренасочени към кода на притурката. Кликнете върху черния маркер - стрелка, който е в ляво, след което ще се появят още два такива маркера.

➤Кликнете и върху тях, за да отворите целия код на притурката.

➤Намерете реда

<b:widget id='Stats1' locked='false' title='СТАТИСТИКА' type='Stats'>

И заменете всичко в него, като започнете с <b:widget id='Stats1'... и стигнете до </b:includable></b:widget>, включително, с този код:

<b:widget id='Stats1' locked='false' title='Статистика' type='Stats' version='1'>
<b:widget-settings>
<b:widget-setting name='showGraphicalCounter'>false</b:widget-setting>
<b:widget-setting name='showAnimatedCounter'>false</b:widget-setting>
<b:widget-setting name='showSparkline'>false</b:widget-setting>
<b:widget-setting name='sparklineStyle'>BLACK_TRANSPARENT</b:widget-

setting>
<b:widget-setting name='timeRange'>ALL_TIME</b:widget-setting>
</b:widget-settings>
<b:includable id='main'>
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content'>

<div expr:id='data:widget.instanceId + "_content"' style='display:

none;'>

<b:if cond='data:showSparkline'>
<img alt='Sparkline' expr:id='data:widget.instanceId + "_sparkline"' height='30' src='http://2.bp.blogspot.com/-nsxCtkYnchQ/VLEifAyf97I/AAAAAAAAIlk/9Viyy0W9r04/s1600/FFF.png' title=

'Статистика' width='75'/>
</b:if>
<b:if cond='data:showGraphicalCounter'>
<span class='counter-wrapper graph-counter-wrapper' expr:id='data:widget.instanceId + "_totalCount"'/>
<b:else/>
<span class='counter-wrapper text-counter-wrapper' expr:id='data:widget.instanceId + "_totalCount"'/>
</b:if>
<script type='text/javascript'>
function postCount(json){
document.write("<span class='counts post2'>Брой публикации ");
var count = json.feed.openSearch$totalResults.$t;
document.write("<span class='count'>" + count + "</span>");
document.write("</span>")
}

function numberOfComments(json){
document.write("<span class='counts comment'> Брой коментари ");
var count = json.feed.openSearch$totalResults.$t;
document.write("<span class='count'>" + count + "</span>");
document.write("</span>")
}

</script>
<script src='/feeds/posts/default?alt=json-in-script&amp;max-results=0&amp;callback=postCount' type='text/javascript'/>
<script src='/feeds/comments/default?alt=json-in-script&amp;max-results=0&amp;callback=numberOfComments'/>

</div>
</div>
</b:includable>
</b:widget>

Ако все още имате съмнения относно правилността на действията си в кода на темата, по-добре е да направите резервно нейно копие или да пробвате първо на тестовия си блог.
След като инсталирате и промените кодовете, кликнете върху функцията за визуализация. Ако виждате нов вид притурка за статистика, можете да запазите промените. Ако нещо внезапно се обърка изберете Възстановяване на промените и направете трите стъпки отново.

Важно!

Тази притурка съдържа три реда. Ако някой от тях се е разместил и не се вижда коректно, то ширината на страничната ви колона е малка. Увеличете я.

И още нещо. В първия код, който е код за стиловете, можете да промените цвета на фона, размер и цвят на шрифта, рамката и други. Ако имате въпроси, моля пишете в коментарите.

Това е всичко. Благодаря на всички за посещението и доскоро!

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

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

Cancel

Притурка Статистика за блога

Първа стъпка

Втора стъпка

Трета стъпка

PEPA TABAKOVA