- слайдер показывает только записи с меткой "видео", но это можно легко изменить;
- виджеты метки и популярные посты в футере (подвале) не показываются в мобильной версии (для экранов меньше 600px);
- пейджер на главной показывает 6 последних записей - это число выставляется в шаблоне и должно совпадать с настройками блога, иначе пейджер будет работать некорректно, это связано с некоторым ограничениями Блоггера;

Шаблон для Блоггера "Invert Grid Video"
Комментариев нет: Редактор: ffbs
Как изменить порядок статей в Блоггере

Блоггер не позволяет изменить порядок статей. По умолчанию статьи показываются начиная с самой последней вниз к более ранним, что называется обратным хронологическим порядком. Иногда владельцы блогов хотят это исправить и им приходится прибегать к различным способам обхода ограничений блог-платформы.
- частично изменить порядок только для статей, отображаемых на главной; то есть, если у вас 100 статей, и в настройках блога указано отображать 10 последних на главной, то вот для этих 10 последних и будет изменён порядок;
- полностью изменить порядок для всех статей в блоге; в этом случае главная всегда будет отображать первые N постов по возрастанию даты публикации (N задаётся в настройках блога) и для того, чтобы достичь последней статьи, нужно пролистать блог до конца;
Частичное изменения порядка
<b:if cond='!data:mobile'> <!-- posts --> <div class='blog-posts hfeed'> <b:include data='top' name='status-message'/> <data:defaultAdStart/> <b:loop values='data:posts' var='post'> ...здесь написано, что если это не мобильная версия, то внутри элемента-контейнера div с классами blog-posts и hfeed нужно отобразить все статьи. Далее не так очевидно, но каждая статья тоже будет отображена в своём блоке — div элементе с классом date-outer. Это всё, что нам нужно знать. Далее необходимо добавить несколько CSS правил для классов blog-posts и date-outer. Для стандартных шаблонов делать это лучше в Дизайнере:


