«

»

Дек 20 2012

Распечатать Запись

Разработка шаблона для Blogger – требования к функционалу

Для всех популярных блог платформ существует множество шаблонов. Blogger (он же Blogspot.com) в этом смысле не исключение, но многие Blogger шаблоны англоязычные, без документации и похожи друг на друга как близнецы. Да и нужного функционала среди бесплатных шаблонов для Blogger найти подчас невозможно.

Поэтому я решил самостоятельно разработать шаблон для Blogger/Blogspot. Он уж точно будет соответствовать всем моим требованиям да и поддерживать его будет проще – сам буду знать где, что и как.

Предыстория про Blogger шаблоны

blogger шаблоныДолгое время я развивал блог на платформе от Google, но все чаще появлялась потребность что-то изменить в шаблоне – то “хлебные крошки” вставить, то меню сделать новое. И это не говоря о мелких изменениях в дизайне, которые крайне сложно делать без человеческого описания исходного кода шаблона, в котором нет комментариев. Конечно, в любом коде можно разобраться, но времени на это тратится слишком много и количество неправильных действий на пути к цели быстро начинает раздражать.

Далее я занялся поиском бесплатных шаблонов для Blogspot, но просмотрев несколько сотен шаблонов я увидел меньше десятка существенно разных вариантов к которым они все сводились. Разница только в картинках и CSS оформлении, а функциональная основа одинаковая. И ни один из них не был достаточно продвинутым, чтобы изначально включать полезные “фичи” типа хлебных крошек, меню на CSS3 или хотя бы на jquery. А ручками их вставлять опять же сложно, так как документации с описанием к шаблонам не прилагается. Единственное, что всегда почти включается – постраничная навигация.

В итоге  решил делать свой шаблон и для начала составил план разработки (который не сильно отличается от стандартного цикла разработки ПО):

  1. Формирование требований.
  2. Описание макета.
  3. Разработка функциональной части шаблона.
  4. Оформление CSS.
  5. Разработка нескольких простых вариантов оформления на основе шаблона.
  6. Перевод комментариев в шаблоне на английский и подготовка описания шаблона на русском и английском.

Общие требования

Общих соображений на тему шаблона было не так много и все они уложились в 5 пунктов:

  1. Понятная, простая и по возможности единообразная схема задания всех областей шаблона, чтобы проще было настраивать стили CSS.
  2. Максимально внедрить микроформаты (в тех же “хлеюных крошках” они уже сейчас внедрены) для улучшения читаемости сайта поисковыми системами.
  3. Автоматически заполнять ключевые слова в разделе head на основе ярлыков (опять же кивок в сторону SEO).
  4. Версии используемых jquery-скриптов поддерживать в актуальном состоянии, а для скриптов с других сайтов иметь в коде несколько возможных источников.
  5. Максимальная настраиваемость шаблона через вкладку “Дизайн” и/или “Шаблон -> Настроить” без необходимости править исходный код. В том числе настройка базовых стилей и возможность включать/отключать фичи шаблона (хлебные крошки, автоматические ключевые слова, слайдер и т.д.).

Макет blogger шаблона – основные составные части

Сначала я хотел отложить этот пост, так как понимал, что в процессе работы над шаблоном макет постоянно будет меняться и дополняться в соответствии новыми идеями и преодолением технических трудностей. Но потом для исторической справедливости решил все же выложить исходный макет:

Макет шаблона для Blogspot/Blogger

Добавлю немного того, что на рисунке не изображено:

  • Топ меню. Эту область возможно использовать и как меню для самых важных ссылок, так и для социальных кнопок. В целом зашит будет только поиск, а остальная часть будет сделана в виде секции под виджеты.
  • Основное будет сделано на CSS3 с возможностью выбора эффекта при выпадании. Эффекты, указанные в скобках, я планировал использовать у себя.
  • В основной части сайта я обозначил социальные кнопки и блок подписки. Они в этом месте очень часто встречается, поэтому я планирую “зашить” их в шаблон с возможностью отключения.
  • Так же стандартная навигация по постам на блогспоте реализована крайне неудачно и потому почти всегда приходится встраивать решение для постраничной навигации. В данном случае она также будет зашита в шаблон.
  • Сайдбар тоже не сказать что обычный, но я такого вида боковую панель встречал довольно часто. При этом очевидно , что этот сайдбар легко модифицируется как в две колонки, так и в одну.
  • В нижней части сайта я обозначил 4 столбца, но планирую сделать масштабируемый вариант от 1 до 4 столбцов.

В целом это все требования, которые были на первоначальном этапе. Сейчас я разрабатываю функциональную часть шаблона и возникает множество технических нюансов, которые порождают новые требования. Но это уже мелкие детали, которые буду описывать по ходу разработки.

Продолжение следует…

 

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *