8.22.2009

Как добавить чат на свой блог

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

Есть способ, при помощи которого видишь, владелец блога и читатели в сети, отключены или не делали логин.

Для этого вы можете добавить чат в свой блог.



Если вы хотите добавить его в свой блог, следуйте по инструкции ниже...


Первым делом потребуется регистрация на сайте

chatroll.

Перейдите по ссылке расположенной выше, а потом
на странице вверху, будет ссылка sign up(как на изображении ниже), перейдите по ней и создайте аккаунт. 






Затем перейдите по ссылке Home

Найдите кнопку Create a chatroll(как на изображении ниже)


Нажминте на неё, и создайте форму.



В форме добавьте имя будущего поля и url(Как показано на изображении выше)

Перейдите по ссылке Next>

Затем выберите, в форме опцию  публикации для всех(как на изображении ниже)


Тепеть перейдите по ссылке Embed(как на изображении ниже)

Вы увидите такое окно


Чуть выше выделеного фрагмента находится два текстовых поля,  левое отвечает за ширину, а правое за длину.

Выставляет в пикселях.

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



Выставите точный размер, который вам подойдёт.

Код выделеный красном - это html код виджета, не закрывайте эту страницу.

Перейдите в настройки блога > Макет > Добавить гаджет

Выберите Html/javascript

Перейдите на страницу с кодом виджета(где настройки чата), скопируйте html код и вставьте его в виджет. Теперь сохраните. Виджет поместите на то место, которое планировали.

На этом всё! Чтобы опубликовать своё сообщение, введите его в текстовое поле и нажмите enter.

8.17.2009

Ajax облако тегов для Blogger

11 коммент
На сегодняшний момент это новейшая функция, которая улучшает работу блога в разы.

Ajax на много ускоряет работу блога. Это очень удобный виджет, работает в броузерах FireFox, Opera, InternetExplorer6 и др.

Хитрость быстроты работы такого облака тегов, это то, что перезагружается только колонка с сообщениями, а вы остаётесь на прежней странице.

Для того, чтобы облако работало нужно использовать XML шаблон(Не класический)

На моём блоге установлено ajax облако тегов, можете использовать в качестве примера.

Чтобы установить ajax облако тегов на своём блоге, выполните операции по инструкции, которые расположены ниже:


Шаг #1 | Шаг #2 | Шаг #3 | Шаг #4 | Шаг #5 | Шаг #6 |


Установка Ajax облака тегов(Инструкция)

Эту операцию (Шаг #1,#2) необходимо сделать если у вас ещё не установлено облако тегов.

Если установлено, то переходите к Шагу #3

Приступим к раблоте...

Шаг #1

Чтобы добавить ajax облако тегов в свой блог нужно выполнить не сколько действий:


Перейдите в Настройки блога > Макет >


Затем перейдите по ссылке: "Добавить гаджет"


Добавьте виджет "Ярлыки"

Теперь перейдите в вкладку Макет> Изменить HTML

Найдите в шаблоне тег

]]></b:skin>

Перед ним вставьте код расположеный ниже:

/* Label Cloud Styles



----------------------------------------------- */

#labelCloud {text-align:center;font-family:arial,sans-serif;}

#labelCloud .label-cloud li{display:inline;background-image:none
!important;padding:0 5px;margin:0;vertical-align:baseline
!important;border:0 !important;}

#labelCloud ul{list-style-type:none;margin:0 auto;padding:0;}

#labelCloud a img{border:0;display:inline;margin:0 0 0
3px;padding:0}

#labelCloud a{text-decoration:none}

#labelCloud a:hover{text-decoration:underline}

#labelCloud li a{}

#labelCloud .label-cloud {}

#labelCloud .label-count{padding-left:0.2em;font-size:9px;color:#000}

#labelCloud .label-cloud li:before{content:"" !important}

Шаг #2

Теперь найдите следующий код

]]></b:skin>

Сразу после него, но перед этим тегом

</head>

вставьте скрипт расположеный ниже:
<script type='text/javascript'>

// Label Cloud User Variables

var cloudMin = 1;

var maxFontSize = 20;

var maxColor = [0,0,255];

var minFontSize = 10;

var minColor = [0,0,0];

var lcShowCount = false;

</script>


Шаг #3

Сейчас вы должны будете выполнить ответственную операцию

Проверьте галочку "Расширить шаблоны виджета", она должна быть не нажата

Найдите код примерно похожий на этот:


<b:widget
id='Label1' locked='false' title='Labels' type='Label'/>



Замените его на следующий:


<b:widget id='Label1' locked='false' title='Label Cloud' type='Label'>

<b:includable id='main'>

<b:if cond='data:title'>

<h2><data:title/></h2>

</b:if>

<div class='widget-content'>

<div id='labelCloud'/>

<script type='text/javascript'>

// Don't change anything past this point -----------------
// Cloud function s() ripped from del.icio.us

function s(a,b,i,x){

if(a&gt;b){

var m=(a-b)/Math.log(x),v=a-Math.floor(Math.log(i)*m)

}
else{
var m=(b-a)/Math.log(x),v=Math.floor(Math.log(i)*m+a)
}
return v
}

var c=[];

var labelCount = new Array();

var ts = new Object;

<b:loop values='data:labels' var='label'>
var theName = &quot;<data:label.name/>&quot;;

ts[theName] = <data:label.count/>;

</b:loop>
for (t in ts){

if (!labelCount[ts[t]]){
labelCount[ts[t]] = new Array(ts[t])

}
}
var ta=cloudMin-1;
tz = labelCount.length - cloudMin;
lc2 = document.getElementById('labelCloud');

ul = document.createElement('ul');

ul.className = 'label-cloud';

for(var t in ts){
if(ts[t] &lt; cloudMin){

continue;
}
for (var i=0;3 &gt; i;i++) {

c[i]=s(minColor[i],maxColor[i],ts[t]-ta,tz)

}

var fs = s(minFontSize,maxFontSize,ts[t]-ta,tz);

li = document.createElement('li');

li.style.fontSize = fs+'px';

li.style.lineHeight = '1';

a = document.createElement('a');

a.title = ts[t]+' Posts in '+t;

a.className = 'phyLabel';

a.style.color = 'rgb('+c[0]+','+c[1]+','+c[2]+')';

a.href = '/search/label/'+encodeURIComponent(t);

if (lcShowCount){

span = document.createElement('span');

span.innerHTML = '('+ts[t]+') ';

span.className = 'label-count';

a.appendChild(document.createTextNode(t));

li.appendChild(a);

li.appendChild(span);

}

else {a.appendChild(document.createTextNode(t));

li.appendChild(a);

}
ul.appendChild(li);

abnk = document.createTextNode(' ');

ul.appendChild(abnk);
}
lc2.appendChild(ul);

</script>

<noscript>
<ul>

<b:loop values='data:labels'
var='label'>

<li>

<b:if cond='data:blog.url == data:label.url'>


<data:label.name/>

<b:else/>

<a expr:href='data:label.url'><data:label.name/></a>

</b:if>

(<data:label.count/>)

</li>

</b:loop>

</ul>

</noscript>

<b:include name='quickedit'/>

</div>

</b:includable>

</b:widget>


Шаг #4

Теперь найдите этот тег
]]></b:skin>


Сразу после него, но перед этим тегом

</head>

вставьте скрипты расположеные ниже:


<script src='http://myslvscript.googlecode.com/files/jquery-latest_pack.js'
type='text/javascript'/>


<script src='http://myslvscript.googlecode.com/files/jq_plugins.js'
type='text/javascript'/>



<script src='http://myslvscript.googlecode.com/files/slvbase1.js'
type='text/javascript'/>

<script type='text/javascript'>


function labelLabel(label){

$(&#39;#top&#39;).ScrollTo(100);

$(&#39;#main&#39;).html(&#39;&lt;div id=&quot;phyLoad&quot; style=&quot;margin-top:5px&quot;&gt;&lt;img src=&quot;http://myslvscript.googlecode.com/files/spinner_white.gif&quot; style=&quot;vertical-align:middle; padding-right:5px;&quot;/&gt;Загрузка...&lt;/div&gt;&#39;).json( &#39;http://ВашUrlБлога.blogspot.com/feeds/posts/summary/-/&#39;+label+&#39;?max-results=50&amp;orderby=published&amp;alt=json-in-script&amp;callback={callback}&#39;, pDisplayLabels );

}

</script>


<script src='http://myslvscript.googlecode.com/files/slvbase2.js'
type='text/javascript'/>

Не забудьте заменить Слово в скрипте ВашUrlБлога на url-адрес вашего блога.


Шаг #5

Эта операция понадобится, если вы свой шаблон сильно изменяли или он имеет не стандартный вид.

Найдите в шаблоне код похожий на этот

<b:widget id='Blog1' locked='true' title='Сообщения блога' type='Blog'/>

Перед ним располжен код похоий на этот

<b:section class='main' id='center-wap' showaddelement='no'>

или этот

<b:section id='main' showaddelement='no'>

Замените его на код расположеный ниже:

<b:section class='main' id='main' showaddelement='no'>

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

Найдите этот код в шаблоне

<script src='http://code.jquery.com/jquery-latest.min.js' type='text/javascript'/>


Его нужно обязательно удалить.

Эта операция не повлияет на работу архива блога в виде календаря.


Шаг #6

Дальше уже идёт настройка дизайна.

Перейдите по ссылке которая расположена ниже...


Галерея дизайнов сообщений для ajax облака тегов

Шаг #1 | Шаг #2 | Шаг #3 | Шаг #4 | Шаг #5 | Шаг #6 |

8.05.2009

А можно ли скрывать навбар?

4 коммент


Есть много статей, в которых пишется, как скрыть навбар при помощи стилей.

А можно ли это делать? Как сервис BLOGGER отреагирует на это?

Меня однажды замучил этот вопрос, полез в интернет и нашёл интересную статью(Сервис BLOGGER) Перейти

В ней описывалось: что такое навбар, для чего он нужен и дт.

И вдруг я увидел в самом конце отрывок текста:

"
  • Если Вы публикуете блог не через FTP, отключить Navbar нельзя.
  • Мы приложили все усилия к тому, чтобы панель Navbar удачно вписывалась в дизайн индивидуальных шаблонов. Некоторые проблемы с ее отображением все же могут возникнуть. Если это произойдет, можно попробовать предпринять некоторые шаги, чтобы их устранить.

"


Когда мне захотелось посмотреть XML шаблоны в интернете, я увидел, что у всех до одного скрыт навбар. Blogger разрешает публиковать блог через FTP сервер только если вы используете классический шаблон в HTML виде.

Это даёт повод задуматься...

Если вы хотите отобразить навбар на блоге(Если он скрыт) нужно сделать одну операцию:

Перейдите в настройки блога> Макет > Изменить HTML


Найдите код



#navbar-iframe {
height:0;
visibility:hidden;
display:none;
}


Теперь просто его удалите.

Это всё!

8.02.2009

Paginator для blogger

4 коммент
Это очень удобная функция. Пагинация нумерует страницы, как в книге, позволяет читателям уходить глубоко в архив блога с огромной лёгкостью.

Если вы хотите добавить этот хак, следуйте по инструкции:

В данном случае вы можете выбирать дизайн:

Перейти далее





Перейти далее






Для того, чтобы добавить такой пагенатор следует выполнить несколько операций:

Перейдите в Настройки блога > Макет > Изменить HTML

Найдите строчку

]]></b:skin>


Перед ней вставьте стили:


