Когда я только рисовал эту тему, я предполагал что дату публикации поста самое лучшее выводить сразу под заголовком. И до вчерашнего дня меня это вполне устраивало. Но как однажды уже было подмечено — эта тема никогда не перестанет меняться. Я постоянно буду что-то «дорабатывать напильником» и менять.
Вот о том как сделать такой бэйдж я и хочу сегодня рассказать
Давайте начнем с добавления, необходимой для отображения даты, разметки. Создадим новый элемента DIV с классом «entryDate» с тремя вложенными элементами SPAN с соответствующим классам «postMoth», «postDay» и «postYear».
Далее следует добавить РНР-код, чтобы получить дату из базы данных, как показано ниже. Более подробно про формат даты в PHP читаем на http://php.net/date.
<div class="entryDate">
<span class="postMonth"><?php the_time('M') ?></span>
<span class="postDay"><?php the_time('d') ?></span>
<span class="postYear"><?php the_time('Y') ?></span>
</div>
Теперь остается только дописать нужные классы в CSS:
/* date badges */
.entryDate {
font-family: Georgia,"Times New Roman", serif;
margin-left: -66px;
line-height: 1;
position: absolute;
width: 40px;
}
.entryDate span {
display: block;
text-align: center;
}
.postMonth {
text-transform: uppercase;
font-size: 17px;
padding-top: 5px;
}
.postDay { font-size: 20px; }
.postYear {
background-color: #2358B8;
color: #FFF;
font-size: 13px;
width: 40px;
padding: 5px 3px;
margin-top: 5px;
}
Вот, собственно, и все. Естественно вам потребуется немного подправить CSS вручную т.к. это писалось специально для моей темы, но во общем и целом трудностей возникнуть не должно. Если что, спрашивайте в комментах.
2leep.com
18 февраля 2010 в 15:06
Полезная информация, хотя меня пока расположение даты устраивало. Вы говорите, сами рисовали тему? Здорово получилось.
18 февраля 2010 в 16:21
Спасибо.
18 февраля 2010 в 21:36
Спасибо интересное решение, просто и доступно, надо будет попробовать.
23 февраля 2010 в 6:44
Темка действительно получилась очень красивой, удобной и вообще радует глаз! А за подробное описание такого способа вывода даты публикации отдельное спасибо, как раз создаю новый проектик и хотел такую дату!
24 февраля 2010 в 0:04
за решение конечно спасибо… но в целом, если б надо было, можно было бы вытащить почти из любой вп темы….
26 февраля 2010 в 11:27
Красивая тема, ничего не скажешь, а за материал спасибо. Видел темы с такими бейджами (не знал, что они так называются =) ) и не мог понять, как их сделать, а тут — всё просто и понятно!
26 февраля 2010 в 11:28
…и ещё можно вопрос? Сколько примерно времени у Вас ушло на создание этой темы?
26 февраля 2010 в 14:52
С рисованием и версткой… где-то дня 4-5. "Доработка напильником" ведется и по сей день. Но разумное время для подобной темы — 5-6 дней.
03 февраля 2011 в 9:18
Так как любую тему WordPress приходится доделывать, то это решение пригодиться каждому.