Добавить нужно следующие стили:
.blog-posts, .date-posts { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: reverse; -webkit-flex-direction: column-reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; } .date-outer, .post-outer { -webkit-box-flex: 0; -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; }
Отдельно стоит заметить, что шаблон Simple группирует статьи за одну дату внутри единственного контейнера date-outer. Благо, он дополнительно оборачивает их в контейнер с классом date-posts, а каждый пост — ещё в post-outer. А с этим уже можно работать схожим образом, что и отражено в стилях.
После того, как вы примените стили к блогу, порядок статей на главной странице изменится. Также изменится он и при отображении статей по меткам. Проблемы могут быть с мобильным шаблоном. Если порядок при мобильном просмотре (добавьте к адресу блога ?m=1) не изменился, возможно, вам поможет смена мобильного шаблона с "По умолчанию" на "Дополнительно": в настройках выберите Шаблон, затем во второй колонке "На мобильных" кликните на иконку с изображением шестерёнки; в разделе "Выберите мобильный шаблон" укажите "Дополнительно". Сохраните и проверьте результат, должно заработать.
Если у вас нестандартный шаблон и вы не можете найти классы контейнера статей и самих статей, пишите в комментариях с указанием адреса блога, постараюсь помочь.
Полное изменение порядка
Во-первых, задумайтесь, действительно ли нужно вам это делать. Вы пишете роман? Возможно, Блоггер — это не то, что вам требуется. Как ваши читатели будут попадать на последний пост, будет ли им удобно? Как к таким трюкам отнесутся поисковые роботы? Если вы твёрдо уверены, то приступим. Решение есть, даже несколько. Кстати, ни одно из них не будет изящным, быстрым или универсальным.
За исключением первого варианта, описанного ниже, общим подходом к решению поставленной задачи является манипуляция с фидом (лентой) блога. У каждого блога на платформе Блоггер есть лента сообщений, доступная по адресу ВАШ_БЛОГ/feeds/posts/default, которая, в зависимости от настроек, содержит частично или полностью все ваши статьи. Остаётся только выбрать их в нужном порядке и отобразить на главной странице блога, попутно подменив ссылки на следующие/предыдущие посты. По желанию это же можно сделать и для фильтров по меткам. Если вы знаете JS и не прочь погрузиться в документацию Блоггера, то этой информации вам уже должно быть достаточно. Для всех же остальных существуют готовые реализации данного механизма. Мне тоже лень заново изобретать колесо, так что я просто пройдусь по нескольким решениям. А ещё я не буду приводить здесь код, который вам нужно вставлять в шаблон, но дам ссылки на первоисточники. Причина проста: если авторы оригинальных решений найдут ошибки или просто захотят что-то изменить, они сделают это у себя в блогах. Если я буду копировать код сюда, он навсегда останется старым. Приступим.
Весьма изощрённый, но не лишённый изворотливости способ, предложенный неким финским блогером. Суть его заключается в следующем:
- если в адресе страницы присутствует параметр order=ASC, то все посты на этой странице ставятся в обратном порядке при помощи JS;
- затем находятся ссылки "Следующие" и "Предыдущие" и к ним добавляется параметр order=ASC, чтобы при листании по страницам порядок соблюдался;
- Пока что всё это по результату сильно напоминает то, что мы делали для частичного изменения порядка. Так как же сделать его полным? Для этого вместо главной страницы, где показываются только последние статьи, рекомендуется использовать возможности поиска, добавив к адресу блога такой хвост (пример из блога автора):
/search?updated-max=2011-02-14T08%3A08%3A00%2B02%3A00&max-results=7
что позволит получить первые статьи, начиная с указанной даты (ставьте дату первой своей записи) блоками по 7.
Великолепно! И позволяет не мешать тем, кто хочет читать блог с обычным порядком статей, ведь без параметра order=ASC всё будет работать как обычно. Минус только в том, что на главной странице блога статьи так и не будут начинаться с самой первой. Кстати, это можно исправить перенаправлением на нужную страницу с помощью того-же JS. Ну и разумеется, с большой вероятностью всё это не будет работать на нестандартных шаблонах, потому что код опирается всё на те же классы контейнеров (blog-posts и другие). Подгонку под другие шаблоны нужно делать самостоятельно.
Тот же автор, но на этот раз всё серьёзно, с использованием ленты, с отображением развёрнутой версии на отдельной странице. Впрочем, всё это можно проделать и прямо на главной странице.
- скрипт загружает последние 500 записей из фида. 500 - это ограничение блоггера, которое, впрочем, может быть преодолено, но это не совсем просто;
- затем находит нужную часть из 7 (у автора, число можно менять) статей, формирует HTML и вставляет на страницу. Под нужной частью я имею в виду поддержку листания по страницам - она тоже есть;
Недостатки: каждая загрузка страницы с 7 статьями в фоне загружает все(!) записи блога. Ну или 500 последних, если у вас их больше. Накладные расходы огромны. Плюс нет никакой информации о комментариях, и придётся изрядно повозиться, если в блоге больше 500 записей.
Хроноблог — любопытное решение в виде гаджета, превращающего блог в набор статей, отображаемых по одной, начиная с самой первой. Поясню: вы добавляете специальный гаджет, который точно так же читает ленту (помним про накладные расходы) и показывает только один пост на главной странице. С возможностью листать назад и вперёд на одну запись. Гаджет запоминает, где остановился читатель и при открытии блога в следующий раз возвращает читателя к правильной статье. Более того, никакой возни с шаблоном — перейдите по ссылке, задайте желаемые параметры в форме (адрес блога, текст меток, размеры) и нажмите кнопку "Add Chronoblog to your blog" и гаджет будет добавлен в ваш блог автоматически (после вашего согласия, разумеется).
Самый трудозатратный вариант — проставить порядок статей вручную. Это можно сделать, задав дату публикаций при их написании. Первой публикации ставьте любую дату, а всем последующим — всё более и более ранние. Отображение дат в блоге в этом случае стоит отключить, потому что в них не будет никакого смысла.
Важное замечание. Ни один способ, опирающийся на фид, не будет работать для приватных блогов, потому что лента для них не формируется.
На этом всё. Задавайте вопросы в комментариях. Кстати, у кого-нибудь была реальная необходимость менять порядок статей в блоге? Что это были за случаи?
Комментариев нет:
Упрощаем отправку текста из статей в твиттер
В статье: как сделать так, чтобы читатели могли быстро твитнуть выделенный текст или цитату из вашего блога
Существует два подхода к тому, что и как можно сделать в блоге, чтобы посетителям было легче твитить ваши умные мысли:- при выделении текста показать кнопку для отправки умной мысли в твиттер
- оформить умную мысль так, чтобы рядом сразу и всегда была кнопка
Рассмотрим оба варианта подробнее. Кстати, в любом случае вам придётся подключать внешние скрипты и, возможно, стили. Так что если вы не знаете, как это сделать, то самое время ознакомиться. А ещё вам нужно знать, что такое CSS селектор, потому что все решения так или иначе должны быть применены к некоторым элементам страницы, которые будут указаны при помощи этих самых селекторов.
Подход 1: показать кнопку твиттера, если читатель выделил текст
var defaults = { image: 'img/twitter.png', };Из удобств - автоматическое обрезание текста до 140 символов. Активируется путём вызова функции highlightTwitter() у нужного элемента. Например, на этой странице вызов выглядит так:
<script> $('.hl-twitter-1').highlightTwitter(); </script>, где hl-twitter-1 - класс DIV-а контейнера абзаца.
<script> $('СЕЛЕКТОР').selectionSharer(); </script>
<script> $('СЕЛЕКТОР').tweetHighlighted({ node: 'HTML элемента, который будет показан рядом с выделенным текстом', minLength: 6, maxLength: 300, extra: window.document.location + '', via: 'blogopoisk', popupArgs: 'width=600,height=600,toolbar=0,location=0' }); </script>, где node - это то, что будет показано рядом с выделенным текстом, например, тэг <img/> с нужной картинкой;
minLength - минимальная длина выделенного текста, при которой будет показываться предложение твитнуть;
maxLength - максимальная длина. В данном примере при выделении текста длиной более 300 символов кнопка твиттера показана не будет;
extra - текст, которые будет добавлен к любому твиту (в данном случае ссылка на страницу источник);
via - текст будет добавлен в самом конце в виде "при помощи @blogspot";
popupArgs - аргументы всплывающего окна - не трогайте, если не знаете, о чём речь.
Подход 2: показывать кнопку твиттера всегда, но только для заранее указанных фрагментов
<script> $('[data-tweetable]').tweetable({ via: 'blogopoisk', related: 'список аккаунтов через запятую' }); </script>Цитаты должны быть заключены в HTML элементы с атрибутом data-tweetable, например, так:
<span data-tweetable>умная мысль номер один</span>- чтобы читатели могли твитнуть умную мысль 1;
<span data-tweetable="умная мысль номер два">твитни меня</span>- чтобы читатели могли твитнуть умную мысль 2 при нажатии на "твитни меня";
Самая обычная цитата (и немножко CSS).
— Блогопоиск Твитнуть
<script> $('СЕЛЕКТОР').proQuo({ tweetLabel: 'Твитнуть' }); </script>
Цитата с кавычками (когда твитишь) и кнопкой твиттера.
— Блогопоиск Твитнуть
<script> $('СЕЛЕКТОР').proQuo({ tweetLabel: 'Твитнуть', addCurlyQuotes: true, useTwitterButton: true }); </script>
<a href="https://twitter.com/share?text=ТЕКСТ_ТВИТА&via=ТВИТТЕР_АККАУНТ&related=СВЯЗАННЫЕ_АККАУНТЫ&url=ССЫЛКА_НА_СТРАНИЦУ" itemprop="url" rel="nofollow" target="_blank">ТЕКСТ_ЦИТАТЫ</a>Приправить немножко CSS и цитата готова!
Сегодня я научился делать цитаты для твиттера. А ты?![]()
Вариант для девочек:
Сегодня я научилась делать цитаты для твиттера. А ты?![]()
Знаете более удобные варианты автоматизации подготовки цитат для твиттера?
Комментариев нет: Редактор: ffbs
Шаблон для Блоггера "Straight"
Оригинал переведён на русский язык, подчищены мелкие огрехи с отображением ссылок.
Скачать шаблон
Комментариев нет: Редактор: ffbs
Совмещаем собственные рейтинги с отзывами Яндекс.Маркета
Предположим, у вас есть блог, где вы пишете собственные отзывы на различные товары. Будь то гаджеты, садовые инструменты или, скажем, кухонная утварь - ваше мнение важно для читателей и они открывают именно ваш блог, чтобы оценить возможную покупку. Вы стараетесь осветить все стороны продукта, выделить достоинства и честно предупредить о недостатках. Но всегда ли удаётся это сделать достаточно подробно? Сколько разных обзоров одной и той же вещи вы сами читаете, прежде чем решиться на покупку (или отказаться от неё)?
Конечно, наличие разных взглядов на один и тот же товар - вещь очень полезная. Но где их взять? К счастью, как минимум одно такое место уже есть - это Яндекс.Маркет. Тысячи магазинов, огромное количество товаров и миллионы покупателей. Многие из них оставляют свои отзывы, доступ к которым открыт через API Яндекса. Разумеется, ваше мнение - самое важное, но дополнить его десятками, сотнями, а то и тысячами мини обзоров будет не лишним, тем более, что сделать это очень просто, ведь вся работа по интеграции с Маркетом уже проделана Graddit - сервисом, предоставляющим блогам виджет рейтингов. Так что теперь можно совместить собственные рейтинги с рейтингами и отзывами с Яндекс.Маркета. Без лишних слов, предлагаем перейти на одну из страниц блога, уже использующего эти данные совместно:
Жёсткий диск для роутера ASUS RT-AC68U.
Обратите внимание, внизу после статьи с оценками посетителей блога находится секция с отзывами других людей. Отзывов может быть много, так что есть возможность постраничного просмотра, сортировки по дате, оценке или полезности информации. Нужно ли вашим посетителям теперь идти на какой-то другой блог, чтобы прочесть там другие обзоры, когда всё уже есть у вас? Вероятно, это будет пустой тратой времени.
Итак, что вам нужно будет сделать, чтобы заполучить такой же виджет себе в блог:
1. запросить ключ доступа к Яндекс.Маркету;
2. особым образом добавить в посты коды товаров, отзывы о которых нужно загружать;
3. добавить код виджета себе в блог. Тестовый период - 2 недели бесплатно, затем от $3 в месяц. Для пришедших с Блогопоиска скидка: вместо трёх - $1 в месяц в течение полугода;
За подробностями пишите на sales@graddit.com.
Комментариев нет: Редактор: ffbs
Шаблон для Блоггера "Timeline"
Скачать шаблон
Комментариев нет: Редактор: ffbs
Шаблон для Блоггера "AbstractLine"
![]() |
Изображение создано при помощи pictofon.com |
Чтобы добавить блок подписки с лайками фейсбука, твиттера и гугл-плюса, скопируйте код отсюда и вставьте в HTML/JS виджет в дизайнере шаблона.
Скачать шаблон
Комментариев нет: Редактор: ffbs
Шаблон для Блоггера "Xenon"
Скачать шаблон
Комментариев нет: Редактор: ffbs
Шаблон для Блоггера "Date A Live"
Шаблон, заточенный под медийный контент со встроенными виджетами лучших и похожих публикаций, а так же набор кнопок для желающих поделиться понравившейся статьёй в социальных сетях. Оригинальный шаблон переведён на русский язык, до последних стабильных версий были обновлены jQuery и плагин Masonry (для наилучшей динамической расстановки анонсов статей на главной странице), также решены множественные проблемы с неправильным отображением виджетов и других элементов на страницах. В бесплатной версии шаблон имеет 2 колонки и жёстко заданную ширину.
Скачать бесплатную версию