.showpageArea a {
margin:0.7px;
color:#000;
text-decoration:none;
}
.showpageNum a {
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdC84RI0AtD16Lad2Wpm61PVBazzmbdKQl-rJ1ZQv6yZ-QPMwM4nngI24j3I9ybdnaXFFSgxlGDvIZKrPyAZNRtwqKTgTtyc5qipXyR7ibnblii4lxvEVaOnWNurAjvlG247ZAWzL1Qzg/) ;

padding:9px 23px 14px 14px;
text-decoration:none;

}
.showpageNum a:hover {
color:#FFF !important;

background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEaWOWJJsXExWTDRCX9LHYn86NwdkjFIzQEnNnpQBAjt5N85LpcEZ6-S5AiWq_GDwXquTyBncgywbL49h4fgjkvY1wg6cgSt04wUlvsMSnig6RxQg-I6VUR4VKs9oW1XmInAsz61QZ7_I/);

padding:8px 24px 14px 14px;

background-color:#ccc;
}
.showpagePoint {
color:#FFFFFF;
text-decoration:none;

background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEaWOWJJsXExWTDRCX9LHYn86NwdkjFIzQEnNnpQBAjt5N85LpcEZ6-S5AiWq_GDwXquTyBncgywbL49h4fgjkvY1wg6cgSt04wUlvsMSnig6RxQg-I6VUR4VKs9oW1XmInAsz61QZ7_I/) repeat scroll 0% 0%;

padding:8px 24px 14px 14px;
}
.showpageOf {
display:none;
text-decoration:none;
padding:3px;
margin: 0 3px 0 0;
}
.showpage a {
text-decoration:none;

padding:4px;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link,.showpage a:link {
text-decoration:none;
color:#333;
}

.showpage{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEif1_4UgP3FZ2IgI-_k66wsaWAQml-dzsnsgMj4ULR16X5Jyjn6KIhOgoUXJu8pjgestN0CbgkRd8Kha1vUkeIR1kYjIThciKYROaPNSISsyjuF3ig4U7VsKvgTK0BgPKnhzbqCHpjssVw/);
font-size:14px;
padding:10px 71px 10px 7px;
}



.showpage-next{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEif1_4UgP3FZ2IgI-_k66wsaWAQml-dzsnsgMj4ULR16X5Jyjn6KIhOgoUXJu8pjgestN0CbgkRd8Kha1vUkeIR1kYjIThciKYROaPNSISsyjuF3ig4U7VsKvgTK0BgPKnhzbqCHpjssVw/);
font-size:15px;
padding:10px 34px 10px 7px;

}
#blog-pager{
background:#FFFFFF none repeat scroll 0% 0%;
padding:1em;
text-align:center;

}


Теперь найдите строчку

<b:widget id='Blog1' locked='true' title='Сообщения
блога' type='Blog'/>


Сразу под ней вы увидите тег

</b:section>


Под ним вставьте код:



&lt;script type=&quot;text/javascript&quot;&gt;


function showpageCount(json) {


var thisUrl = location.href;


var htmlMap = new Array();


var isFirstPage = thisUrl.substring(thisUrl.length-5,thisUrl.length)==&quot;.com/&quot;;


var isLablePage = thisUrl.indexOf(&quot;/search/label/&quot;)!=-1;


var isPage = thisUrl.indexOf(&quot;/search?updated&quot;)!=-1;


var thisLable = isLablePage ? thisUrl.substr(thisUrl.indexOf(&quot;/search/label/&quot;)+14,thisUrl.length) : &quot;&quot;;


thisLable = thisLable.indexOf(&quot;?&quot;)!=-1 ?
thisLable.substr(0,thisLable.indexOf(&quot;?&quot;)) :
thisLable;


var thisNum = 1;


var postNum=1;


var itemCount = 0;


var fFlag = 0;


var eFlag = 0;


var html= &#39;&#39;;


var upPageHtml =&#39;&#39;;


var downPageHtml =&#39;&#39;;

var pageCount = 5;

var displayPageNum = 5;

var upPageWord = &#39;Предыдущие&#39;;

var downPageWord = &#39;Далее&#39;;


var labelHtml = &#39;&lt;span class=&quot;showpageNum&quot;&gt;&lt;a href=&quot;/search/label/&#39;+thisLable+&#39;?&amp;max-results=&#39;+pageCount+&#39;&quot;&gt;&#39;;

for(var i=0, post; post = json.feed.entry[i]; i++) {

var timestamp = post.published.$t.substr(0,10);


var title = post.title.$t;


if(isLablePage){


if(title!=&#39;&#39;){


if(post.category){


for(var c=0, post_category; post_category = post.category[c]; c++)
{


if(encodeURIComponent(post_category.term)==thisLable){


if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){


if(thisUrl.indexOf(timestamp)!=-1 ){


thisNum = postNum;


}

postNum++;

htmlMap[htmlMap.length] =
&#39;/search/label/&#39;+thisLable+&#39;?updated-max=&#39;+timestamp+&#39;T00%3A00%3A00%2B08%3A00&amp;max-results=&#39;+pageCount;


}


}


}


}//end if(post.category){






itemCount++;


}


}else{


if(title!=&#39;&#39;){


if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){


if(thisUrl.indexOf(timestamp)!=-1 ){


thisNum = postNum;


}


if(title!=&#39;&#39;) postNum++;


htmlMap[htmlMap.length] =&#39;/search?updated-max=&#39;+timestamp+&#39;T00%3A00%3A00%2B08%3A00&amp;max-results=&#39;+pageCount;


}


}


itemCount++;


}


}


for(var p =0;p&lt; htmlMap.length;p++){


if(p&gt;=(thisNum-displayPageNum-1) &amp;&amp; p&lt;(thisNum+displayPageNum)){

if(fFlag ==0 &amp;&amp; p == thisNum-2){


if(thisNum==2){


if(isLablePage){


upPageHtml = labelHtml + upPageWord +&#39;&lt;/a&gt;&lt;/span&gt;&#39;;


}else{


upPageHtml = &#39;&lt;span class=&quot;showpage-next&quot;&gt;&lt;a href=&quot;/&quot;&gt;&#39;+ upPageWord +&#39;&lt;/a&gt;&lt;/span&gt;&#39;;

}


}else{


upPageHtml = &#39;&lt;span class=&quot;showpage-next&quot;&gt;&lt;a href=&quot;&#39;+htmlMap[p]+&#39;&quot;&gt;&#39;+ upPageWord +&#39;&lt;/a&gt;&lt;/span&gt;&#39;;

}

fFlag++;

}


if(p==(thisNum-1)){


html += &#39;&lt;span class=&quot;showpagePoint&quot;&gt;&#39;+thisNum+&#39;&lt;/span&gt;&#39;;

}else{


if(p==0){


if(isLablePage){


html = labelHtml+&#39;1&lt;/a&gt;&lt;/span&gt;&#39;;


}else{


html += &#39;&lt;span class=&quot;showpageNum&quot;&gt;&lt;a href=&quot;/&quot;&gt;1&lt;/a&gt;&lt;/span&gt;&#39;;

}


}else{


html += &#39;&lt;span class=&quot;showpageNum&quot;&gt;&lt;a href=&quot;&#39;+htmlMap[p]+&#39;&quot;&gt;&#39;+ (p+1) +&#39;&lt;/a&gt;&lt;/span&gt;&#39;;


}


}






if(eFlag ==0 &amp;&amp; p == thisNum){


downPageHtml = &#39;&lt;span class=&quot;showpage&quot;&gt; &lt;a href=&quot;&#39;+htmlMap[p]+&#39;&quot;&gt;&#39;+ downPageWord +&#39;&lt;/a&gt;&lt;/span&gt;&#39;;

eFlag++;


}


}//end if(p&gt;=(thisNum-displayPageNum-1) &amp;&amp; p&lt;(thisNum+displayPageNum)){


}//end for(var p =0;p&lt; htmlMap.length;p++){


