8.01.2009

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

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

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

будет сделать несколько процедур:



Откройте настройки блога > Макет > Изменить 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>


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

9 коммент:

Anna комментирует...
Этот комментарий был удален автором.
Anna комментирует...

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

Вячеслав комментирует...

Нужно поставить в определённом формате дату:

ММ.ДД.ГГГГ .(Проверьте, что вы поставили формат даты, а не времени)

Если не сработает, то это проблема связана индивидуально с вашим шаблоном.

Anna комментирует...

Вячеслав, не получается :( , наверное на самом деле от шаблона зависит. У меня и код, который удалять надо, совсем другой, намного длиннее чем те которые дали вы. Ну не страшно, спасибо Вам во всяком случае!
Блог у Вас очень полезный, мне уже много что пригодилось.

Вячеслав комментирует...

Попробуйте ещё раз. Я немного изменил скрипт...

Anna комментирует...

Урааа!!! Получилось!!! Спасибо большое. Можешь посмотреть на моём блоге. Единственное что мне не удалось - это поместить число в середину листочка, но это не страшно. :-)

Вячеслав комментирует...

Да нет, я сейчас зашёл на ваш блог и дата была расположена по середине календарика.

Может быть это зависит от броузера, или от того, что я вижу ваш блог как посетитель, а вы как администратор.(в таких случаях может съежать панель или другие вещи рядом с которыми есть значки режакции).

Hakob комментирует...

Спасибо большое за скрипт, но у меня тоже не в середине... можете помочь исправить ? Заранее спасибо :)

Вячеслав комментирует...

Конечно помогу. Киньте xml свого шаблона на адрес эл.почты и представьтесь.

slava_vvk@mail.ru

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