окна браузера. Отлично выглядит как на большом экране, так и на экране мобильных устройств, протестирован в Chrome, FireFox, Safari, IE11, iOS, встроенном браузере Android и мобильном Chrome последних версий.
Гарантия качества! Если шаблон не оправдал ваших ожиданий, деньги будут возвращены без каких-либо вопросов.
Купить за $2.99 - свяжитесь с автором по поводу оплаты.
Комментариев нет: Редактор: ffbs
Шаблон для Блоггера "Diary/Notebook"
Скачать шаблон
Комментариев нет: Редактор: ffbs
Шаблон для Блоггера "SkyBlue"
- перевод на русский;
- для ссылок проставлен атрибут rel="nofollow";
- jQuery, а так же все используемые плагины обновлены до последних стабильных версий (modernizr, jQuery Masonry, loadImage);
- починены проблемы с начальным отображением фотографий на главной;
- устранены проблемы с отображением даты публикации и некоторых других элементов;
1 комментарий: Редактор: ffbs
Шаблон для Блоггера "Helix"
Отличия от оригинального шаблона:
- отзывчивый дизайн;
- правильные пропорции картинок на главной;
- локализация на русский язык;
- убраны лишние виджеты (пустые HTML виджеты, например, "Новости");
- убраны JS плагины spuerfish (меню) maximage (галлереи), backstretch (фоновые изображения);
- внешние ссылки в подвале получили rel="nofollow"; однако, помните, что совсем удалять их нельзя для соблюдения правил лицензии.
2 комментария: Редактор: ffbs