if(thisNum&gt;1){


if(!isLablePage){


html = &#39;&#39;+upPageHtml+&#39; &#39;+html+&#39; &#39;;


}else{


html = &#39;&#39;+upPageHtml+&#39; &#39;+html+&#39; &#39;;


}


}






html = &#39;&lt;div class=&quot;showpageArea&quot;&gt;&lt;span style=&quot;COLOR: #000;&quot; class=&quot;showpageOf&quot;&gt; Страниц (&#39;+(postNum-1)+&#39;)&lt;/span&gt;&#39;+html;





if(thisNum&lt;(postNum-1)){


html += downPageHtml;






}






if(postNum==1) postNum++;


html += &#39;&lt;/div&gt;&#39;;






if(isPage || isFirstPage || isLablePage){


var pageArea = document.getElementsByName(&quot;pageArea&quot;);


var blogPager = document.getElementById(&quot;blog-pager&quot;);






if(postNum &lt;= 2){


html =&#39;&#39;;


}






for(var p =0;p&lt; pageArea.length;p++){


pageArea[p].innerHTML = html;


}






if(pageArea&amp;&amp;pageArea.length&gt;0){


html =&#39;&#39;;


}






if(blogPager){


blogPager.innerHTML = html;


}


}






}


&lt;/script&gt;






&lt;script src=&quot;/feeds/posts/summary?alt=json-in-script&amp;callback=showpageCount&amp;max-results=99999&quot;; type=&quot;text/javascript&quot;&gt;&lt;/script&gt;

</div>




На этом всё!!!








Для того, чтобы добавить такой пагенатор следует выполнить несколько операций:

Перейдите в Настройки блога > Макет > Изменить HTML

Найдите строчку

]]></b:skin>


Перед ней вставьте стили:



