пятница, 19 декабря 2008 г.

Как на blogspot добавить после каждого поста кнопочку «Подписаться на RSS»?

Давно хотел у себя сделать, да и вам рассказать как, но не доходили руки. Все пользователи blogspot знают, что на главной странице, равно как на любой другой кроме профиля, внизу располагается ссылочка «Подписаться на: Сообщения (Atom)». Мне она, честно говоря, никогда не нравилась потому что, во-первых, большинство блоггеров которые «родились не вчера», используют Feedburner, во-вторых, она настолько «серая», что сам смысл ее существования должен быть под вопросом. К счастью, все поправимо, давайте разберемся как.

На самом деле, наверняка, о том, как это делается, знают большинство пользователей Blogger. Потому что проблема стара, как сам сервис, а решение ее достаточно простое. Но возможно знают не все, а у кого-то может быть «не лучший вариант», поэтому я решил – посту быть.

С незапамятных времен встречал в бурженете все возможные решения, но наиболее симпатичным мне показалось вот это, его я и взял за основу. Делается все элементарно:

1) Удаляем слово «Аtоm». Для этого находим в шаблоне следующий фрагмент кода:
<a class=’feed-link’ expr:href=’data:f.url’ expr:type=’data:f.mimeType’ target=’_blank’><data:f.name/> (<data:f.feedType/>)</a>
И удаляем то что выделено жирным. Вот и все, сохраняем шаблон (не стал лишний раз напоминать что перед каждым новым экспериментом стоит делать backup), идем на сайт и убеждаемся что раздражающая глаз фраза отсутствует.

2) Добавляем иконку rss-подписки.
Далее, если это необходимо, мы можем добавить иконку rss-подписки. Это штука не лишняя, поскольку очень хорошо оживляет надпись, и потенциально может послужить по прямому назначению. Делается это так же легко, находим следующий «кусок»:

.feed-links {
clear: both;
line-height: 2.5em;
}

И добавляем после line-height: 2.5em;

padding-left: 20px;
background: url(http://lh3.ggpht.com/_xn2gmPb9TfM/SNgRRI_qVPI/AAAAAAAACWU/
Qg9HJNnfjgs/s144/feed.gif) left no-repeat;

В результате получаем:
.feed-links {
clear: both;
line-height: 2.5em;
padding-left: 20px;
background: url(http://lh3.ggpht.com/_xn2gmPb9TfM/SNgRRI_qVPI/AAAAAAAACWU/
Qg9HJNnfjgs/s144/feed.gif) left no-repeat;
}
Это все, перед тем как сохранить можно проверить как выглядит шаблон. Конечный результат можете посмотреть у меня на блоге.

Замечания:
1) Поскольку у меня нестандартный шаблон, на этапе добавления картинки, фрагмент указанный ниже отсутствовал:

.feed-links {
clear: both;
line-height: 2.5em;
}

То что вы видите, это не что иное как фрагмент CSS стиля. Если точного соответствия нет, не пугайтесь, .feed-links должно быть в любом случае, он то нам и нужен. Можно заменить весь стиль результирующим кодом (см. выше), или дополнить его выделенным выше жирным код.

2) Как вы понимаете, rss иконку можно поставить любую подходящих размеров, или даже как favicon сделать самому. После этого нужно загрузить ее на ваш хостинг и поменять в коде url.

Вот такой простой рецептик сегодня получился, пользуйтесь на здоровье.

Вы знаете что уже продаются майки для блоггеров, сеошников и манимейкеров? Нет? Тогда майка "как заработать в сети" будет классным подарком на новый год -).

А для тех кто уже подвис игромания дома - playstation 3, тоже не плохой вариант!

Еще читать:
Что можно сварить из XAPы?
Как избежать дублирования контента на Blogger?

Картинка с сайта.


Читайте по теме



11 комментариев:

  1. Спасибо, сработало... Одним мирным "Атомом" стало меньше.

    ОтветитьУдалить
  2. А я вот сейчас подумал - а на хрена вообще, Гуглу атом, тем более такой мирный, когда есть куда более грозный собственный Feedburner?

    ОтветитьУдалить
  3. А можно таким же способом выводить в конце поста какой нибудь баннер? Вроде одно из самых кликабельных мест.

    PS Девушка классная. Где взял? Мне для одного проекта что-то похожее нужно )

    ОтветитьУдалить
  4. Девушку взял в Яндексе -), если для проекта, то и слепить в фотошопе не проблема, только девчонку нормальную найти. А в конце поста можно ставить что угодно, вот у меня уже торчит Feedmates, Related posts и добавлялка в закладки, баннер таким же макаром втыкается -).

    ОтветитьУдалить
  5. А можно ли сделать эту иконку кликабельной? Чтобы без текста обойтись, а просто отправлять юзеров на подписку через иконку... а?

    ОтветитьУдалить
  6. Короче, иконка есть, а как сделать так, чтобы по клику на ней осуществлялся переход на страницу подписки, или, хотя бы, была рядом надпись (как у тебя) "Подписаться на RSS" - не пойму... :((

    ОтветитьУдалить
  7. В этом шаблоне, видишь ли, иконка была изначально (я её поменала на свою, правда). И она изначально никуда не вела. ВотЪ. :(

    ОтветитьУдалить
  8. А если бы ты рассказал ещё, как избавиться от раздражающей формулировки (во многих шаблонах так, почему-то) - так, где дата сообщения: "На пятница", например. Что это за идиотское "на пятница"? Это "на" - его можно вообще ликвидировать? Пусть бы была просто "пятница"... а то будто тебя каждый раз куда-то посылают на...

    ОтветитьУдалить
  9. То Allpa: Я как видишь пошел немного другим путем - взял за базу рецепт добавления кнопок соц. закладок (у меня есть пост "Делаем блоггер социальным"), и добавил к ним RSS. Примерный код:
    <img align='absmiddle' src='http://lh3.ggpht.com/_TqPdHmAEwTM/R5-60Nu3tgI/AAAAAAAAAz0/8v3jHKMURzc/feed.png'/>
    <a href='http://feeds.feedburner.com/maxibiz'>Subscribe to RSS</a>

    Здесь кнопка не кликабельная, но ее можно сделать таковой, окружив тегом ссылки также как Subscribe to.

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

    ОтветитьУдалить
  10. Дмитрий Наумов, с кнопкой я уже разобралась - спасибо.

    А вот "на пятница" меня беспокоит. :) Изменила формат времени - один чёрт, просто вместо "на пятница" стоит "на 1/16/2009". :(

    ОтветитьУдалить
  11. То Allpa: Извиняюсь что пока так и не нашел времени разобраться как это делается, сегодня постараюсь посмотреть.

    ОтветитьУдалить