Палим свой первый фид. Настройка feedburner от А до Я

Приветствую, друзья!
В этом посте я расскажу, как я палил свой первый фид. Скажу сразу, на начальном этапе это было сложновато, но разобравшись, все стало на свои места. Я настроил feedburner и наслаждаюсь его работой.

Фид – это, можно сказать обязательная примочка для сайта, и тем более блога. Сейчас в сети трудно найти ресурсы, которые не используют сервис feedburner. Зачем все это делают? Ответ очень прост.

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

Поэтому, из этого всего можно сделать выводы, что подписчики для блога – это клад, золотой актив, который нужно любить, ценить и поощрять!

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

Зажигаем свой первый Feed через стандартную ленту RSS в FeedBurner

Данный сервис принадлежит мировому гиганту Google, и чтобы получить доступ к любому сервису, в том числе и для распалки фида, у вас должен быть зарегистрирован аккаунт в Гугли.

В нагрузку вам дадут еще и почтовый ящик Гмайл, но жаловаться здесь незачем, так как этот ящик считается самым надежным и безопасным.

Для того чтобы  попасть в свой аккаунт, переходите по этой ссылке. Вводите данные, которые вы указывали при создании почтового ящика. Слева в меню выбирайте «продукты» — «feedburner». Для полного представления, смотрите скриншот.

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

Зайдя на страницу, язык может остаться английский, вам нужно будет его переключить вручную, нажав на ссылку «Languages» в верхнем правом углу и выбрать русский.

В строку, под надписью «Зажигай» фид прямо сейчас, нужно ввести адрес своей rss ленты. На моем блоге этот адрес выглядит следующим образом: http://life-crazy.ru/feed

Я ввожу его в поле и жму «next». Меня перебрасывает на страницу, где необходимо ввести название будущего фида и короткий адрес, который будет добавляться к основному.

Основной адрес – это http://feeds.feedburner.com/

Если посмотреть мой готовый адрес, то он будет выглядеть так:  http://feeds.feedburner.com/faqhome

После заполнения полей, жмите «next» и вас перебросит на страницу благодарности, на этой же странице, будет выдана ссылка ленты, которую вы будете использовать на своем ресурсе и везде где она будет требоваться.

А также проинформируют, что подключили услуги: “BrowserFriendly” и “StandartStats”, которые отвечают за статистику, как вы догадались, услуги платные, они нам не подходят, поэтому, улыбнемся и нажимаем кнопку «Пропустить и перейти сразу к управлению фидом».

Но перед тем, как приступить к настройке, вам нужно будет скачать плагин, который будет перенаправлять пользователей со стандартного адреса, вида http://ваш_сайт/feed на фидбернер — http://feeds.feedburner.com/faqhome. Но, плагины грузят наш блог, от этого он грузится медленнее, поэтому я покажу два варианта перенаправления:

1.  При помощи плагина
2.  При помощи кода

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

Установка и настройка плагина «FD Feedburner Plugin».

Скачать самую последнюю версию можно по этой ссылке. Устанавливается стандартным путем.

После установки и активации, заходите в настройки плагина и здесь нужно указать, куда перенаправлять своих читателей. Чтобы добраться до настроек, заходите в административную панель движка WordPress, слева в меню выбирайте раздел «настройки» — «feedburner»

Из всех настроек, я указал только адрес, который был выдан сервисом feedburner, в строке «перенаправить мои фиды сюда». Второе поле не трогал, также нигде не устанавливал птички. Основные настройки на фото.

После внесения изменений жмите «сохранить». Вот и все, плагин установлен, настроен и перенаправляет читателей со стандартного адреса, на фидбурнер. Проверить работоспособность плагина можно, введя в адресную строку http://life-crazy.ru/feed — должен открыться адрес фидбернера.

Давайте теперь рассмотри вариант перенаправления без плагина.

Перенаправление RSS на Feedburner без использования плагинов