.showpageArea a {
text-decoration:underline;
}
.showpageNum a {
text-decoration:none;
border: 1px solid #ccc;
margin:0 3px;
padding:3px;
}
.showpageNum a:hover {
border: 1px solid #ccc;
background-color:#ccc;
}
.showpagePoint {
color:#333;
text-decoration:none;
border: 1px solid #ccc;
background: #ccc;
margin:0 3px;
padding:3px;
}
.showpageOf {
text-decoration:none;
padding:3px;
margin: 0 3px 0 0;
}
.showpage a {
text-decoration:none;
border: 1px solid #ccc;
padding:3px;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link,.showpage a:link {
text-decoration:none;
color:#333;
}



Теперь найдите строчку

<b:widget id='Blog1' locked='true' title='Сообщения
блога' type='Blog'/>


Сразу под ней вы увидите тег

</b:section>


Под ним вставьте код:

&lt;script type=&quot;text/javascript&quot;&gt;



function showpageCount(json) {

var thisUrl = location.href;

var htmlMap = new Array();

var isFirstPage = thisUrl.substring(thisUrl.length-5,thisUrl.length)==&quot;.com/&quot;;

var isLablePage = thisUrl.indexOf(&quot;/search/label/&quot;)!=-1;

var isPage = thisUrl.indexOf(&quot;/search?updated&quot;)!=-1;

var thisLable = isLablePage ?
thisUrl.substr(thisUrl.indexOf(&quot;/search/label/&quot;)+14,thisUrl.length)
: &quot;&quot;;

thisLable = thisLable.indexOf(&quot;?&quot;)!=-1 ?
thisLable.substr(0,thisLable.indexOf(&quot;?&quot;)) :
thisLable;

var thisNum = 1;

var postNum=1;

var itemCount = 0;

var fFlag = 0;

var eFlag = 0;

var html= &#39;&#39;;

var upPageHtml =&#39;&#39;;

var downPageHtml =&#39;&#39;;



var pageCount = 5;

var displayPageNum = 5;

var upPageWord = &#39;Previous&#39;;

var downPageWord = &#39;Next&#39;;







var labelHtml = &#39;&lt;span
class=&quot;showpageNum&quot;&gt;&lt;a
href=&quot;/search/label/&#39;+thisLable+&#39;?&amp;max-results=&#39;+pageCount+&#39;&quot;&gt;&#39;;



for(var i=0, post; post = json.feed.entry[i]; i++) {

var timestamp = post.published.$t.substr(0,10);

var title = post.title.$t;

if(isLablePage){

if(title!=&#39;&#39;){

if(post.category){

for(var c=0, post_category; post_category = post.category[c]; c++) {

if(encodeURIComponent(post_category.term)==thisLable){

if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){

if(thisUrl.indexOf(timestamp)!=-1 ){

thisNum = postNum;

}



postNum++;

htmlMap[htmlMap.length] =
&#39;/search/label/&#39;+thisLable+&#39;?updated-max=&#39;+timestamp+&#39;T00%3A00%3A00%2B08%3A00&amp;max-results=&#39;+pageCount;

}

}

}

}//end if(post.category){



itemCount++;

}



}else{

if(title!=&#39;&#39;){

if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){

if(thisUrl.indexOf(timestamp)!=-1 ){

thisNum = postNum;

}



if(title!=&#39;&#39;) postNum++;

htmlMap[htmlMap.length] =
&#39;/search?updated-max=&#39;+timestamp+&#39;T00%3A00%3A00%2B08%3A00&amp;max-results=&#39;+pageCount;

}

}

itemCount++;

}

}



for(var p =0;p&lt; htmlMap.length;p++){

if(p&gt;=(thisNum-displayPageNum-1) &amp;&amp; p&lt;(thisNum+displayPageNum)){

if(fFlag ==0 &amp;&amp; p == thisNum-2){

if(thisNum==2){

if(isLablePage){

upPageHtml = labelHtml + upPageWord +&#39;&lt;/a&gt;&lt;/span&gt;&#39;;

}else{

upPageHtml = &#39;&lt;span
class=&quot;showpage&quot;&gt;&lt;a
href=&quot;/&quot;&gt;&#39;+ upPageWord
+&#39;&lt;/a&gt;&lt;/span&gt;&#39;;

}

}else{

upPageHtml = &#39;&lt;span
class=&quot;showpage&quot;&gt;&lt;a
href=&quot;&#39;+htmlMap[p]+&#39;&quot;&gt;&#39;+
upPageWord +&#39;&lt;/a&gt;&lt;/span&gt;&#39;;

}



fFlag++;

}



if(p==(thisNum-1)){

html += &#39;&lt;span
class=&quot;showpagePoint&quot;&gt;&#39;+thisNum+&#39;&lt;/span&gt;&#39;;

}else{

if(p==0){

if(isLablePage){

html = labelHtml+&#39;1&lt;/a&gt;&lt;/span&gt;&#39;;

}else{

html += &#39;&lt;span
class=&quot;showpageNum&quot;&gt;&lt;a
href=&quot;/&quot;&gt;1&lt;/a&gt;&lt;/span&gt;&#39;;

}

}else{

html += &#39;&lt;span
class=&quot;showpageNum&quot;&gt;&lt;a
href=&quot;&#39;+htmlMap[p]+&#39;&quot;&gt;&#39;+
(p+1) +&#39;&lt;/a&gt;&lt;/span&gt;&#39;;

}

}



if(eFlag ==0 &amp;&amp; p == thisNum){

downPageHtml = &#39;&lt;span
class=&quot;showpage&quot;&gt; &lt;a
href=&quot;&#39;+htmlMap[p]+&#39;&quot;&gt;&#39;+
downPageWord +&#39;&lt;/a&gt;&lt;/span&gt;&#39;;

eFlag++;

}

}//end if(p&gt;=(thisNum-displayPageNum-1) &amp;&amp; p&lt;(thisNum+displayPageNum)){

}//end for(var p =0;p&lt; htmlMap.length;p++){



if(thisNum&gt;1){

if(!isLablePage){

html = &#39;&#39;+upPageHtml+&#39; &#39;+html +&#39; &#39;;

}else{

html = &#39;&#39;+upPageHtml+&#39; &#39;+html +&#39; &#39;;

}

}



html = &#39;&lt;div
class=&quot;showpageArea&quot;&gt;&lt;span
style=&quot;COLOR: #000;&quot;
class=&quot;showpageOf&quot;&gt; Pages
(&#39;+(postNum-1)+&#39;)&lt;/span&gt;&#39;+html;



if(thisNum&lt;(postNum-1)){

html += downPageHtml;



}



if(postNum==1) postNum++;

html += &#39;&lt;/div&gt;&#39;;



if(isPage || isFirstPage || isLablePage){

var pageArea = document.getElementsByName(&quot;pageArea&quot;);

var blogPager = document.getElementById(&quot;blog-pager&quot;);



if(postNum &lt;= 2){

html =&#39;&#39;;

}



for(var p =0;p&lt; pageArea.length;p++){

pageArea[p].innerHTML = html;

}



if(pageArea&amp;&amp;pageArea.length&gt;0){

html =&#39;&#39;;

}



if(blogPager){

blogPager.innerHTML = html;

}

}



}

&lt;/script&gt;



&lt;script
src=&quot;/feeds/posts/summary?alt=json-in-script&amp;callback=showpageCount&amp;max-results=99999&quot;;
type=&quot;text/javascript&quot;&gt;&lt;/script&gt;





На этом всё!!!




8.01.2009

Дата поста в виде календаря

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

Для того, чтобы добавить этот хак на свой блог, нужно
будет сделать несколько процедур:



Откройте настройки блога > Макет > Изменить HTML
Поставьте галочку : Расширить шаблон

Найдите в шаблоне строчку:

<TITLE><data:blog.pageTitle/></TITLE>


Под ней вставьте скрипты:


<SCRIPT
type='text/javascript'>
//<![CDATA[
/*********************************/
/*
http://trick-blog.blogspot.com
*/
/*********************************/
function
date_replace(date) {
var da = date.split('.');
var day = da[1],
mon = da[0], year = da[2];
var month = ['0','Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
document.write("<div class='month'>"+month[mon]+"</div> <div class='day'>"+day+"</div>");
}
//]]>
</SCRIPT>


Затем найдите код:

]]></b:skin>


Перед ним вставьте стили:




.dateblock {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjc2tuGRbH3kGIGNyEgD0KPF-IHmqeiTrX6suAhuGKdobklgQrVyfw1CMkanwS_2-z4TVBerBl4RYli-ys9VWJf891Nrlevq0n2KTlNyCNOWMgqIT38yjbEADyZwvwSturYxRyXP4nsMSc/")
no-repeat;
width: 50px;
margin: 0;
font-weight: bold;
height: 50px;
/*position: absolute;
top: 0;
left: 0;*/
float: left;
text-align: center;
}

.month {
font-size: 11px;
width: 37px;
margin: 0 5px;
text-transform: uppercase;
color: #fff;
}

.day {
color:#3366CC;
font-size: 19px;
width: 37px;
margin: 0 5px;

}



Теперь найдите код в шаблоне (Если есть):


.date-header {
margin: 1.5em 0 0;
font-weight: normal;
color: $dateHeaderColor;
font-size: 100%;
}


Если нет то этот

h2.date-header {
margin:1.5em 0 .5em;
}


Удалите этот фрагмент кода.

Теперь проверьте, что у вас поставлена галочка [ Расширить шаблон виджета ]
Продолжим...

Найдите в шаблоне следующий код:

<data:post.dateHeader/>


Замените на этот:

<DIV class='dateblock'> <SCRIPT>
date_replace('<data:post.dateHeader/>');</SCRIPT></DIV>


Ну теперь всё! Этот хак на вашем блоге.

Последние комментарии