четверг, 16 февраля 2017 г.

Шаблон XML темы Revolution Church для Blogger-блога. Расширенная версия.

revolution-blogger
  • Advertising Request Addon
Ну вот и свершилось! Пока кое-кто предлагал premium-версию шаблона Blogger Revolution Church исключительно за деньги, другие не сидели «сложа руки» — результат этих усилий получился значительно лучше, чем у кое-кого 😉 , названного выше.
Revolution Church 2.0 Revolution Church 2.0
Разумеется, пришлось кое-что подправлять. В частности, «карусель» оригинала работает на Smooth Gallery 2.0 (mootools 1.11), я переделал на версию 2.1 (mootools 1.2.1). Как это выглядит можно посмотреть на Блогосфере.

Установка

Установка стандартная. Загрузить файл шаблона темы и сохранить изменения. Но, естественно, перед загрузкой необходимо произвести некоторые манипуляции с кодом. А что делать? Сложная тема в Blogger требует работы руками …
Скачать
  Revolution Church for Blogger (rus) (10,6 KiB, 1 267 скачиваний)
Шаблон XML темы для Blogger premium класса Revolution Church

Настройка «карусели»

Для работы «карусели» анонсов, требуется загрузка javascript-библиотеки Smooth Gallery. Разместить её можно на любом файл-хостинге. В случае, если хостинг не поддерживает разветвлённую структуру директорий, воспользуйтесь «плоской» моделью …
Скачать
  Smooth Gallery 2.1 (98,6 KiB, 905 скачиваний)
Библиотека для вывода "карусели" анонсов.

  Smooth Gallery 2.1 ("flat") (74,7 KiB, 813 скачиваний)
Библиотека для вывода "карусели" анонсов. "Плоская" версия, для размещения на хостах не поддерживающих структуры папок (директорий).
Ни в коем случае не ленитесь завести собственный аккаунт для хранения файлов! Не пользуйтесь чужими ресурсами! Типичный пример: Bloganol dot com — ресурс с которого я взял оригинал этой темы. Карусель в их демо-версии работает только с утра (по Нью-Йорку), к обеду всё падает до начала следующих суток. Их библиотеки лежат на Google Pages, а там ограничение по траффику — 300 посещений в сутки. Таким образом, используя чужие ресурсы, Вы можете нагадить и владельцу ресурса и себе лично!
Теперь сама настройка … Найдите в файле шаблона следующий код:

<div id="myGallery"> <div class="imageElement"> <h3>Featured Article #1</h3> This is an example of a WordPress post, you could edit this to put information about yourself or your site so readers know where you are coming from. You can ...
<a class="open" title="Read More" href="http://www.revolutiontwo.com/demo/church/featured/featured-article-1.htm"></a> <img class="full" src="http://blogovod.fileave.com/images/b-cumulus.jpg" alt="" /> <img class="thumbnail" src="http://blogovod.fileave.com/images/b-cumulus-thumbnail.jpg" alt="" /> </div> <div class="imageElement"> <h3>Featured Article #2</h3> This is an example of a WordPress post, you could edit this to put information about yourself or your site so readers know where you are coming from. You can ...
<a class="open" title="Read More" href="http://www.revolutiontwo.com/demo/church/featured/featured-article-2.htm"></a> <img class="full" src="http://blogovod.fileave.com/images/streamline.jpg" alt="" /> <img class="thumbnail" src="http://blogovod.fileave.com/images/streamline-thumb.jpg" alt="" /> </div> <div class="imageElement"> <h3>Featured Article #3</h3> This is an example of a WordPress post, you could edit this to put information about yourself or your site so readers know where you are coming from. You can ...
<a class="open" title="Read More" href="http://www.revolutiontwo.com/demo/church/featured/featured-article-3.htm"></a> <img class="full" src="http://blogovod.fileave.com/images/wp-st.jpg" alt="" /> <img class="thumbnail" src="http://blogovod.fileave.com/images/wp-sb-th.png" alt="" /> </div></div>
Как видим, данный фрагмент кода состоит из трёх элементов imageElement. Элементов может быть больше или меньше, но не менее двух. Каждый элемент, в свою очередь, состоит из пяти элементов (тегов):
  • h3 — заголовок всплывающего анонса
  • p — текст всплывающего анонса
  • a (класс open) — ссылка на анонсируемую статью
  • img (класс full) — большое (главное) изображение анонса. Размер 588х400 пиксел.
  • img (класс thumbnail) — эскиз (миниатюра, уменьшенное изображение) главного изображения анонса. Выводится в выпадающей панели «Анонсы». Размер 100х75 пиксел.

Настройка секций анонсов

Каждая из трёх секций состоит из трёх гаджетов HTML/Javascript. Введите ссылку на изображение и текст анонса. Чтобы между изображением и текстом был зазор, вводите ссылку на изображение следующим образом:
<img style="float: left; margin: 0px 10px 0px 0px;" src="http://blogovod.fileave.com/images/b-cumulus.png" alt="" align="left" />
 Размер изображений для верхних секций 70х70 пиксел. Длина текста не должна превышать 80 символов. Для нижней секции размер изображений — 110х110 пиксел, длина текста — 350 символов.
Для каждой секции выставьте в коде

<a href="#" rel="bookmark">Другие статьи из этой рубрики</a>
 ссылку для перехода к странице отображающей все статьи этой рубрики. Обычно она выглядит так:


http://minimus-theme-tests.blogspot.com/search/label/sample

Правильный русский язык

Для правильного употребления множественного числа с числительными (количество комментариев) я разработал небольшую javascript-библиотеку.
Скачать
  minimus Right Slavic Numerals 1.0 (885 bytes, 760 скачиваний)
Библиотека для правильного отображения множественного числа при употреблении с числительными в славянских языках.
Тема уже настроена на использование этой библиотеки. Скачайте и разместите на том же хосте, где разместили Smooth Gallery. Об использовании этой библиотеки в других темах и с другими славянскими языками я расскажу в ближайшее время …

Настройка выпадающих меню

Настройка выпадающих меню этой темы полностью идентична настройке для стандартной тымы Revolution Church.
И последнее … Не забудьте заменить в следующем фрагменте кода YOUR-FILE-HOST-NAME на реальный хост файлов
© 2009 — 2014, minimus. Все права защищены. При копировании и републикации статьи, ссылка на первоисточник обязательна.



Комментариев нет: