Архив

Archive for the ‘html’ Category

Красивые заголовки статей в Blogger

Заголовки статей в Blogger оформляются с помощью части кода шаблона, ответственной за css, где записаны все стили и свойства для каждого сегмента в блоге.
Обычно в нормальных шаблонах заголовки связаны с конкретным тегом, типа h1 или h2, в свойствах которого указаны шрифт, цвет, размеры, тень и т.п.
Сделано это централизовано, и все заголовки во всех статьях блога одинаковые.
чуток подробнее →

Рубрики:html, хитрости

Что за атрибут trbidi?

Ко мне несколько раз обращались с вопросом, откуда в редакторе сообщений Blogger вдруг возникает следующий элемент:
<div dir="ltr" style="text-align: left;" trbidi="on"></div>

Всё очень просто. Это активированная транслитерация, а именно написание текста слева направо.
Регулируется trbidi в редакторе сообщений Blogger на панели инструментов специальными кнопками ↓
чуток подробнее →

Рубрики:блог, html, шаблон

Как вставить картинку внутрь текста

Эта заметка — ответ на вопрос читателя: как заставить текст обтекать картинку, чтобы получилось так же, как у меня в анонсах.

Пример ↓

Этим оформлением анонсов я пользуюсь постоянно.
чуток подробнее →

Рубрики:html, хитрости

Массовое приминение атрибутов rel и target к ссылкам в Blogger

Создание ссылок при написании статьи в Blogger происходит в редакторе двумя путями:
1) через "создать"
2) через "изменить "html"
Обычно начинающие юзеры пользуются только первым способом и любые манипуляции с html боятся, как огня. "Оперившиеся" и со стажем блоггеры зачастую пользуются обеими функциями редактора, и такие важные атрибуты, как target="blank" (графическое редактирование поста позволяет поставить этот атрибут) и rel="nofollow" прописывают вручную.
чуток подробнее →

Рубрики:html, jquery, ссылки

Заголовки как в LiveStreet? Продолжение

Во вступительной статье я описал возможность сделать заголовки в Blogger как у социалок, наподобие LiveStreet и Хабрахабра, т.е. когда впереди названия поста ставится категория. Так же я привёл конечный код, как он будет выглядеть в браузере потребителя.

Теперь поговорим о том, как это реализовать в своём шаблоне Blogger.
Повторюсь, но результат отношения Яндекса может быть непредсказуем. Т.е. вы можете схватить бонус в индексации (типа зачлось в плюс наличие дополнительного ключевого слова), так и незачёт за "повторяющиеся" элементы. Как бы то не было, а хлебные крошки, если вы ставите "лайвстритные" заголовки, нужно удалить из кода шаблона, чтобы не дублировать элементы навигации.

чуток подробнее →

Рубрики:html, шаблон

Меню рубрик для блога в виде кнопок

Новый улов из сети — это меню для верхней части шаблона блога, хедера (header) или близкому к нему виджету, хотя расположить его можете, где угодно. Идеально подходит для рубрик (категории).
Особая привлекательность этого меню в том, что оно целиком построено на css и очень легко регулируется. Сами кнопки при контакте с курсором меняют цвет.

чуток подробнее →

Рубрики:меню, html

Заголовки как в LiveStreet?

Как было замечено, я в своём шаблоне довольно много пытаюсь заимствовать из хабродвижков типа LiveStreet. Но полной схожести с этой CMS невозможно добиться без чудесных заголовков постов.

чуток подробнее →

Рубрики:html, шаблон

Птичка твиттера

По правильному совету Замкадного удалил предыдущий пост, заменяю его другой интересной штукой — птичкой твиттера с цитатой. Нашёл её на одном сеошном блоге. Видимо, это какой-то плагин вордпресс, транслирующий ленту. Но суть не в самом плагине (в блоггере парсеры твиттера тоже работают), а в птичке.
Причём эту птицу можно использовать не только для рекламы своего твиттера, но и для оформления какой-нибудь цитаты в блоге.

чуток подробнее →

Рубрики:html, twitter

Новостная бегущая строка для блога

Сегодня снова поговорим о плагинах jQuery, в частности, о довольном свежем релизе — jQuery News Ticker.
Это анимированная бегущая строка, и в отличии от многих ей подобных, jQuery News Ticker полностью настраивается, привязан к css и имеет много опций в запасе. С её помощью можно постить текущие и будущие анонсы, рекламу и (сами придумаете).

чуток подробнее →

Рубрики:html, jquery, js

Нумерованный список в обратном порядке при помощи jQuery

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

чуток подробнее →

Рубрики:html, jquery