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

Теги: Blogger, Дата блога, Удобства, Украшения

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

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

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

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

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

7 коммент:

Анна комментирует...: Это сообщение было удалено автором.; 17 августа 2009 г. 19:53
Анна комментирует...: Я всё сделала как надо, только у меня теперь пустой листок календаря виден. Как сделать чтобы в нём дата появилась? Я вроде бы в настройках даты уже всё попробовала изменить.; 17 августа 2009 г. 20:40
Вячеслав комментирует...: Нужно поставить в определённом формате дату: ММ.ДД.ГГГГ .(Проверьте, что вы поставили формат даты, а не времени) Если не сработает, то это проблема связана индивидуально с вашим шаблоном.; 18 августа 2009 г. 13:17
Анна комментирует...: Вячеслав, не получается :( , наверное на самом деле от шаблона зависит. У меня и код, который удалять надо, совсем другой, намного длиннее чем те которые дали вы. Ну не страшно, спасибо Вам во всяком случае! Блог у Вас очень полезный, мне уже много что пригодилось.; 18 августа 2009 г. 21:42
Вячеслав комментирует...: Попробуйте ещё раз. Я немного изменил скрипт...; 19 августа 2009 г. 13:12
Анна комментирует...: Урааа!!! Получилось!!! Спасибо большое. Можешь посмотреть на моём блоге. Единственное что мне не удалось - это поместить число в середину листочка, но это не страшно. :-); 19 августа 2009 г. 16:23
Вячеслав комментирует...: Да нет, я сейчас зашёл на ваш блог и дата была расположена по середине календарика. Может быть это зависит от броузера, или от того, что я вижу ваш блог как посетитель, а вы как администратор.(в таких случаях может съежать панель или другие вещи рядом с которыми есть значки режакции).; 19 августа 2009 г. 17:04