Чтобы реализовать перенаправление без плагина, нам необходимо править файл .htaccess, находится он в корневой директории блога. Открывайте его при помощи Notepad++, я пользуюсь именно этим текстовым редактором. И в самое начало нужно вставить данный код:

# redirect to feedburner
<ifmodule mod_rewrite.c>
  RewriteEngine on
  RewriteCond %{HTTP_USER_AGENT} !FeedBurner    [NC]
  RewriteCond %{HTTP_USER_AGENT} !FeedValidator [NC]
  RewriteRule ^feed/?([_0-9a-z-]+)?/?$ http://feeds.feedburner.com/faqhome/ [R=302,NC,L]
</ifmodule>

Не забудьте в этой строке

  RewriteRule ^feed/?([_0-9a-z-]+)?/?$ http://feeds.feedburner.com/faqhome/ [R=302,NC,L]

Поменять адрес моего фида, на свой.

Вот таким легким способом можно перенаправить пользователей на ленту фидбернера без плагинов.

P.S Пишу пост и перехожу на код.

Настройка feedburner – секретные фишки, красивый feed

Давайте теперь я расскажу, как я настроил feedburner для себя. Настройки feedburner имеют 5 основных разделов.

1. Анализируй
2. Оптимизируй
3. Публикуй
4. Зарабатывай
5. Решай проблемы

Так как мы только зажгли свой фид, то соответственно у нас нет подписчиков и анализировать нечего. Поэтому этот раздел пока пропускаем. Сразу можно пропустить 5-й пункт, в нем я тоже не разу не был, и понятия не имею что там :Ъ.

Мы будет работать с двумя основными. И начнем, пожалуй, с раздела «оптимизируй». В нем есть несколько полезных функций, но чтобы они вступили в работу, необходимо активировать и настроить их.

Первый раздел, который подвергается настройки  — это «BrowserFriendly», эта функция включена и работает, нам ее подключили изначально, но вот язык не указали, поэтому в выпадающем меню выберите «ClearFeed Russian».

Сохраняйте!

Далее идем в раздел «SmartFeed» — эта функция позволяет обеспечить совместимость чтения во всех программах и читалках.

Эта функция не требует никаких настроек, ее нужно просто активировать.

Идем дальше, следующий пункт «FeedFlare». Этот пункт расширяет возможности читателей по управлению контентом.

Активировав данную опцию, в фид будет добавлена панелька с указанными кнопками,  я выбрал E-mail This, т.е. отправить эту запись на e-mail; и Share on Facebook, благодаря чему, ваши читатели смогут делиться с друзьями записями в facebook.

Выбрали нужные кнопки и жмем «активировать»

Идем ниже, следующая функция «Feed Image Burner», она выводит логотип в записях фида. Вы же хотите повысить свою узнаваемость? Я да, поэтому вставил в него кусочек своего хэдера :Ъ

В выпадающем окне выбирайте «Specify custom image URL» и сразу же появится еще два поля. В первом нужно указать, где лежит ваш логотип. Его желательно загрузить на свой сервер.

Image title – здесь указывайте всплывающий заголовок, некая подсказка. Чуть ниже указывайте адрес вашей домашней странички и жмите «активировать»

Следующий раздел, который нас встречает – это Title / Description Burner, он позволит заменить стандартные заголовки и описание, на то, которое подставите. Вот что получилось у меня.

Изменили, жмите «активировать». А вот как выглядят все настройки в действии.

На этом, настройка раздела «оптимизация» завершен. Переходите в раздел «публикуй».

Здесь также масса интересных и полезных настроек, но мы затронем только основные.

Получение кода формы подписки + настройки анонсов + оформление формы подписки на свой лад

Слева сразу выбираем «Подписки по электронной почте» и «Subscription Managment». Выберите язык «русский», форма сразу обновится и готова для вставки к себе на сайт.

Но стандартная форма смотрится не очень привлекательно, поэтому я делюсь своей формой подписки, которая установлена у меня на сайте.

Да, она не идеальна, есть и лучше, но меня устраивает, думаю, кому-то тоже пригодится 🙂

Итак, копируем данный код:

<div id="form-rss">
    <h3>Бесплатные знания!</h3>        
    <p><a rel="nofollow" href="//feeds.feedburner.com/faqhome" target="_blank"><img src="https://life-crazy.ru/img/rss-new.png" border="0" alt="рсс"></a></p>        <div><strong>Все самое интересное о:</strong>
<p>- работе в интернете
- создании блогов
- раскрутке и SEo
- личностном росте
- полезных программах
+
</p></div>   
    <form action="//feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('//feedburner.google.com/fb/a/mailverify?uri=faqhome', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">       
    <div><input type="text" value="Ваш E-mail" onfocus="if (this.value=='Ваш E-mail') this.value='';" onblur="if (this.value=='') this.value='Ваш E-mail';" name="email"/></div>        
    <input type="hidden" value="faqhome" name="uri"/><input type="hidden" name="loc" value="ru_RU"/>
    <input type="submit" value="Получить сейчас!"/>
    </form>
    </div>

Данный код нужно подогнать под себя, помещайте его в любой текстовый редактор и начинайте править! Меняйте заголовок, у меня он звучит так «бесплатные знания», ставьте свой!

Дальше обязательно нужно поменять адрес фида, иначе ваши читатели будут подписываться на мои обновления. Ищите такую строчку:

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

Ссылки я уже закрыл тегами noindex и noffolow, поэтому вам не придется искать эту информацию.  Теперь нужно сменить картинку и адрес к этой картинке. Мое изображение имеет такой вид:

И при нажатии на нее пользователя перебрасывает на страницу фида, где он уже решает, подписываться на обновления или нет.  Итак, ищите строчку такого плана:

Она находится сразу после короткой ссылки. Картинку желательно заранее подогнать по размерам, у меня она имеет размеры (128 на 118 пикселей), но у меня сайдбар широкий, поэтому такие размеры отлично вписываются.

Картинку закидывайте к себе на хостинг в отдельную папку, и указывайте путь к ней. Сделали? Отлично, идем дальше. Дальше нужно изменить текст, мой имеет такой вид:

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

Код, который выводит это изображение (базу трастовых сайтов), выглядит следующим образом:

Если вы не хотите ничего раздавать, то просто удалите эту часть кода. На скрине код, который отвечает за вывод картинки.

Если же вы что-то будете раздавать своим пользователям, то загружайте свое изображение и указывайте адрес к нему. А каким образом он будет получать базу, об этом чуть позже.

Дальше необходимо отредактировать адрес для поля ввода.  Ищите код с таким содержимым:

И в конец дописывайте свой короткий адрес. Искать данную часть кода нужно после кода, который выводит картинку «база трастовых сайтов» в моем случае.

Остался один пункт, смотрите на скрин, в этой части нужно сменить мое значение «faqhome» на свой короткий адрес.

В целом должен получиться такой код (обратите внимание, этот код не готов для вставки, здесь отмечены поля, которые нужно изменять):

<div id="form-rss">
    <h3>Бесплатные знания!</h3>        
    <p><a rel="nofollow" href="feeds.feedburner.com/ваш_короткий_адрес_фида" target="_blank"><img src="ваш_сайт.ru/путь_к_картинке" border="0" alt="рсс"/></a></p>    
    <div><strong>Все самое интересное о:</strong>
<p>- работе в интернете
- создании блогов
- раскрутке и SEo
- личностном росте
- полезных программах
+
</p></div>   
    <form action="//feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('//feedburner.google.com/fb/a/mailverify?uri=ваш_короткий_адрес_фида', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">        
    <div><input type="text" value="Ваш E-mail" onfocus="if (this.value=='Ваш E-mail') this.value='';" onblur="if (this.value=='') this.value='Ваш E-mail';" name="email"/></div>        
    <input type="hidden" value="ваш_короткий_адрес_фида" name="uri"/><input type="hidden" name="loc" value="ru_RU"/>       
    <input type="submit" value="Получить сейчас!"/>
    </form>   
    </div>

После того, как код готовый, его можно вставлять в сайдбар: можно прямо в код, открыв файл sidebar.php вашей темы, можно через виджет. Я воспользовался первым вариантом, то есть вставил прямо в код.

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

Осталось придать стили оформления для этой формы подписки. Открывайте файл Style.css вашего шаблона и вставляй туда следующий код:

/* Форма подписки в сайдбаре*/
#form-rss{
    margin:1px 1px 5px; /*Внешние отступы блока с формой*/
    border:1px solid #E6B50B; /*Стиль рамки блока*/
    border-radius: 3px 3px 3px 3px;
    text-align:center;/*Ставим текст по центру*/
    color: #000000;
    font-size: 13px; 
    padding:2px;/*Отступ внутри блока*/
    width:285px;/*Ширина блока*/
    height:650px;/*Высота блока*/
    text-shadow: 3px 3px 3px #CCCCCC;
    box-shadow: 0 0 4px #CCCCCC;
}
.Orange {
    color: #000000;
    font-family: Times New Roman;
    font-size: 20px;
    text-shadow: 3px 3px 3px #CCCCCC;
    font-weight: bold;
    }
.Subscribe[type="submit"]{
    border:1px solid #000; /*Рамка вокруг кнопки*/
    background:#C7CACB;/*Фон кнопки*/
    padding:3px 4px;/*Внутренний отступ кнопки*/
    margin:5px auto 10px;
}
.Subscribe[type="submit"]:hover{
    background:#FE9900;/*Цвет на который изменяется фон кнопки при наведении на нее курсора*/
    color:#fff;/*Цвет текста кнопки при наведении*/ 
}

В коде нужно подогнать размеры, т.к. они сейчас указаны с моего сайта. Если возникнут трудности по оформлению, пишите в комментарии, будем решать.

Итак, код вставлен, и форма подписки уже красуется у вас на сайте.

Ее еще можно украсить, путем вставки кнопок социальных сетей, которые будут вести на ваши профиля или группы в социальных сетях. Вот как это выглядит у меня:

Хотите себе? Тогда качайте сами кнопки, даю вам 5 кнопок (ютуб, фейсбук, контакт, твиттер, гугл плюс), их размер 32 на 32 пикселя, вот ссылка.

После загрузки кнопок, закидывайте их в отдельную папку. Затем копируйте данный код:

<div><a href="//twitter.com/Mihed1991" rel="nofollow" target="_blank><img src="//life-crazy.ru/img/twitter-32.png" alt="твиттер" title="Присоединиться в Твиттере" /></a>
<noindex><a href="//vkontakte.ru/mihed" rel="nofollow" target="_blank><img src="//life-crazy.ru/img/vkontakte-32.png" alt="вк" title="Присоединиться ВКонтакте"/></a></noindex>
<noindex><a href="//www.facebook.com/mikhed1991" rel="nofollow" target="_blank"><img src="//life-crazy.ru/img/facebook-32.png" alt="фейсбук" title="Присоединиться в Facebook"/></a></noindex>
<noindex><a href="https://plus.google.com/102593076772418913349/posts?tab=XX" rel="nofollow" target="_blank"><img src="//life-crazy.ru/img/g-plus-32.png" alt="гугл" title="Присоединиться в Google +1"/></a></noindex>
<noindex><a href="//www.youtube.com/user/mikhed1991" rel="nofollow" target="_blank"><img src="//life-crazy.ru/img/youtube-32.png" alt="ютуб" title="Присоединиться в YouTube"/></a></noindex>
    </div>

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

Адреса поменяны и код готов к вставке, я его разместил сразу после кнопки, вы можете размещать на свое усмотрение. В файле sidebar.php он имеет такой вид.

На этом все, вставка кода завершена, осталось подогнать некоторые настройки feddburner.

Идем в раздел «Communication Preferences», здесь настраивается вид письма подтверждения, которое получить пользователь.

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

Нам нужно заполнить всего 3 поля.

1)    Здесь нужно ввести адрес электронной почты, от кого будут приходить письма, я ввел свой адрес.
2)    Указать тему письма, я поставил такого плана «Подтверждение подписки на Блог Михед Александра. Создание блога с 0 в профи»
3)    Заполните тело письма, обратите внимание на код, он необходим, чтобы предоставить пользователю ссылку на подтверждение подписки, поэтому не удаляйте его.

Мое тело письма имеет следующее содержимое:

Вы в одном шаге от того, чтобы подтвердить вашу подписку на RSS ленту
персонального блога Михед Александра. Щелкните по ссылке ниже.

${confirmlink}

Здравствуйте, дорогой Друг!
Пожалуйста, подтвердите Ваш адрес электронной почты.
Для этого нажмите на ссылку, расположенную выше.
ВНИМАНИЕ!
ТОЛЬКО ПОСЛЕ ПОДТВЕРЖДЕНИЯ АДРЕСА ЭЛЕКТРОННОЙ ПОЧТЫ, Вы сможете
получать полезные и интересные новости прямо на ваш почтовый ящик сразу после публикации автором новой статьи на блоге.
Нажмите на ссылку вверху, и в вашем почтовом ящике появятся желанные письма!
С уважением, ваш друг и помощник,  Михед Александр.

Только после подписки, Вы получаете ссылку на скачивание «ЛУЧШЕЙ БАЗЫ ТРАСТОВЫХ САЙТОВ»:

yadi.sk/d/FoSd4YJb4Dcyt

Ссылка на мой блог: http://life-crazy.ru

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

А этот раздел поможет оформить вид писем, которые пользователи будут получать уже после подписки.
Можете поиграть с дизайном письма, и настроить желаемый вид. Также добавить логотип, но обратите внимание, что он по размерам не должен превышать 200 пикселей по ширине и 200 по высоте.

В поле «тема письма» я рекомендую указать такой тег:

${latestItemTitle}

Он позволит подставлять в письма заголовки ваших постов, которые будут привлекать внимание подписчиков. Вот как настроен данный раздел у меня.

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

Желательно отталкиваться от основной географической массы вашей аудитории, если это Москва, то ставить +3, если другой город, то соответственно подогнать под него.

Задать время, когда они будут получать, свежую информацию с вашего блога, у меня стоит с 3 до 5, после полудня. Сохраняем и идем дальше.

Дальше нужно активировать функцию «PingShot», она позволяет уведомлять популярные службы о новой публикации.

Хотя, в списке отсутствую сервисы, я эту опцию оставил включенную.

Следующая полезная функция – это FeedCount. Она формирует кнопку счетчик, на котором отображается количество ваших читателей. По настройкам все очень просто, подогнали по цвету, скопировали код и вставили в нужное место на сайте.

Рекомендация. Не советую ставить этот счетчик, если у вас меньше 100 подписчиков!

Вот, пожалуйте, и все, настройка feedburner произведена. Для красивого оформления писем анонсов, рекомендую ознакомиться с данным постом «Украшаем свой feed и расширяем его функциональность!».

Это только настройка, дальше вам нужно будет осваивать технику ведение e-mail рассылок, общаться со своими подписчиками, а это тоже нужно делать правильно. Если вы хотите в дальнейшем зарабатывать приличные деньги, то вам нужна будет большая база подписчиков и с одной рассылки вы будете получать по 30-50 тысяч рублей, классно да?

Как вам статья? Можете подписаться на обновления блога и получать такие статьи к себе на e-mail.

C уважением, Михед Александр.