tag:blogger.com,1999:blog-91154088856227643002024-03-06T12:05:20.547-08:00Fruitful BookmarksПолезные виджеты и букмарклетыffbshttp://www.blogger.com/profile/17456754845646147816noreply@blogger.comBlogger30125tag:blogger.com,1999:blog-9115408885622764300.post-91663059528534340662013-11-21T17:28:00.002-08:002013-12-03T05:22:43.115-08:00Пульс Graddit: следите за рейтингами с телефона<div class="separator" style="clear: both; text-align: center;">
<a href="http://static.graddit.com/img/site/samsung_airgram_top.png" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img alt="Пульс Graddit позволяет следить за рейтингами с телефона" border="0" src="http://static.graddit.com/img/site/samsung_airgram_top.png" title="" width="150" /></a></div>
Очень полезное обновление от Graddit, позволяющее получать информацию о голосах в вашем блоге прямо на телефон.<br />
<br />
Всё, что нужно сделать — это установить приложение и подписаться на обновления. Следуйте шагам, <a href="http://www.graddit.com/rus/pulse">описанным в инструкции</a>.<br />
<br />
Работает для Андройда и Айфона.<br />
<br />
<br />ffbshttp://www.blogger.com/profile/17456754845646147816noreply@blogger.com0tag:blogger.com,1999:blog-9115408885622764300.post-7760682905950721542013-09-20T12:02:00.001-07:002018-10-24T05:41:49.925-07:00Инструменты SEO для Блоггера<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigBNiA5bVcwJYyVaI8WbfCJCwiKlfZ9HOtGqB7n3xFKsYA2pva9k9mnbFgN0vd3yt4eWzQR8r4AAOApF_0OdYQNwyWCsy3gc-ATo1VqsE5P2J_EvllYjL0h_xRqIwJRB2K8DnPVAmeYOWb/s1600/blogger_seo.png" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEigBNiA5bVcwJYyVaI8WbfCJCwiKlfZ9HOtGqB7n3xFKsYA2pva9k9mnbFgN0vd3yt4eWzQR8r4AAOApF_0OdYQNwyWCsy3gc-ATo1VqsE5P2J_EvllYjL0h_xRqIwJRB2K8DnPVAmeYOWb/s1600/blogger_seo.png" alt="blogger seo" style="width: 120px;" /></a></div>
<div>Представляем вашему вниманию простой <b>онлайн SEO инструмент для блогов</b>. Пример работы можно посмотреть прямо здесь, нажав на <a href="#seo" style="text-decoration: none; border-bottom: 1px dashed;">эту ссылку</a>. После нажатия адрес страницы дополнится строкой #seo и вверху появится панель инструментов. Что есть на данный момент:<br/><br/>
- Анализ ключевых слов.<br/>
- Анализ ссылок.<br/><br/>
</div>
<p>
<h2>Анализ ключевых слов</h2>
Это панель для проверки наличия ключевых слов в тексте поста. Для данной заметки хорошо подойдёт слово SEO, введите его и посмотрите, что выдаст статистика. Как видите, есть кое-что интересное:
<ul>
<li>Плотность ключевых слов в тексте. По слухам, плотность должна быть в пределах одного - трёх процентов, но, как и с другими характеристиками SEO, не стоит слепо следовать непонятно кем не понятно когда установленным правилам. Прежде всего текст должен быть написан понятным языком, понятным человеку, а не поисковым роботам.
<li>Проверка наличия ключевых фраз в заголовке страницы (в тэге <title>...</title>).</li>
<li>Наличие ключевой фразы в заголовочных тэгах H1-H3.</li>
<li>Проверяет, выделена ли ключевая фраза жирным текстом.</li>
<li>Пишет, есть ли ключевая фраза в alt хотя бы одного изображения.</li>
<li>Смотрит, есть ли ключевая фраза в первом и последнем предложениях. Совершенно необязательных штрих, но иногда помогает поисковикам более точно сформировать сниппет в выдаче.</li>
<li>Считает общее количество слов.</li>
</ul>
Важно отметить, что не так просто определить границы текста, так что в эти расчёты легко могут попасть элементы меню, подвала, архива, комментарии и много чего ещё, что хотелось бы исключить. Это можно сделать, дополнив ключевую фразу в поле ввода идентификатором элемента HTML, которым нужно ограничить поиск, в таком виде: "Ключивая фраза | id_элемента". Для блогов на платформе Блоггер id элемента часто можно брать main, а для ещё более точного анализа нужно посмотреть исходный код страницы. Например, для этой страницы самые точные данные можно получить, указав в поле "SEO | post-body-776068290595072154". Попробуйте ввести ключевую фразу без id и с ним и посмотрите на разницу.
</p>
<p>
<h2>Анализ ссылок</h2>
А эта панель покажет вам информацию о ссылках на странице, а менно:
<ul>
<li>Сколько всего ссылок на странице.</li>
<li>Сколько из них внешних, ведущих не на страницы вашего домена.</li>
<li>Сколько внешних ссылок не закрыто в nofollow.</li>
</ul>
Не торопитесь пугаться огромных цифр, помните, как и в предыдущем пункте, учитываются все ссылки: меню, комментарии, виджеты, даже те ссылки, которые сгенерированы скриптами (т.е. невидимые для поисковиков). Для более точного анализа укажите id контейнера, в котором нужно искать.<br/>
А теперь обратите внимание, что рядом с каждой цифрой есть ссылка "показать". Нажмите её, и скрипт выдаст вам список ссылок. Нажмите на любую ссылку, и, по возможности, она будет выделена фоном и рамкой, а страница будет прокручена вверх или вниз до этой ссылки. Так очень удобно искать и анализировать подозрительные ссылки в вашем блоге.
</p>
<p><h2>Как установить этот инструмент себе в блог</h2>
Довольно просто. Откройте админку Блоггера, откройте панель Дизайн, добавьте гаджет HTML/JS. Внутри гаджета введите следующий код:
<pre>
<script type="text/javascript">gradditSEOToolsLanguage = "rus";</script>
<script type="text/javascript" src="https://static.graddit.com/js/seotools/blogger/all.js"/></script>
</pre>
Первая строка задаёт русский язык интерфеса, второая подключает сам скрипт. Теперь чтобы активировать панель на любой странице блога к в браузере к адресу страницы добавьте #seo. Совсем ленивые могут добавить вот такую строку в код гаджета:
<pre>
<a href="#seo" style="text-decoration: none; border-bottom: 1px dashed;">SEO</a>
</pre>
Она выведет в блоге короткую ссылку seo, при нажатии на котрую #seo само добавится к адресу страницы.
</p>
На этом пока всё. Со временем скрипт будет расширяться новыми функциями, а вы в комментариях пишите, что ещё нужно добавить.ffbshttp://www.blogger.com/profile/17456754845646147816noreply@blogger.com0tag:blogger.com,1999:blog-9115408885622764300.post-84227338385466588872013-08-16T17:32:00.000-07:002013-08-17T09:30:02.839-07:00Сторож Graddit: как ограничить доступ к контенту в блоге<div dir="ltr" style="text-align: left;" trbidi="on">
<div class="separator" style="clear: both; text-align: center; clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisgfY3az43otxNEx8AHW2NByr9Ncubrmbe5kFG30BfE55gVjcvTRkMXauTvSgiQLCukU5nLL2dsF1xAmPWsz9x2AUJj8cY6oFPIeVLVBwikWz1Wb1HnnBxp3oigtoPGuz_8RBf1hfRdcvR/s320/lock.png" /></div>
<p>
Как защитить определённый контент в блоге от доступа посторонних лиц, не закрывая при этом весь блог? Тривиальная задача, если ваш блог на Wordpress или, скажем, Drupal. Владельцы же блогов на платформе Blogger лишены такой возможности. Новый виджет от Graddit создан для решения именно этой проблемы. Посмотрите ниже:<br/>
<iframe src="http://www.graddit.com/guard/rus/8smd467" style="width: 100%; border: 0;"></iframe>
Если у вас нет пароля, то скрытый текст вы не увидите. А теперь введите "123" и нажмите кнопку "Открыть". Скрытый текст будет показан, при этом в следующий раз пароль для данного текста вам вводить уже будет не нужно.
</p>
<p>
А текст ниже откроется после того, как вы твитнете эту страницу:<br/><br/>
<a href='https://twitter.com/share' class='twitter-share-button' data-via='' data-lang='ru' data-count='none'>Твитнуть</a>, чтобы открыть текст.<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script><iframe id='graddit_guard_gpfmxnoh' src='http://www.graddit.com/guard/rus/gpfmxnoh' style='width: 100%; border: 0;'></iframe><script>$.getScript('http://platform.twitter.com/widgets.js', function(){function handleTweetEvent(event){if (event) {$('#graddit_guard_gpfmxnoh').attr('src', $('#graddit_guard_gpfmxnoh').attr('src') + '?action=tweeted');}}twttr.events.bind('tweet', handleTweetEvent);});</script>
</p>
<p>
Как заполучить такое же у себя в блоге:<br/>
<ol>
<li><a href="http://www.graddit.com/rus/guard-widget">Зайти на страницу виджета.</a></li>
<li>Указать пароль и написать текст. Пока экспериментируете с текстом, нажимайте "Сохранить". После нажатия "Сохранить и заморозить" ни текст ни пароль уже нельзя будет изменить.</li>
<li>Вставьте предложенный код на страницу в своём блоге. Вы будете видеть текст в любом случае, так как виджет запомнил вас как создателя этого текста. Все остальные будут видеть предложение ввести пароль. Чтобы убедиться в этом, откройте страницу в приватном окне браузера, либо в другом браузере, либо очистите куки.</li>
</ol>
</p>
<p>Вот и всё. Вопросы и предложения оставляйте в комментариях.</p>
<br /></div>ffbshttp://www.blogger.com/profile/17456754845646147816noreply@blogger.com4tag:blogger.com,1999:blog-9115408885622764300.post-39091074154225831962013-05-01T15:01:00.000-07:002013-05-16T07:07:47.333-07:00Расширенный сниппет Google и рейтинги Graddit<center><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGK-6xHR3He_D9_4DNR7GpXzIFq-fxyhRMKAXDfma-Ays52Yma6Hmw-DI7T55njg76yuJEy4hvQ9iCbGE-2rdhYXdnXkljIsfsvOIX1sS6rul1ocdExi3hT87wP_cHwbM7Id89FrTUwvOF/s1600/google_ratings_snippet.png" imageanchor="1"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGK-6xHR3He_D9_4DNR7GpXzIFq-fxyhRMKAXDfma-Ays52Yma6Hmw-DI7T55njg76yuJEy4hvQ9iCbGE-2rdhYXdnXkljIsfsvOIX1sS6rul1ocdExi3hT87wP_cHwbM7Id89FrTUwvOF/s1600/google_ratings_snippet.png" /></a></center><p>— так могут выглядеть страницы вашего блога в поисковой выдаче Google, рейтинг в выдаче соответствует реальному рейтингу Graddit. Добиться этого можно при помощи экспериментальной возможности Graddit по созданию и обновлению сниппета прямо в теле поста (<b>только для Blogger</b>). Чтобы обновить пост и добавить в него сниппет, нужно:</p><p><ol><li>Пригласить пользователя "graddit@gmail.com" в авторы блога (Blogger Settings → Basic → Permissions → Blog Authors → + Add authors);</li><li>Дождаться подтверждения (оставьте здесь комментарий, чтобы ускорить процесс);</li><li>Сделать graddit@gmail.com администратором блога. Это необходимо, чтобы Graddit мог обновлять посты по вашему запросу. Позднее этот шаг будет необязательным, но пока это работает именно так. Если считаете необходимым, после обновления сниппетов вы можете отменить администраторские привилегии пользователя graddit@gmail.com;</li><li><a href="http://www.graddit.com/rus/prices">Оформите подписку</a>. Также вы можете оставить комментарий к этому посту, в котором указать адрес вашего блога, и я предоставлю вам 2 недели испытательного периода бесплатно;</li><li>Войдите в <a href="https://manage.graddit.com/account/eng">админку</a>, создайте учётную запись, если вы этого ещё не сделали (нажмите на "Сгенерировать ключ" для получения инструкций);</li><li>Перейдите на вкладку Статистика, найдите пост, в который вы хотите добавить сниппет (хорошая идея - сохранить пост в админке Blogger перед обновлением) и нажмите на значок звезды: <div><center><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgthskd6HAW22W9dFjK5WUWQkAmdRm47d8BvX_JwdeEPekY6ehyZbFQcXD0n_9edWrWVUKjwIxfwjnBSlI2NJX6UOvSsNn8IO-b03_eenhYv9Px7bzlkijxzgfaZpFcYvX154RW1CAfapA0/s1600/google_snippet_update.png" imageanchor="1" ><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgthskd6HAW22W9dFjK5WUWQkAmdRm47d8BvX_JwdeEPekY6ehyZbFQcXD0n_9edWrWVUKjwIxfwjnBSlI2NJX6UOvSsNn8IO-b03_eenhYv9Px7bzlkijxzgfaZpFcYvX154RW1CAfapA0/s320/google_snippet_update.png" /></a></center></div><br />Graddit попытается получить Blog ID и Rating ID и, в случае успеха, покажет окно подтверждения: <div><center><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimgTBce0mOrrG5Y8bpW2RW8D5K1P0Gi8BhaU8Swwfn91setALfK77rOM7omg0Nwdvw9iDsBvg945q8I_iX2NhXgSy9sEtxQIYkIxkXkHJ33WGShMDW95oMciUkSq2dDe6R1bJRAoTcOUly/s1600/google_snippet_confirm.png" imageanchor="1" ><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimgTBce0mOrrG5Y8bpW2RW8D5K1P0Gi8BhaU8Swwfn91setALfK77rOM7omg0Nwdvw9iDsBvg945q8I_iX2NhXgSy9sEtxQIYkIxkXkHJ33WGShMDW95oMciUkSq2dDe6R1bJRAoTcOUly/s320/google_snippet_confirm.png" /></a></center></div>Нажмите Ok. Если сниппет обновился успешно, система покажет соответствующее сообщение. Может пройти несколько дней, прежде чем сниппет покажется на странице результатов поиска Google. А пока вы ждёте, будущий результат можно посмотреть через <a href="http://www.google.com/webmasters/tools/richsnippets">специальный инструмент Google.</a></li></ol></p><p><b>Предупреждения, рекомендации и известные проблемы</b><br/>Graddit получит доступ к блогу и по вашему запросу будет обновлять посты, добавляя сниппет рейтинга в самый конец текста. Есть вероятность, что изначальный текст может быть утерян или испорчен, например, из поста будут удалены все символы перевода строк (не путайте с тегом <br/> тэг останется, а \n будут удалены), потому что так работает API Блоггера — отдаёт посты без переводов строк. Таким образом, <i>этот метод вам не подходит, если нужно, например, сохранить переводы строк в тексте в теге <pre> или у вас в пост добавлен JS код, в котором наличие переводов строк критично</i>. В других случаях их удаление не влияет на внешний вид поста. В любом случае, настоятельно рекомендую вам сначала попробовать на тестовом блоге или с тестовой записью. Кроме этого, не стоит добавлять сниппет в каждый пост, Гуглу это может не понравиться. Вместо этого обновляйте только те посты, которые действительно стоят того, чтобы рядом с ними на странице поиска отображались звёздочки. Гугл не гарантирует появление звёзд, даже если сниппет оформлен верно, так написано у них в документации. </p>На этом всё, пробуйте, сообщайте о результатах.<!--gradditautomicro--><div><span class="hreview-aggregate"><span class="item"><span class="fn">Расширенный сниппет Google и рейтинги Graddit</span></span>, <span class="rating"><span class="average">3.00</span> out of <span class="best">5</span> based on <span class="votes">2</span> ratings <span class="summary"></span></span></span></div><!--//gradditautomicro--><!--gradditautorelated--><div style="max-width: 440px; font-size: 14px; text-align: left; padding-top: 10px;" id=""><fieldset id=""><legend id="">Интересно почитать</legend><ul id=""><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2013/03/delayed-ratings-widget-load.html" id=""><span style="" id="">Отложенная загрузка или как подключить виджет рейтингов...</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2012/10/ratings-widget-for-tumblr.html" id=""><span style="" id="">Виджет рейтингов для tumblr</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2011/11/fruitful-bookmarks.html" id=""><span style="" id="">Рейтинг-виджет от graddit</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2013/01/graddit-aggregator-related-posts-from-multiple-blogs.html" id=""><span style="" id="">Агрегатор graddit: похожие посты с нескольких блогов</span></a></li></ul></fieldset></div><!--//gradditautorelated-->ffbshttp://www.blogger.com/profile/17456754845646147816noreply@blogger.com11tag:blogger.com,1999:blog-9115408885622764300.post-54359528525257650452013-03-30T16:21:00.000-07:002013-03-30T16:21:22.092-07:00Платные подписки в Graddit<p>Graddit запускает платные подписки для виджета рейтингов: <a href="http://www.graddit.com/rus/prices">http://www.graddit.com/rus/prices</a>.</p>
<b>Какие есть варианты и в чём разница</b>
<p>
<ul>
<li>Бесплатно. Полностью рабочий виджет рейтингов, в окне расшифровки могут отображаться рекламные баннеры. Оно расшифровки выглядит так:<br/><img src="http://static.graddit.com/img/blog/rus/ratings_widget.png"/>;
</li>
<li>Начальный. 5 000 показов виджета в день без рекламы, затем реклама будет включена; 3 доллара в месяц;</li>
<li>Профессиональный. 50 000 показов виджета в день без рекламы, затем реклама будет включена; 10 долларов в месяц;</li>
<li>Максимальный. 500 000 показов виджета в день без рекламы, затем реклама будет включена; 25 долларов в месяц;</li>
</ul>
</p>
<p>Со временем будут появляться новые возможности, доступные только для подписчиков.</p>
<p>
Пока автоматическая подписка доступна только через paypal. Если вы хотите использовать другой способ оплаты или подключить подписку на другой срок и на условиях, отличающихся от указанных выше, пожалуйста, пришлите ваше предложение на <a href="mailto:sales@graddit.com">sales@graddit.com</a>.
</p>ffbshttp://www.blogger.com/profile/17456754845646147816noreply@blogger.com0tag:blogger.com,1999:blog-9115408885622764300.post-18378596419288712372013-03-30T05:43:00.001-07:002013-07-03T13:27:27.632-07:00Виджет "мне нравится" в виде сердечка<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWPWUKCfy9mh0VHuK0VPXVnoXfQTh_GQBQM0TCjdWGghoTX6TXFBPUemq6DWfyTlLOabC9z_fgULVhGvG1xDB9rQ9X3kCHIPIrc0QN2a6jB_A02uYYdBgrCXTzAOhPS72fgHGbj7Bic1qf/s1600/star-heart.png" imageanchor="1" ><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWPWUKCfy9mh0VHuK0VPXVnoXfQTh_GQBQM0TCjdWGghoTX6TXFBPUemq6DWfyTlLOabC9z_fgULVhGvG1xDB9rQ9X3kCHIPIrc0QN2a6jB_A02uYYdBgrCXTzAOhPS72fgHGbj7Bic1qf/s320/star-heart.png" align="top" style="float: left; margin-right: 10px;"/></a> Как установить в блог виджет "мне нравится" в виде сердечка? Легко. Откройте <a href="http://www.graddit.com/rus/ratings-widget">виджеты Graddit</a>, выберите виджет "Мне нравится" слева, затем укажите платформу справа. "Общий код" подойдёт для разовой вставки в пост, например так: мне нравится <div id='rate_59mfxog764' class='ffbs_rate' style='display: inline-block;'><!--{[['<span style="color: rgb(108, 181, 216);">❤</span>']]}--></div><div id='stats_59mfxog764' class='ffbs_stats'></div><div id='src_59mfxog764'><dummy src='http://www.graddit.com/rate/rus/1/59mfxog764?id=rate_59mfxog764&stats=stats_59mfxog764&info=info&info_delay=1&votes=yes'></dummy></div><script type='text/javascript'>$(document).ready(function(){var post_id='59mfxog764';var src=document.getElementById('src_'+post_id).innerHTML;var re=/src=['"](.+)['"]/;var match=re.exec(src);if(match!=null){src=match[1];$.getScript(src);}});</script> или так: <div id='rate_59mfxog764_2' class='ffbs_rate' style='display: inline-block;'><!--{[['<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjogdOnmYtmtkZ4fJUGbFFVkgbhf1cm73cYzGDewIxarKczHZvQdDr7r_s-a0kUw0tn0HauwqKTrTxXDR9JXV7l86FuT3JYjrMyIKij_kkmxLYz3rbDMbUc_Glz13HVrNTJtyPol8NuFndr/s320/like.png" style="width: 30px;"/>']]}--></div><div id='stats_59mfxog764_2' class='ffbs_stats'></div><div id='src_59mfxog764_2'><dummy src='http://www.graddit.com/rate/rus/1/59mfxog764?id=rate_59mfxog764_2&stats=stats_59mfxog764_2&info=info&info_delay=1&votes=yes'></dummy></div><script type='text/javascript'>$(document).ready(function(){var post_id='59mfxog764_2';var src=document.getElementById('src_'+post_id).innerHTML;var re=/src=['"](.+)['"]/;var match=re.exec(src);if(match!=null){src=match[1];$.getScript(src);}});</script> Можно использовать любые изображения и символы.<br/> Если вы хотите, чтобы виджет показывался под каждым постом автоматически, выберите платформу Blogger и следуйте <a href="http://fruitfulbookmarks-ru.blogspot.com/2011/11/fruitful-bookmarks.html">инструкции</a>. Инструкция для Tumblr <a href="http://fruitfulbookmarks-ru.blogspot.com/2012/10/ratings-widget-for-tumblr.html">здесь</a>.ffbshttp://www.blogger.com/profile/17456754845646147816noreply@blogger.com0tag:blogger.com,1999:blog-9115408885622764300.post-20923011567698740422013-03-01T18:06:00.000-08:002013-05-16T07:09:05.589-07:00Отложенная загрузка или как подключить виджет рейтингов без замедления загрузки страниц<div dir="ltr" style="text-align: left; vertical-align: top;" trbidi="on"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMnoWb6zpWwbdpFe0DOBMWVAcn7QDwg74XXl5GeSV7o4zCPJlY71hywh9dnzPuN6woOZEjulEjbBSo4hXgZvi4cj9Oli-ttql2GAqE0nnF4lALTNrsNPNVINTZBGb-nvhWJKS8hVH2mSpq/s1600/fast_star.png" imageanchor="1" ><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMnoWb6zpWwbdpFe0DOBMWVAcn7QDwg74XXl5GeSV7o4zCPJlY71hywh9dnzPuN6woOZEjulEjbBSo4hXgZvi4cj9Oli-ttql2GAqE0nnF4lALTNrsNPNVINTZBGb-nvhWJKS8hVH2mSpq/s320/fast_star.png" align="left" style="margin-right: 10px;"/></a> Загрузка виджета рейтингов может занимать несколько секунд, это зависит от качества связи и от загруженности сервера, обрабатывающего запрос. В течение этого времени загрузка остальной части страницы блокируется, визуально для пользователя всё выглядит так, словно сайт "тормозит". Впрочем, это так и есть. И пока борьба за производительность серверов Graddit в разгаре, вы можете помочь своему блогу и сделать так, чтобы подключение виджета рейтингов не блокировало всю страницу целиком. Для этого вам нужно будет взять новый код со страницы <a href="http://www.graddit.com/ratings-widget">http://www.graddit.com/ratings-widget</a>, предварительно отметив галочку "без блокировки". Как будет указано в подсказке, этот метод зависит от наличия библиотеки jQuery, так что не забудьте подключить её в секции <head> шаблона (если она ещё у вас не подключена). <br /></div><!--gradditautorelated--><div style="max-width: 440px; font-size: 14px; text-align: left; padding-top: 10px;" id=""><fieldset id=""><legend id="">Интересно почитать</legend><ul id=""><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2013/01/graddit-templates-mlnpics.html" id=""><span style="" id="">Шаблон со встроенными виджетами graddit: mlnpics</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2013/03/widget-mne-nravitsya.html" id=""><span style="" id="">Виджет "мне нравится" в виде сердечка</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2013/05/rating-snippet-on-google-search-page-and-graddit-ratings.html" id=""><span style="" id="">Расширенный сниппет google и рейтинги graddit</span></a></li></ul></fieldset></div><!--//gradditautorelated-->ffbshttp://www.blogger.com/profile/17456754845646147816noreply@blogger.com1tag:blogger.com,1999:blog-9115408885622764300.post-32108878797103592732013-01-27T08:57:00.000-08:002013-08-26T13:53:44.166-07:00Агрегатор Graddit: похожие посты с нескольких блогов<div dir="ltr" style="text-align: left;" trbidi="on">
Graddit представляет <a href="http://www.graddit.com/aggregator/rus">виджет "Агрегатор"</a>. Он позволяет отображать ссылки на похожие посты (с картинками или без), собранные с нескольких сайтов. Демонстрация доступна <a href="http://fruitfulbookmarks-ru.blogspot.com/p/aggregator.html">здесь</a> - показывается 20 постов по темам "graddit,blogger,виджеты,сервисы" с трёх блогов. Агрегатор будет полезен тем, кто хочет перелинковать несколько собственных блогов схожей тематики. А ещё его можно использовать в коммерческих целях для показа ссылок на спонсорские блоги.<br/><br/>
Как настроить и установить виджет:
<ul>
<li>откройте страницу <a hreh="www.graddit.com/aggregator/rus">настройки агрегатора</a>;</li>
<li>прочтите правила использования. Есть платная и бесплатная версии. Если коротко, то в бесплатном варианте вы сможете использовать не более двух источников и показывать виджет не более 500 раз в день. Первые 1000 показов работают как в платной версии, чтобы вы могли поэкспериментировать;</li>
<li>вверху нажмите ссылку <i>Получить код</i>, чтобы раскрыть окно настройки параметров;</li>
<li>укажите адреса сайтов;</li>
<li>задайте другие параметры. Что можно задать:
<ul>
<li>показывать похожие посты или произвольные посты;</li>
<li>количество ссылок;</li>
<li>target у ссылок;</li>
<li>
стиль. На выбор есть четыре стиля, можно выбрать "без стиля" и настроить отображение самостоятельно; примеры стилей:
<table width="100%">
<tr>
<td>Лёгкий</td>
<td>Серый</td>
</tr>
<tr>
<td><img src="http://static.graddit.com/img/aggregator_light_rus.png" alt="Graddit aggregator, light style" title="Graddit aggregator, light style"></td>
<td><img src="http://static.graddit.com/img/aggregator_gray_rus.png" alt="Graddit aggregator, gray style" title="Graddit aggregator, gray style"></td>
</tr>
<tr>
<td>Голубой</td>
<td>Тёмный</td>
</tr>
<tr>
<td><img src="http://static.graddit.com/img/aggregator_blue_rus.png" alt="Graddit aggregator, blue style" title="Graddit aggregator, blue style"></td>
<td><img src="http://static.graddit.com/img/aggregator_dark_rus.png" alt="Graddit aggregator, dark style" title="Graddit aggregator, dark style"></td>
</tr>
</table>
</li>
<li>использовать или нет инлайн стили. Укажите <i>нет</i>, если у вас будут свои стили;</li>
<li>показывать или нет картинки;</li>
<li>картинка по умолчанию.</li>
</ul>
</li>
<li>справа выберите платформу, чтобы получить подготовленный код;</li>
<li>скопируйте код и вставьте в нужное место в шаблоне.</li>
</ul>
На данный момент полноценно поддерживаются блоги на площадке Blogspot, так же есть экспериментальная поддержка фидов Atom. Если хотите попробовать atom, то в сгенерированном коде вручную добавьте фид и укажите 'atom', примерно так (показан код для сбора постов с двух разных сайтов):<br/>
<pre class="jscript" name="code012713">var sites = {
'http://fruitfulbookmarks-ru.blogspot.com' : 'blogger',
'http://ruletka.omg-linux.ru/atom.xml' : 'atom',
};
</pre>
<br />
По мере развития будут добавляться и другие площадки и типы фидов, их можно будет выбрать при задании настроек агрегатора.<br/><br/>
Немного про платную версию. В автоматическом режиме работает подписка через Paypal. На <a href="www.graddit.com/aggregator/rus">странице агрегатора</a> вам просто нужно будет указать адрес своего блога и количество связанных блогов и нажать на кнопку <i>Подписаться через Paypal</i>. При этом будет проверена ваша текущая подписка, и если всё в порядке, вы сможете перейти к оплате. Подписка может быть отменена в любой момент. Ограничения платной версии: 100,000 показов в день, до 10 сайтов. Если вы считаете, что этого мало, пишите на <a href="mailto:sales@graddit.com">sales@graddit.com</a> — договоримся. Также если Paypal вам не подходит, присылайте варианты. Лимиты агрегатора под ваши нужды могут быть настроены вручную.</div>
<script type="text/javascript">
dp.SyntaxHighlighter.BloggerMode();
dp.SyntaxHighlighter.HighlightAll('code012713');
</script>ffbshttp://www.blogger.com/profile/17456754845646147816noreply@blogger.com0tag:blogger.com,1999:blog-9115408885622764300.post-40912852864913034592013-01-25T10:26:00.000-08:002013-05-16T07:19:07.693-07:00Шаблон со встроенными виджетами Graddit: mlnpics<div dir="ltr" style="text-align: left;" trbidi="on"><a href="http://pastebin.com/ZPmrhzUz">Скачать шаблон</a><br/><br/>Время от времени я буду адаптировать и выкладывать свободные шаблоны Blogspot с интегрированными виджетами Graddit. Первый пример mlnpics основан на шаблоне <a href="http://www.dzignine.com/2011/12/queen/">Queen</a> от <a href="http://www.dzignine.com/">DZignine</a>. <center>Главная страница:</center><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgI3YtefaGwpYfyeEARC1A8khsu88KUkwzvVt65576tYk-Me6h2bWqplFpOTk-7UQ7zc_Bqy9K45qyjF9qAPkwOjJ4BPlcXFkKi1Gi6se14bkddDNK08Qp8gDlBVNZl-fGJO7x81-ah2PJi/s1600/mlnpics_main.png" imageanchor="1" style="margin-left:1em; margin-right:1em"><img style="border: 1px solid #a0a0a0;" height="352" width="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgI3YtefaGwpYfyeEARC1A8khsu88KUkwzvVt65576tYk-Me6h2bWqplFpOTk-7UQ7zc_Bqy9K45qyjF9qAPkwOjJ4BPlcXFkKi1Gi6se14bkddDNK08Qp8gDlBVNZl-fGJO7x81-ah2PJi/s400/mlnpics_main.png" /></a></div><br/><center>Пост:</center><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzrRLgLl6AaxVPYCVw_2uc8Xn-X4RkcYQp_NN_pU3uq5DyFJcZDc8dBTOPzSa9RjIRenSjje2C56bW9pJSKu6msjo0lTMDmEWXkbmqlcwIDnGJx9kxHHKHEm7IaVvQLaNy6Mbd9wnftSKq/s1600/mlnpics_item.png" imageanchor="1" style="margin-left:1em; margin-right:1em"><img style="border: 1px solid #a0a0a0;" height="371" width="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzrRLgLl6AaxVPYCVw_2uc8Xn-X4RkcYQp_NN_pU3uq5DyFJcZDc8dBTOPzSa9RjIRenSjje2C56bW9pJSKu6msjo0lTMDmEWXkbmqlcwIDnGJx9kxHHKHEm7IaVvQLaNy6Mbd9wnftSKq/s400/mlnpics_item.png" /></a></div><br/>Ключевые моменты: <ul><li>использованы виджеты: <a href="http://www.graddit.com/ratings-widget">рейтинги</a>, <a href="http://www.graddit.com/most-popular-widget">топы</a>, <a href="http://www.graddit.com/aggregator/rus">агрегатор</a>;</li><li>встроены скрипты замены ссылок "Prev" и "Next" на заголовки постов;</li><li>в меню отображаются статические страницы, в том числе страницы, на которых выводятся лучшие посты по различным категориям. Порядок показа постов в топах управляется виджетами Graddit и основан на среднем рейтинге по итогам голосования. Такой сортировки невозможно достичь исключительно средствами Blogspot;</li><li>в блоге возможна навигация на главной и между постами с помощют нажатия Ctrl + влево и Ctrl + вправо, так что посетителям не придётся искать ссылки и будет проще листать страницы.</li></ul><br />Живое демо: <a href="http://mlnpics.blogspot.com">http://mlnpics.blogspot.com</a>.<br/>Исходник шаблона пока не опубликован, в комментариях принимаю пожелания по улучшению/изменению шаблона. Ссылка на скачивание появится чуть позже. <br/><br/><i>Важно:</i> в шаблоне нет авторской ссылки на Graddit, но есть ссылки на сайт автора оригинального шаблона, её удалять нельзя. <br/><br/><a href="http://pastebin.com/ZPmrhzUz">Скачать шаблон</a></div><!--gradditautorelated--><div style="max-width: 440px; font-size: 14px; text-align: left; padding-top: 10px;" id=""><fieldset id=""><legend id="">Интересно почитать</legend><ul id=""><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2013/01/graddit-aggregator-related-posts-from-multiple-blogs.html" id=""><span style="" id="">Агрегатор graddit: похожие посты с нескольких блогов</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2012/09/graddit.html" id=""><span style="" id="">Статистика в graddit</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2013/05/rating-snippet-on-google-search-page-and-graddit-ratings.html" id=""><span style="" id="">Расширенный сниппет google и рейтинги graddit</span></a></li></ul></fieldset></div><!--//gradditautorelated-->ffbshttp://www.blogger.com/profile/17456754845646147816noreply@blogger.com0tag:blogger.com,1999:blog-9115408885622764300.post-71366809000383258872012-12-04T14:24:00.000-08:002012-12-04T14:24:21.081-08:00Как удалить старые посты из рейтингов<p>Бывают ситуации, когда вам по какой-то причине необходимо удалить пост в блоге. Если при этом вы используете виджет лучших материалов, то удалённый пост (если он был популярным) ещё какое-то время может отображаться в виджете. А раз самого поста уже нет, то его заголовок, картинка, да и сама ссылка не него будут "сломанными". Чтобы ускорить процесс удаления битых постов из виджета топов в закладке <i>Статистика</i> <a href="https://manage.graddit.com/account/rus">административного интерфейса graddit</a> появились новые полезные функции:
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhC5xP1LYBVYWc71OPMP2YZyfL4TlP3VIWechy3Rqn93xD5rcnQIpVJuJI1whGVRRgkEkoeKTsr7PeQm_5dBOIox402QJlcFUR5NLCmX98o7sWBUpfjUNL9G2KdtNv0jGCqxendoKe6o0si/s1600/rating_actions_rus.png" imageanchor="1" style="margin-left:1em; margin-right:1em"><img border="0" height="170" width="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhC5xP1LYBVYWc71OPMP2YZyfL4TlP3VIWechy3Rqn93xD5rcnQIpVJuJI1whGVRRgkEkoeKTsr7PeQm_5dBOIox402QJlcFUR5NLCmX98o7sWBUpfjUNL9G2KdtNv0jGCqxendoKe6o0si/s400/rating_actions_rus.png" /></a></div>
</p>
<p>
<ul>
<li>X - удалить историю без удаления самого рейтинга. Это позволит убрать виджет из топов, при этом сохранив данные по просмотрам и голосам;</li>
<li>☠ - удалить рейтинг полностью.</li>
</ul>
После удаления соответствующая строка в статистике будет отмечена розовым цветом. Если рейтинг был полностью удалён, то он исчезнет из таблицы при следующем обновлеении страницы статистики.
<p>ffbshttp://www.blogger.com/profile/17456754845646147816noreply@blogger.com0tag:blogger.com,1999:blog-9115408885622764300.post-29786839449598592602012-11-04T14:17:00.000-08:002013-05-16T07:24:26.804-07:00Blogger: сортируем посты по популярности<div dir="ltr" style="text-align: left;" trbidi="on"><p>Стандартно платформа Blogger предоставляет только две опции для сортировки постов: от новых к старым и наоборот. Виджеты Graddit дают возможность отобразить посты по убыванию или возрастанию их рейтинга. Посмотрите на эту страницу: <a href="http://fruitfulbookmarks-ru.blogspot.com/p/blog-page.html">http://fruitfulbookmarks-ru.blogspot.com/p/blog-page.html</a>. На ней отображены 5 лучших постов из этого блога (по убыванию рейтинга). А на этой: <a href="http://fruitfulbookmarks-ru.blogspot.com/p/blogspot.html">http://fruitfulbookmarks-ru.blogspot.com/p/blogspot.html</a> — анонсы лучших постов по теме "blogspot" (т.е. у которых есть метка blogspot).</p><p>Это не посты, а статические страницы, которые движок Blogger позволяет создавать. Если вы откроете исходный код этих страниц, то увидите, что на самом деле в них нет никаких постов, а лишь немного кода на javascript. Чтобы создать такую же страницу вам нужно: <ol><li>если вы всё ещё не создали аккаунт, <a href="https://manage.graddit.com/account/rus">сделайте это</a>;</li><li>создайте топ с нужными параметрами на <a href="https://manage.graddit.com/account/tops">закладке топов</a>;</li><li>В секции <head> своего шаблона подключите graddit-extras.js:<br/><pre class="jscript" name="code041112"><script src='http://static.graddit.com/js/graddit-extras.js' type='text/javascript'/></pre></li><li>Создайте обычную HTML страницу, переключитесь в режим редактирования HTML и подключите jquery. Конечно, если эта библиотека ещё не подключена у вас в самом шаблоне:<br/><pre class="jscript" name="code041112"><script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'/></pre></li><li>Добавьте функцию, которая будет отвечать за загрузку и обработку ваших постов:<br/><pre class="jscript" name="code041112"><script type='text/javascript'><br />function gradditLoadTopPosts(id) {<br /> var element = $("#" + id);<br /> if (element.length > 0) {<br /> var wrapperDiv = $("#top5");<br /> if (wrapperDiv.length == 1) {<br /> element.find("a").each(function(i, a) {<br /> var host = a.hostname;<br /> var blogHost = "fruitfulbookmarks-ru.blogspot";<br /> if (host.indexOf(blogHost) >= 0) {<br /> var docHost = document.location.host + "";<br /> var level1Doc = docHost.substring(blogHost.length, docHost.length);<br /> var level1Post = host.substring(blogHost.length, host.length);<br /> var link = a.href;<br /> if (level1Doc != level1Post) {<br /> link = link.replace(blogHost + level1Post, blogHost + level1Doc);<br /> }<br /> var containerId = "top_posts_" + i;<br /> wrapperDiv.append("<div id='" + containerId + "' style='display: none;'></div>");<br /> var container = $("#" + containerId);<br /> container.load(link);<br /> setTimeout(function() {<br /> var post = container.find("div[class='post hentry']");<br /> if (post.length > 0) {<br /> var newText = "";<br /> if (i > 0) {<br /> newText = "<hr style='width: 100%; clear: both;'/>"<br /> }<br /> newText += gradditCutText(post.html(), 900, 2) + "<" + "br/><" + "br/>";<br /> var startIdx = newText.indexOf("<h3 class=\"post-title entry-title\">");<br /> var endIdx = newText.indexOf("</h3>");<br /> newText = newText.substr(0, startIdx) + "<a href='" + link + "'>" + newText.substr(startIdx, endIdx - startIdx + 5) + "</a>" + newText.substr(endIdx, newText.length);<br /> container.html(newText);<br /> container.show();<br /> }<br /> }, 2000 * (i + 1));<br /> }<br /> });<br /> } <br /> }<br />}<br /></script><br /></pre>Пара слов об изменениях, которые вам нужно будет сделать, чтобы подстроить функцию под ваш блог: <ul><li>#top5 - это id контейнера, вы увидите его ниже; также, в зависимости от шаблона, вам, возможно, придётся изменить имена классов, которые обрабатываются в функции. Экспериментируйте.</li><li>в строке var blogHost = "fruitfulbookmarks-ru.blogspot"; замените адрес блога на свой; <b>не пишите домен страны (.ru, .co.uk) или .com!</b></li><li>при вызове функции для обрезания текста постов gradditCutText второй параметр - это максимальная длина текста, а третий - полезная опция, которая позволяет обрезать посты с точностью до слова (0 - ничего не делать, 1 - обрезать до слова, 2 - удлинять до слова). Если вы не хотите обрезать текст совсем, укажите оба паратметра равными 0;</li></ul></li><li>добавьте элемент-контейнер для постов и вызов топа с callback функцией:<br/><pre class="jscript" name="code041112"><div id="top5"></div><br /><div id="graddit_top_wrapper" style="visibility: hidden; display: none;"></div><script type="text/javascript" src="http://www.graddit.com/showtop/rus/31?id=graddit_top_wrapper&callback=gradditLoadTopPosts"></script><br /></pre>Не забудьте заменить ID топа (31 в этом примере) на свой собственный, который можно найти в коде топа в админке. </li></ol></p><p>Всё готово. А ещё в топах появилась возможность фильтровать посты по меткам. То есть (если вы дружите с JS) можно на одной странице, например, показывать лучшие посты по категориям. Конечно, это не совсем сортировка, а просто отображение N лучших постов. Но ведь можно, скажем, показывать не 5, а 20 постов, разбить на страницы и приделать листалку страниц. Если это приобретёт популярность, я обазательно расширю функциональность.</p><br /></div><script type="text/javascript">dp.SyntaxHighlighter.BloggerMode(); dp.SyntaxHighlighter.HighlightAll('code041112'); </script><!--gradditautorelated--><div style="max-width: 440px; font-size: 14px; text-align: left; padding-top: 10px;" id=""><fieldset id=""><legend id="">Интересно почитать</legend><ul id=""><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2013/05/rating-snippet-on-google-search-page-and-graddit-ratings.html" id=""><span style="" id="">Расширенный сниппет google и рейтинги graddit</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2012/12/blog-post.html" id=""><span style="" id="">Как удалить старые посты из рейтингов</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.com/2012/05/blog-post_12.html" id=""><span style="" id="">Виджет лучших статей с картинками</span></a></li></ul></fieldset></div><!--//gradditautorelated-->ffbshttp://www.blogger.com/profile/17456754845646147816noreply@blogger.com2tag:blogger.com,1999:blog-9115408885622764300.post-69633162549562578662012-10-19T16:27:00.001-07:002013-05-16T07:20:06.494-07:00Виджет рейтингов для Tumblr<!--gradditautomicro--><div itemscope='' itemtype='http://data-vocabulary.org/Review-aggregate'><span itemprop='rating' itemscope='' itemtype='http://data-vocabulary.org/Rating'><meta content='5.0' itemprop='value'><meta content='5' itemprop='best'/></span><meta content='1' itemprop='votes'></div><!--//gradditautomicro--><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBzypE5kZsaYYhLlPnniTIhWHcuLxY1yHLBh7ewGekgOdStVxQYr8Nc3SZPysFeiLe4BjUYXlU_VtxcBVkYlCISnh6NzS90XuaS4VT7ITOMzIotu7xtTCFxsBdoR6amANJP8IvAoIvpw9g/s1600/tumblr.png" imageanchor="1" style="margin-left:1em; margin-right:1em"><img border="0" height="120" width="397" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBzypE5kZsaYYhLlPnniTIhWHcuLxY1yHLBh7ewGekgOdStVxQYr8Nc3SZPysFeiLe4BjUYXlU_VtxcBVkYlCISnh6NzS90XuaS4VT7ITOMzIotu7xtTCFxsBdoR6amANJP8IvAoIvpw9g/s400/tumblr.png" style="border: 0; box-shadow: none;" /></a></div> Виджет рейтигов Graddit теперь поддерживает работу с блогохостингом Tumbl. <a href="http://fruitful-bookmarks.tumblr.com">Примеры здесь</a>. Для вставки одиночного рейтинга нужно скопирвать <a href="http://www.graddit.com/ratings-widget">со страницы рейтингов</a> код из закладки <i>Общий код (Generic)</i> и вставить в нужное место поста при его создании. Чтобы можно было использовать javascript при написании постов, нужно сделать некоторые изменения в настройках блога:<br/><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4i2zzeeI9TTSoT7Dx_oxLt2_5fMk-BF4AwwnW_CNZadBEpRHM0yLDzTjQ49XfYOkFzVTeGPsREZdm8NObsYKKfo8AGDfVlKkZFvjFarEon-8IgXVU99VCiblR469N6JyejzY0v_1VGJiA/s1600/tumblr_settings.png" imageanchor="1" style="margin-left:1em; margin-right:1em"><img border="0" height="316" width="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4i2zzeeI9TTSoT7Dx_oxLt2_5fMk-BF4AwwnW_CNZadBEpRHM0yLDzTjQ49XfYOkFzVTeGPsREZdm8NObsYKKfo8AGDfVlKkZFvjFarEon-8IgXVU99VCiblR469N6JyejzY0v_1VGJiA/s400/tumblr_settings.png" /></a></div>Чтобы зайти в настройки, залогиньтесь в tumblr и нажмите на шестерёнку (1). Убедитесь, что пункт "Edit post using" установлен в "plain text/HTML" (2).<br/><br/>Также необходимо подключить стили. Это делается в настройках темы. <a href="http://www.tumblr.com/customize?">Перейдите к редактированию темы</a>, нажмите на кнопку <i>Edit HTML</i><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVtd7aM1DCjDgF-5-h7tBY0R7nIyrfEMjPFOMK6v6cvE_aodGEZGKS2DFD0IK8jJLk_A3Th550oIoZrRrS46-B0QLqOc_vlIyZmnQsyCNx4NVSQznhyphenhyphenShjMA138psWwAVBivPi9MJaCDuv/s1600/tumblr_edit_html.png" imageanchor="1" style="margin-left:1em; margin-right:1em"><img border="0" height="156" width="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVtd7aM1DCjDgF-5-h7tBY0R7nIyrfEMjPFOMK6v6cvE_aodGEZGKS2DFD0IK8jJLk_A3Th550oIoZrRrS46-B0QLqOc_vlIyZmnQsyCNx4NVSQznhyphenhyphenShjMA138psWwAVBivPi9MJaCDuv/s400/tumblr_edit_html.png" /></a></div>Добавьте стили<br/><center><link type="text/css" rel="stylesheet" href="http://static.graddit.com/css/graddit.css"/></center><br/>в любое место секции <head> <div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4LBL0oRhHkLRBfGCN2zzwJ74ufEIIsGZYC57u0SjaoP8IP5n9jLgaFmZMplGNITDIoiVwQTHxAurKAshbN3bw4eFtHYPlwEGkUI_x4Ye0wMy2mFbKCJ2rL9L_kxR8oIdhnEuSRxbzWTks/s1600/tumblr_styles.png" imageanchor="1" style="margin-left:1em; margin-right:1em"><img border="0" height="162" width="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4LBL0oRhHkLRBfGCN2zzwJ74ufEIIsGZYC57u0SjaoP8IP5n9jLgaFmZMplGNITDIoiVwQTHxAurKAshbN3bw4eFtHYPlwEGkUI_x4Ye0wMy2mFbKCJ2rL9L_kxR8oIdhnEuSRxbzWTks/s400/tumblr_styles.png" /></a></div>Нажмите кнопку <i>Update Preview</i>, затем <i>Save</i> (если появится). Всё готово для использования одиночных рейтингов.<br/><br/>Если вы хотите, чтобы рейтинги автоматически добавлялись к каждому посту, то придётся ещё слегка модифицировать шаблон. Определитесь, где конкретно должен появляться виджет (в каких типах материалов, в каком месте поста, должен ли быть виден на главной или только при открытии поста), затем попробуйте в шаблоне найти соответствующее место. Не для всех шаблонов это будет просто сделать, экспериментируйте сначала с каким-нибудь безобидным текстом или даже комментариями. Например, чтобы звёзды были видны сверху под заголовком поста, только в текстовых постах (на главной и "внутри"), нужно код виджета добавить в {block:Posts} внутри блока {block:Text} сразу после закрывающегося {/block:Title} <div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsZGsCiqwNzCaW963GxJoptNNHQ4kkP0-kyp8oHdRMFohvSzEdxNKkseM2gSdm-vA0Wg-DOQSVRMYR5Hhi6fsanMnQlkSrVfm6gNjs8iEuyCzlX_Pi6lBA6EnK43tTnLvEue0zxWkLDx4q/s1600/tumblr_update_template.png" imageanchor="1" style="margin-left:1em; margin-right:1em"><img border="0" height="271" width="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjsZGsCiqwNzCaW963GxJoptNNHQ4kkP0-kyp8oHdRMFohvSzEdxNKkseM2gSdm-vA0Wg-DOQSVRMYR5Hhi6fsanMnQlkSrVfm6gNjs8iEuyCzlX_Pi6lBA6EnK43tTnLvEue0zxWkLDx4q/s400/tumblr_update_template.png" /></a></div>Не забудьте сохранить шаблон. Код виджета брать <a href="http://www.graddit.com/ratings-widget">со страницы рейтингов</a> из закладки <i>Tumblr</i>.<br/><br/>Если что-то не получается, не стесняйтесь задавать вопросы в комментариях.<!--gradditautorelated--><div style="max-width: 440px; font-size: 14px; text-align: left; padding-top: 10px;" id=""><fieldset id=""><legend id="">Интересно почитать</legend><ul id=""><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2013/03/delayed-ratings-widget-load.html" id=""><span style="" id="">Отложенная загрузка или как подключить виджет рейтингов...</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2012/09/graddit.html" id=""><span style="" id="">Статистика в graddit</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2012/09/graddit_16.html" id=""><span style="" id="">Новые виджеты graddit для голосования</span></a></li></ul></fieldset></div><!--//gradditautorelated-->ffbshttp://www.blogger.com/profile/17456754845646147816noreply@blogger.com6tag:blogger.com,1999:blog-9115408885622764300.post-9986070492600662882012-10-15T19:48:00.001-07:002013-05-16T07:31:41.144-07:00Похожие страницы с других сайтов<div dir="ltr" style="text-align: left;" trbidi="on"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7-L5eyKjBC22As0e3dQj-9MJMe0ZXFbR746K_3F1GYohWspHYOVVVnS3rIdvoE8swa0GhFG6dX0zSIIjX2X5XOfE5S_A7IzqJBBjigJd_LvI3TCyyJ6nad_-WfYtngtVSZPLLBXezubFT/s1600/related.png" imageanchor="1" style="clear:left; float:left;margin-right:1em; margin-bottom:1em"><img border="0" width="80" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7-L5eyKjBC22As0e3dQj-9MJMe0ZXFbR746K_3F1GYohWspHYOVVVnS3rIdvoE8swa0GhFG6dX0zSIIjX2X5XOfE5S_A7IzqJBBjigJd_LvI3TCyyJ6nad_-WfYtngtVSZPLLBXezubFT/s400/related.png" /></a></div><a href="http://graddit.com/related-posts-widget">Виджет похожих статей</a> стал ещё лучше: теперь можно прямо на странице управления рекомендациями переключиться на другой сайт и добавлять похожие статьи одним кликом. <br/>Выглядит это так: <div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghEwKZClCI8450yZmwKBd29L1rp797fezs_7KLEiYrleYcUbHf48sJZoEXsSOYCRTt3J1mE5gLNEKMs3Ve0zHlLREWp3Jft1hNlkyG2u-tkHOjLUvQrWFQAEcaIQ_GCSw4PqklkWgdOywR/s1600/related_external.png" imageanchor="1" style="margin-left:1em; margin-right:1em"><img border="0" width="700" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghEwKZClCI8450yZmwKBd29L1rp797fezs_7KLEiYrleYcUbHf48sJZoEXsSOYCRTt3J1mE5gLNEKMs3Ve0zHlLREWp3Jft1hNlkyG2u-tkHOjLUvQrWFQAEcaIQ_GCSw4PqklkWgdOywR/s1600/related_external.png" /></a></div><br/>Как работает: <ol><li>В поле "переключиться" (1) введите URL любой страницы сайта, который хотите использовать (на сайте должен быть установлен виджет рейтингов и для него должен быть <a href="https://manage.graddit.com/account/rus">сгенерирован ключ</a>). Можно ввести просто название домена. Нажмите Enter и подождите, пока рейтинги загрузятся.</li><li>Слева выберите родительскую страницу, рекомендации для которой вы собираетесь добавить. Нажмите на галочку (2) чтобы связать страницы.</li><li>Если вы настроили рекомендации на показ картинок, то картинку для внешней страницы придётся указать вручную, потому что адреса фидов, из которых берётся информация о картинках, для вашего собственного сайта и для внешнего сайта не совпадают. Получить картинку легко: просто нажмите на иконку (3).</li></ol>Не забудьте сохранить рекомендации. Каждый раз, когда вы переключаетесь на новый сайт, его адрес будет добавляться ниже в виде ссылки для быстрого переключения. На рейтинги текущего сайта можно переключиться, нажав на ссылку "Свой". Ссылки показывают три последних сайта, с которыми вы работали. <br /><br/><i>Важно:</i> чтобы на сайт можно было переключиться, в его собственных настройках галочка "Разрешить другим пользователям видеть мои рейтинги" должна быть установлена.<br/><br/>Заодно хочу напомнить, что есть что на странице настройки рекомендаций. Слева - список родительских страниц, для которых вы создаёте рекомендации. Родительская страница, с которой в данный момент идёт работа, отображается в раскрытом виде зелёным цветом. Справа - все ваши страницы. Чтобы создать новую родительскую страницу, нужно нажать на "←"; чтобы связать страницу с родительской, нужно нажать на "✓". Светло-серым обозначены уже связанные страницы, светло-зелёным - подобраные автоматически на основе меток.<br/><br/>В скором будущем: автоматическое определение фида (чтобы не нужно было вручную указывать ссылки на картинки) и автоподбор похожих страниц с внешних сайтов для тех, кому лень возиться самому. </div><!--gradditautorelated--><div style="max-width: 440px; font-size: 14px; text-align: left; padding-top: 10px;" id=""><fieldset id=""><legend id="">Интересно почитать</legend><ul id=""><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2013/01/graddit-aggregator-related-posts-from-multiple-blogs.html" id=""><span style="" id="">Агрегатор graddit: похожие посты с нескольких блогов</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2012/07/blog-post.html" id=""><span style="" id="">Улучшаем вид виджета лучших и виджета похожих постов</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2013/03/widget-mne-nravitsya.html" id=""><span style="" id="">Виджет "мне нравится" в виде сердечка</span></a></li></ul></fieldset></div><!--//gradditautorelated-->ffbshttp://www.blogger.com/profile/17456754845646147816noreply@blogger.com3tag:blogger.com,1999:blog-9115408885622764300.post-32587323466407711552012-09-22T07:25:00.000-07:002013-05-16T07:11:10.061-07:00Динамические шаблоны Blogger и виджеты<div dir="ltr" style="text-align: left;" trbidi="on"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhydPadGRSYSZ6rGYt6ZZmhK9DNsw8HmHJihAOAji1A8B_DffSDgBsh7c82yrIIOqyajmFaXZ37nWQn6AIClIHC0DK0PXvPEIpgUM0uGhLGXtzAr__CfWlK6ErLzfljJpLNZdSPdqYMJ9U/s1600/blogger_dynamic_views_hacked.png" imageanchor="1" style="clear:left; float:left;margin-right:1em; margin-bottom:1em"><img border="0" height="199" width="200" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhydPadGRSYSZ6rGYt6ZZmhK9DNsw8HmHJihAOAji1A8B_DffSDgBsh7c82yrIIOqyajmFaXZ37nWQn6AIClIHC0DK0PXvPEIpgUM0uGhLGXtzAr__CfWlK6ErLzfljJpLNZdSPdqYMJ9U/s320/blogger_dynamic_views_hacked.png" /></a></div>Динамические шаблоны Blogger выглядят хорошо, но они поддерживают всего лишь несколько официальных виджетов. Сегодня мы немного поработаем над динамическими шаблонами и посмотрим, как в них можно добавить сторонние виджеты (на примере рейтингов Graddit, разумеется).<br/><br/><b>Действуйте на свой страх и риск.</b> Всё, что вы увидите дальше, является, так сказать, плохой практикой, потому что оно может перестать работать в любой момент, или даже ваш блог может начать отображаться и работать неправильно. Вас предупреждали!<br/><br/>Итак, наша цель - отображать виджеты, когда пользователь раскрывает заметку в любом из видов (Classic, Flipcard, Magazine, Mosaic, Sidebar, Snapshot и Timeline).<br/><br/>Для начала откройте панель управления Блоггера и перейдите на закладку Template; нажмите Edit HTML, а потом кнопку Proceed.<br/><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitiYQzImUqXVwSULe8G4dhc8os8bo4isd1hjRjT43eHPBNSL9qXNDKMUPA2G7ytfXPW4g1siWBO5-Tg3Knh8Y06Z9HmHgTiMGLiypX8aUZTPRN6DBcvfiI2Acqo0c7KMU8w3H6yV07ta4/s1600/blogger_edit_template.png" imageanchor="1" style="margin-left:1em; margin-right:1em"><img border="0" height="140" width="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitiYQzImUqXVwSULe8G4dhc8os8bo4isd1hjRjT43eHPBNSL9qXNDKMUPA2G7ytfXPW4g1siWBO5-Tg3Knh8Y06Z9HmHgTiMGLiypX8aUZTPRN6DBcvfiI2Acqo0c7KMU8w3H6yV07ta4/s320/blogger_edit_template.png" /></a></div>При работе с динамическими шаблонами нам недоступна большая часть функционала шаблонизатора. То есть, изменить шаблон и даже сохранить его вы сможете, но это ничего не изменит в поведении интерфейса. Но нам много и не надо. Добавьте в секцию <head>...</head> две строки:<br/><br/><link href='http://static.graddit.com/css/graddit.css' rel='stylesheet' type='text/css'/><br/><script src='http://static.graddit.com/js/graddit-extras.js' type='text/javascript'/><br/><br/>Это стили и несколько скриптов, расширяющих функционал виджетов Graddit. Нам, правда, нужна только функция <i>gradditBloggerDynamicViewsRatingsHack</i>. Теперь перейдите в самый конец шаблона и перед закрывающимся тегом </body> вставьте этот вызов:<br/><br/><script type='text/javascript'>setTimeout(function(){gradditBloggerDynamicViewsRatingsHack();},1000);</script><br/><br/>Или вот этот, если вы хотите чтобы отображались ещё и похожие страницы:<br/><br/><script type='text/javascript'>setTimeout(function(){gradditBloggerDynamicViewsRatingsHack(true);},1000);</script><br/><br/>Сохраните шаблон и закройте редактор. Нажмите кнопку Customize - нам нужно добавить несколько стилей, без которых виджеты будут отображаться неверно. Выберите Advanced и нажмите Add CSS. Добавьте вот такие стили:<br/><br/><pre>.article .article-content .ffbs_rate img {<br /> padding: 0;<br /> border: 0;<br /> border-image: none;<br /> -webkit-border-image: none;<br /> vertical-align: middle;<br />}<br /><br />.article .article-content .ffbs_stats {<br /> font-size: 10px;<br />}<br /><br />.article .article-content a {<br /> border: 0;<br />}<br /></pre><br/>Нажмите Apply to Blog. <div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUTUlnxhwAfp0Oej2sjvHh5-KuWsQFao8_jKb6GyKc3kWOW5JPawjPRG_699A63-DPWLXMxHAXidOWbdVRFOm72Vir8wo3eflbkfIjr-DpfsMhTG9hpLYGNRTHVg0czpj5EE76GG5R5l0/s1600/blogger_add_styles.png" imageanchor="1" style="margin-left:1em; margin-right:1em"><img border="0" height="80" width="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUTUlnxhwAfp0Oej2sjvHh5-KuWsQFao8_jKb6GyKc3kWOW5JPawjPRG_699A63-DPWLXMxHAXidOWbdVRFOm72Vir8wo3eflbkfIjr-DpfsMhTG9hpLYGNRTHVg0czpj5EE76GG5R5l0/s400/blogger_add_styles.png" /></a></div><br/>Вот и всё, виджеты должны заработать. Откройте свой блог и убедитесь. Вот как это работает в тестовом блоге: <a href="http://ffbs-widgets.blogspot.com/">http://ffbs-widgets.blogspot.com/</a>.<br/>Получилось? <br /></div><!--gradditautorelated--><div style="max-width: 440px; font-size: 14px; text-align: left; padding-top: 10px;" id=""><fieldset id=""><legend id="">Интересно почитать</legend><ul id=""><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2012/10/ratings-widget-for-tumblr.html" id=""><span style="" id="">Виджет рейтингов для tumblr</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2011/11/fruitful-bookmarks.html" id=""><span style="" id="">Рейтинг-виджет от graddit</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2012/09/graddit_16.html" id=""><span style="" id="">Новые виджеты graddit для голосования</span></a></li></ul></fieldset></div><!--//gradditautorelated-->ffbshttp://www.blogger.com/profile/17456754845646147816noreply@blogger.com8tag:blogger.com,1999:blog-9115408885622764300.post-28822322914077857282012-09-16T16:22:00.000-07:002013-05-16T07:26:02.300-07:00Новые виджеты Graddit для голосования<div dir="ltr" style="text-align: left;" trbidi="on">Graddit представляет виджеты для голосования, которые вы можете встроить в свои блоги или сайты. Так выглядит простой виджет:<br /><br /><center><div id='rate20120916_1' class='ffbs_rate'>{[['Плохо',' | '],['Средне',' | '],['Отлично']]}</div></center><script type='text/javascript' src='http://graddit.com/rate/rus/3/73y9qd8?id=rate20120916_1&class_star=ffbs_star_dark_underlined&class_star_set=ffbs_star_dark_underlined&class_star_vote=ffbs_star_vote_underlined&type=simplepoll&votes=no'></script><br/>Количество пунктов и текст могут быть любыми. Смотрите код на <a href='http://www.graddit.com/rus'>главной странице graddit</a>, пункты задаются так:<br/><br/>{[['Плохо','&nbsp;&nbsp;|&nbsp;&nbsp;'],['Средне','&nbsp;&nbsp;|&nbsp;&nbsp;'],['Отлично']]}, где '&nbsp;&nbsp;|&nbsp;&nbsp;' - это разделители между пунктами; количество пунктов должно совпадать с числом, передаваемом скрипту в качестве параметра (в данном случае 3).<br/><br/>Вместо текста могут быть любые элементы. Например, можно сделать голосование за картинки:<br/><br/><center>Кто круче?<br/><div id='rate20120916_2' class='ffbs_rate'>{[['<img style="height: 60px;" src="http://static.graddit.com/img/cat.png"/>',' '], ['<img style="height: 60px;" src="http://static.graddit.com/img/dog.png"/>',' '], ['<img style="height: 60px;" src="http://static.graddit.com/img/catdog.png"/>']]}</div><div id='stats20120916_2' class='ffbs_stats'></div></center><script type='text/javascript' src='http://www.graddit.com/rate/rus/3/73y9qd8_2?id=rate20120916_2&stats=stats20120916_2&class_star=ffbs_star&class_star_set=ffbs_star&class_star_vote=ffbs_star&info=info&info_delay=2&type=simplepoll&votes=no'></script><br/><br/>И, конечно, обычное голосование с графиком. Как вам новые виджеты?<br/><center><div style='width: 300px;'><div id='rate20120916_3' class='ffbs_rate'>{[['Так себе'],['Нормально'],['Великолепно']]}</div><div id='stats20120916_3' class='ffbs_stats'></div></div></center><script type='text/javascript' src='http://graddit.com/rate/rus/3/73y9qd8_3?id=rate20120916_3&stats=stats20120916_3&class_star=ffbs_poll&class_star_set=ffbs_poll_set&class_star_vote=ffbs_poll_vote&type=poll'></script></div><!--gradditautorelated--><div style="max-width: 440px; font-size: 14px; text-align: left; padding-top: 10px;" id=""><fieldset id=""><legend id="">Интересно почитать</legend><ul id=""><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2012/10/ratings-widget-for-tumblr.html" id=""><span style="" id="">Виджет рейтингов для tumblr</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2011/11/fruitful-bookmarks.html" id=""><span style="" id="">Рейтинг-виджет от graddit</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2012/09/graddit.html" id=""><span style="" id="">Статистика в graddit</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2013/01/graddit-templates-mlnpics.html" id=""><span style="" id="">Шаблон со встроенными виджетами graddit: mlnpics</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2013/05/rating-snippet-on-google-search-page-and-graddit-ratings.html" id=""><span style="" id="">Расширенный сниппет google и рейтинги graddit</span></a></li></ul></fieldset></div><!--//gradditautorelated-->ffbshttp://www.blogger.com/profile/17456754845646147816noreply@blogger.com1tag:blogger.com,1999:blog-9115408885622764300.post-76705083144449775232012-09-03T10:59:00.001-07:002013-04-19T11:32:45.601-07:00Статистика в Graddit<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6B00Qd5y3TuZys2qjhNbq5jdCzSCgnqOwXsgSXDPqeJc23ruU8UweTrcZLnMn_5-LaALDNAlAIZcN_2lif3N8Q-IvDPqr5nEG0PfpHMmaGT2Nd37zBXxIzJbTjBGIV06-HMRKEQfEka6C/s1600/graddit_stats_thumb.png" imageanchor="1" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6B00Qd5y3TuZys2qjhNbq5jdCzSCgnqOwXsgSXDPqeJc23ruU8UweTrcZLnMn_5-LaALDNAlAIZcN_2lif3N8Q-IvDPqr5nEG0PfpHMmaGT2Nd37zBXxIzJbTjBGIV06-HMRKEQfEka6C/s1600/graddit_stats_thumb.png" height="70" width="80" /></a></div>
В <a href="https://manage.graddit.com/account/rus" target="_blank">личном кабинете</a> сервиса Graddit появилась новая закладка "Статистика". Теперь можно посмотреть, какие страницы получили больший рейтинг, количество голосов или просмотров, где больше отзывов. Кроме того, можно узнать некоторые интересные данные о страницах, такие как Google Pagerank, Alexa Rank, количество упоминаний в Facebook и Twitter. Это первая версия статистики, со временем туда будут добавляться новые возможности (куда же без ТИЦ Яндекса?). Вот как выглядит закладка сейчас:<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEia2ihTJw0b7P-SPdG5X75LmYCIFz-D_AYzof578dxcsD_lvP4-4zKqrPFgP4fBaB2YMoyp_p_WKI_Bo6Ovs8H6HeuChXV5_u0qKEcRapadyOkE1fjzXjVnO4FOr6RlkWTurQx-sz5vkjgU/s1600/graddit_statistics_ru.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEia2ihTJw0b7P-SPdG5X75LmYCIFz-D_AYzof578dxcsD_lvP4-4zKqrPFgP4fBaB2YMoyp_p_WKI_Bo6Ovs8H6HeuChXV5_u0qKEcRapadyOkE1fjzXjVnO4FOr6RlkWTurQx-sz5vkjgU/s1600/graddit_statistics_ru.png" height="267" width="640" /></a></div>
<br />
Таблицу можно сортировать. Чтобы получить информацию о странице, нажмите на ссылку ⟳ в нужной строке. Сообщения об ошибках и предложения по улучшению оставляйте в комментариях.<br/><br/>
Обновление от 18 сентября 2012: теперь в статистике есть Яндекс тИЦ. ffbshttp://www.blogger.com/profile/17456754845646147816noreply@blogger.com2tag:blogger.com,1999:blog-9115408885622764300.post-30902194759097616812012-07-06T08:24:00.000-07:002013-05-25T15:27:21.798-07:00Улучшаем вид виджета лучших и виджета похожих постов<div dir="ltr" style="text-align: left;" trbidi="on">Немного поигравшись со стилями виджетов можно получить вот такую красоту:<br /><center><div id="graddit_top_wrapper_styled" style="visibility: hidden;"></div></center><script src="http://graddit.com/showtop/rus/15?id=graddit_top_wrapper_styled" type="text/javascript"></script><br />Стили и настройки красоты: <br /><br /><table border="0" width="100%"><tr><td width="20%" align="right">Стили изображения:</td><td width="80%" align="left"><input style="width: 550px" type="text" value="background: none; border: 0; padding: 0; width: 100px; height: 100px; box-shadow: 5px 5px 5px #808080;" /></td></tr><tr><td align="right">Стили заголовков:</td><td align="left"><input style="width: 550px" type="text" value="width: 90px; height: 30px; position: absolute; bottom: 10px; font-size: 11px; display: block; background: #a0ffff; opacity: 0.8; padding: 2px 5px 2px 5px; color: #0066cc;" /></td></tr><tr><td align="right">Стили li:</td><td align="left"><input style="width: 550px" type="text" value="display: inline-block; word-wrap: break-word; text-align: left; width: 110px; height: 110px; vertical-align: top; margin: 0 3px 0 3px; font-size: 12px; color: grey; position: relative;" /></td></tr><tr><td align="right">Стили контейнера:</td><td align="left"><input style="width: 550px" type="text" value="max-width: 500px; text-align: center; padding-top: 10px; color: #3d9cfa;" /></td></tr><td></td><td>Обрезать текст после 20 символов и укоротить до слова;</td></tr></table><div><br /></div></div><!--gradditautorelated--><div style="max-width: 440px; font-size: 14px; text-align: left; padding-top: 10px;" id=""><fieldset id=""><legend id="">Интересно почитать</legend><ul id=""><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.com/2012/05/blog-post_12.html" id=""><span style="" id="">Виджет лучших статей с картинками</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.com/2012/04/graddit.html" id=""><span style="" id="">Рейтинги graddit: рекомендации и топы</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2012/09/graddit_16.html" id=""><span style="" id="">Новые виджеты graddit для голосования</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2012/09/graddit.html" id=""><span style="" id="">Статистика в graddit</span></a></li></ul></fieldset></div><!--//gradditautorelated-->ffbshttp://www.blogger.com/profile/17456754845646147816noreply@blogger.com0tag:blogger.com,1999:blog-9115408885622764300.post-81710628244798950562012-06-24T12:08:00.001-07:002013-05-16T07:32:51.583-07:00Управление виджетами graddit при помощи callback функций<div dir="ltr" style="text-align: left;" trbidi="on"><div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxic-cX004wA0A3qrSe0AhnrcR1Lr3jzVFp1ioz9VRkLGf6PYjShvAEbTXiaFXrYzL8-pp2W7CFRWBF-5UdYAf7qfIszCkQdjkYXLmz8m-jD7BYOcAm5DaBBPQm_9yC5zSgc-beHaNAeDL/s1600/callback.png" imageanchor="1" style="clear:left; float:left;margin-right:1em; margin-bottom:1em"><img border="0" height="155" width="155" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxic-cX004wA0A3qrSe0AhnrcR1Lr3jzVFp1ioz9VRkLGf6PYjShvAEbTXiaFXrYzL8-pp2W7CFRWBF-5UdYAf7qfIszCkQdjkYXLmz8m-jD7BYOcAm5DaBBPQm_9yC5zSgc-beHaNAeDL/s400/callback.png" /></a></div> Мудрёный заголовок, но суть проста: по умолчанию виджеты отображаются в том месте страницы, где находится их контейнер, id которого вы передаёте на сервер. Но что, если, к примеру, вы хотите, чтобы виджет лучших постов появлялся при достижении читателем конца страницы (и исчезал при прокрутке вверх)? Для упрощения решения этой задачи виджеты поддерживают параметр callback; при помощи него вы можете передать управление вашему собственному скрипту после того, как код виджета отработал. Более того, в файле http://www.graddit.com/js/graddit-extras.js есть рабочий пример функции, которую вполне уже можно использовать. Итак, рассмотрим, как всё это работает на примере <a href="http://fruitfulbookmarks-ru.blogspot.com/2012/04/graddit.html">виджета лучших сообщений</a>.<br /><br />Вот код (он вставлен в это самое место поста):<br /><div id='callback_example' style='visibility: hidden; display: none; position: fixed; right: 10px; bottom: 10px;'>Лучшее:</div><script type="text/javascript" src="http://www.graddit.com/showtop/rus/8?id=callback_example&callback=gradditDisplayWidgetCallback"></script><br /><div id="callback_example" style="bottom: 10px; display: none; position: fixed; right: 10px; visibility: hidden;">Лучшее:</div><script src="http://www.graddit.com/showtop/rus/8?id=callback_example&callback=gradditDisplayWidgetCallback" type="text/javascript"></script><br />Код здесь, но виджета вы не увидите, потому что функция gradditDisplayWidgetCallback изменила поведение виджета. Теперь он будет появляться в нижнем правом углу, если вы прокрутите страницу вниз. И, соответственно, исчезать, если вы прокрутите страницу обратно вверх. <br /><br/> Если вы хотите использовать javascript функцию из примера, то вам нужно подключить js файл в шаблоне ваших страниц, добавив туда такую строку:<br /><br /><script type="text/javascript" src="http://www.graddit.com/js/graddit-extras.js"></script><br /><br /> Вот и всё, что вам нужно: подключить файл graddit-extras.js и указать callback функцию при вызове виджета. Файл graddit-extras.js время от времени будет пополняться новыми полезными функциями (следите за анонсами).<br/><br/> Напомню, что внешний вид виджетов настраивается в <a href="https://manage.graddit.com/account/rus">панели управления</a>. <br /></div><!--gradditautorelated--><div style="max-width: 440px; font-size: 14px; text-align: left; padding-top: 10px;" id=""><fieldset id=""><legend id="">Интересно почитать</legend><ul id=""><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2012/06/graddit.html" id=""><span style="" id="">Перевод виджета рейтингов graddit на любой язык</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2011/10/blog-post.html" id=""><span style="" id="">Отслеживание ошибок и опечаток в текстах на вашем сайте...</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.com/2011/06/blog-post.html" id=""><span style="" id="">Новые возможности: цитирование</span></a></li></ul></fieldset></div><!--//gradditautorelated-->ffbshttp://www.blogger.com/profile/17456754845646147816noreply@blogger.com0tag:blogger.com,1999:blog-9115408885622764300.post-66255079228084016072012-06-24T04:59:00.001-07:002013-05-16T07:21:23.569-07:00Перевод виджета рейтингов graddit на любой язык<div dir="ltr" style="text-align: left;" trbidi="on">Виджет рейтингов graddit поддерживает два языка: русский и английский. Это определяется параметром rus или eng при вызове виджета (<a href="http://fruitfulbookmarks-ru.blogspot.com/2011/11/fruitful-bookmarks.html">подробнее здесь</a>). Разумеется, это не совсем удобно, если ваши страницы написаны на другом языке, получается языковая каша, которая выглядит не очень красиво. Рассмотрим на примере самого популярного кода виджета (жёлтые звёзды) как можно решить проблему перевода. Код выглядит так:<br /><br /><b:if cond='data:blog.pageType != &quot;static_page&quot;'><br /> <div expr:id='"labels_" + data:post.id' style='display: none; visibility: hidden;'><br/> <b:if cond='data:post.labels'><br/> <b:loop values='data:post.labels' var='label'><data:label.name/>,</b:loop><br/> </b:if><br/> </div> Нравится пост? <br/> <b><div expr:id='data:post.id' style='padding-left: 3px; padding-right: 3px; display: inline; visibility: hidden;'>{[[&#39;&lt;img src=&quot;http://img.graddit.com/img/star.png&quot;/&gt;&#39;]]}</div></b><br/> <script expr:src='&quot;http://graddit.com/rate/rus/5/&quot; + data:post.id + &quot;?stats=&quot; + data:post.id + &quot;&amp;info=info-&quot; + data:post.id + &quot;&amp;info_delay=2&amp;class_star=ffbs_star_img&amp;class_star_set=ffbs_star_img_set&amp;class_star_vote=ffbs_star_img_vote&amp;views=yes&amp;id=&quot; + data:post.id + &quot;&amp;url=&quot; + data:post.url + &quot;&amp;labels=labels_&quot; + data:post.id + &quot;&quot;' type='text/javascript'/><br /></b:if> <br /><br/>Жирным выделен интересующий нас элемент div. Помимо указанного выше он может содержать следующие значение в data-атрибутах:<br /><ul style="text-align: left;"><li>data-label-votes - текст для "голосов";</li><li>data-label-views - текст для "просмотров";</li><li>data-label-rating - текст для "рейтинга"'</li><li>data-label-info-rating - текст для рейтингов во всплывающем окне с расшифровкой голосов.</li></ul><div>Проще понять на примере. Такой код (с добавленным параметром average=yes для отображения значения рейтинга):</div><br/><div><b:if cond='data:blog.pageType != &quot;static_page&quot;'><br /> <div expr:id='"labels_" + data:post.id' style='display: none; visibility: hidden;'><br/> <b:if cond='data:post.labels'><br/> <b:loop values='data:post.labels' var='label'><data:label.name/>,</b:loop><br/> </b:if><br/> </div> Нравится пост? <br/> <div <b>data-label-votes='проголосовало: ' data-label-views='посмотрели: ' data-label-rating='оценили на: ' data-label-info-rating='Подробно'</b> expr:id='data:post.id' style='padding-left: 3px; padding-right: 3px; display: inline; visibility: hidden;'>{[[&#39;&lt;img src=&quot;http://img.graddit.com/img/star.png&quot;/&gt;&#39;]]}</div><br/> <script expr:src='&quot;http://graddit.com/rate/rus/5/&quot; + data:post.id + &quot;?stats=&quot; + data:post.id + &quot;&amp;info=info-&quot; + data:post.id + &quot;&amp;info_delay=2&amp;class_star=ffbs_star_img&amp;class_star_set=ffbs_star_img_set&amp;class_star_vote=ffbs_star_img_vote&amp;views=yes&amp;average=yes&amp;id=&quot; + data:post.id + &quot;&amp;url=&quot; + data:post.url + &quot;&amp;labels=labels_&quot; + data:post.id + &quot;&quot;' type='text/javascript'/><br /></b:if> <br /><br />Даст вот такой рейтинг:<br/><br/><div id='rate' class='ffbs_rate' data-label-votes='проголосовало: ' data-label-views='посмотрели: ' data-label-rating='оценили на: ' data-label-info-rating='Подробно'>{[['<img src="http://img.graddit.com/img/star.png"/>']]}</div><div id='stats' class='ffbs_stats'></div><script type='text/javascript' src='http://graddit.com/rate/rus/5/uto049e5?id=rate&stats=stats&class_star=ffbs_star_img&class_star_set=ffbs_star_img_set&class_star_vote=ffbs_star_img_vote&views=yes&info=info&info_delay=2&average=yes'></script></div><br/><br/>В отличие от стандартного, который вы видите ниже. </div><!--gradditautorelated--><div style="max-width: 440px; font-size: 14px; text-align: left; padding-top: 10px;" id=""><fieldset id=""><legend id="">Интересно почитать</legend><ul id=""><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2012/10/ratings-widget-for-tumblr.html" id=""><span style="" id="">Виджет рейтингов для tumblr</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2012/10/blog-post.html" id=""><span style="" id="">Похожие страницы с других сайтов</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2013/03/graddit-paid-subscriptions.html" id=""><span style="" id="">Платные подписки в graddit</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2013/03/widget-mne-nravitsya.html" id=""><span style="" id="">Виджет "мне нравится" в виде сердечка</span></a></li></ul></fieldset></div><!--//gradditautorelated-->ffbshttp://www.blogger.com/profile/17456754845646147816noreply@blogger.com0tag:blogger.com,1999:blog-9115408885622764300.post-92032653651025317602012-06-05T16:52:00.000-07:002012-06-05T16:52:03.644-07:00Виджет связанных постов обновился<div dir="ltr" style="text-align: left;" trbidi="on">
<p><a href="http://fruitfulbookmarks-ru.blogspot.com/2012/04/graddit.html">Виджет связанных постов</a> стал намного лучше. Что появилось:
<ul>
<li>стили для управления отображением виджета;</li>
<li>загрузка картинок;</li>
<li>автоматические рекомендации на основе меток;</li>
<li>улучшенный интерфейс. Об этом ниже.</li>
</ul><br/>
</p>
<b>Интерфейс</b><br/>
<p>Если вы всё ещё не получили доступ к панели управления, то <a href="https://manage.graddit.com/account/rus">сделайте это сейчас</a>.<br/>
Панель рекомендаций изменилась, появились настройки:
<div class="separator" style="clear: both; text-align: center;">
<a href="http://img.graddit.com/img/blog/rus/recommendations.png" imageanchor="1" style="margin-left:1em; margin-right:1em"><img border="0" width="750" src="http://img.graddit.com/img/blog/rus/recommendations.png" /></a></div><br/>
Теперь можно:
<ul>
<li>
указать, что должен делать виджет, если для какого-то поста связанные страницы не заданы:
<ul>
<li>подобрать страницы автоматически (на основе меток);</li>
<li>ничего не показывать;</li>
<li>показать статический HTML. Впрочем, ничто не мешает добавить туда и javascript;</li>
</ul>
</li>
<li>загружать картинки (должен быть указан адрес фида);</li>
<li>указать количество выводимых ссылок. Если количество связанных (или автоматически найденных) страниц больше этого числа, то будет выведено указанное количество выбранных произвольно ссылок;</li>
<li>указать максимальную длину выводимого заголовка (или ссылки, если указано, что заголовки загружать не нужно);</li>
<li>настраивать внешний вид виджета;</li>
</ul><br/>
Интерфейс ручной настройки связанных постов тоже поменялся и стал намного удобнее:
<div class="separator" style="clear: both; text-align: center;">
<a href="http://img.graddit.com/img/blog/rus/recommendations_manual.png" imageanchor="1" style="margin-left:1em; margin-right:1em"><img border="0" width="750" src="http://img.graddit.com/img/blog/rus/recommendations_manual.png" /></a></div><br/>
Вы по-прежнему создаёте рекомендации при помощи ссылки <b>←</b> и указываете связанные посты при помощи <b>✓</b>, но теперь при выборе контейнера в правой части подсвечиваются:<br/>
<ul>
<li>тёмно-серым цветом — страница, к которой относятся рекомендации (контейнер);</li>
<li>светло-серым — собственно рекомендации (связанные страницы);</li>
<li>светло-зелёным — автоматически подобранные на основе меток страницы, которые вы можете захотеть включить в первую очередь;</li>
</ul><br/>
Собственно код виджета (для Blogger-а) нужно брать <a href="https://manage.graddit.com/account/recommendations">с этой же</a> страницы, над списком рекомендаций.
</p>
<b>Возможные проблемы</b>
<p>
<ol>
<li><i>В правой части отображаются не все страницы.</i> Это может быть от того, что ваш блог читают жители других стран, и страницы попадают в базу данных, имея доменные имена вроде: ваш-блог.blogspot.com.nl или ваш-блог.blogspot.co.uk. Чтобы это разрешить вам нужно в коде вызова рейтинга указать параметр domain. Например, для blogger-а, так:<br/><br/><script expr:src='"http://graddit.com/rate/rus/...url=&quot; + data:post.url + &quot;&amp;domain=ваш-блог.blogspot.com&amp;labels=...</script><br/><br/>и подождать некоторое время, пока информация обновится в базе данных.
</li>
<li><i>Нет меток.</i> Вам нужно обновить код виджета - просто возьмите его с <a href="http://www.graddit.com">главной страницы</a>. Опять же, придётся подождать, пока информация обновится.</ol>
</li>
</p>
<br /></div>ffbshttp://www.blogger.com/profile/17456754845646147816noreply@blogger.com14tag:blogger.com,1999:blog-9115408885622764300.post-88209478874547263042012-05-12T10:16:00.000-07:002012-05-19T10:31:25.014-07:00Виджет лучших статей с картинками<div dir="ltr" style="text-align: left;" trbidi="on">
<a href="http://fruitfulbookmarks-ru.blogspot.com/2012/04/graddit.html">Виджет топов (лучших статей) от graddit</a> обзавёлся возможностью показвать картинки и теперь может выглядеть так:<br/><br/>
<div id="graddit_top_wrapper_1" style="visibility: hidden;"></div><script type="text/javascript" src="http://www.graddit.com/showtop/rus/7?id=graddit_top_wrapper_1"></script><br/><br/>
Или так:<br/><br/>
<div id="graddit_top_wrapper_2" style="visibility: hidden;">Лучшее за неделю:</div><script type="text/javascript" src="http://www.graddit.com/showtop/rus/8?id=graddit_top_wrapper_2"></script><br/><br/>
Для управления отображением картинок в панели управления топами появились новые поля:<br/><br/>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgaI5hOG02-TVYIAiPJg6pUIaEAAz5vfmFC44fyRjyldr5behi8hpvzxbSgPW-byqwX3YMlU95-RgcOWk1dgKVRZkqLQTkM5hG1uPs1qAdFqqgDbWWHtkaKzP1wPzv_IBhkN7OWRLIPYCWP/s1600/tops_thumbs.png" imageanchor="1" style="margin-left:1em; margin-right:1em"><img border="0" height="170" width="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgaI5hOG02-TVYIAiPJg6pUIaEAAz5vfmFC44fyRjyldr5behi8hpvzxbSgPW-byqwX3YMlU95-RgcOWk1dgKVRZkqLQTkM5hG1uPs1qAdFqqgDbWWHtkaKzP1wPzv_IBhkN7OWRLIPYCWP/s400/tops_thumbs.png" /></a></div><br/>
<i>Адрес фида</i> — адрес вашего RSS фида, обязательно в формате json-in-script. Это поле будет заполнено автоматически при создании нового топа.<br/>
<i>Изображение по умолчанию</i> — изображение, которое будет показано, если картинка заметки не была найдена.<br/>
<i>Стили изображения, Стили li и Стили контейнера</i> — стили соответствующих элементов виджета, позволяют придать ему желаемый вид. Для вашего удобства уже представлено 2 предустановки: для вертикального отображения виджета и для горизонтального.<br/><br/>
Комментируйте, задавайте вопросы, если что-то неясно.
<br /></div>ffbshttp://www.blogger.com/profile/17456754845646147816noreply@blogger.com8tag:blogger.com,1999:blog-9115408885622764300.post-65218911891214845272012-05-06T19:44:00.001-07:002012-05-06T19:44:28.299-07:00Обновление кода виджета рейтингов<div dir="ltr" style="text-align: left;" trbidi="on">
Если вы используете виджет рейтингов в блоге на площадке Blogger, то сейчас самое время обновиться. Просто скопируйте новый код с <a href="http://graddit.com">главной страницы</a>. Обновления не критические, они просто добавляют поддержку меток (для будущих <a href="http://fruitfulbookmarks-ru.blogspot.com/2012/04/graddit.html">автоматических рекомендаций</a>) и исправляют ошибку с неверными ссылками в личном кабинете.
<br /></div>ffbshttp://www.blogger.com/profile/17456754845646147816noreply@blogger.com0tag:blogger.com,1999:blog-9115408885622764300.post-47021254349921240452012-04-30T21:43:00.000-07:002013-09-01T16:54:30.382-07:00Рейтинги Graddit: рекомендации и топы<div dir="ltr" style="text-align: left;" trbidi="on">
<h3>Что такое рекомендации и топы. Как настроить и показать соответствующие виджеты Graddit.</h3>
<p>Для того, чтобы воспользоваться приведёнными ниже советами, вам сначала необходимо получить доступ к <a href="https://manage.graddit.com/account/rus">личному кабинету</a>. Откройте ссылку, нажмите на "Сгенерировать ключ" и следуйте инструкции. Когда вы войдёте в личный кабинет, то увидите 3 вкладки: Настройки, Рекомендации и Топы.
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPM3EZjILw7msOi9efoYVbEFeW84-7s1elfVkg8uwS6yLQe09aJSPYuRjmmwCUpajlvdwHhiNuqMOarnjae9hXuz-qBBzyeNueSjfG0RRMxKhRZcwnCYQwnT-__kC2Dkp_i3nlgLbXPx48/s1600/options.png" imageanchor="1" style="clear:left; float:both;margin-right:1em; margin-bottom:1em"><img border="0" height="195" width="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPM3EZjILw7msOi9efoYVbEFeW84-7s1elfVkg8uwS6yLQe09aJSPYuRjmmwCUpajlvdwHhiNuqMOarnjae9hXuz-qBBzyeNueSjfG0RRMxKhRZcwnCYQwnT-__kC2Dkp_i3nlgLbXPx48/s320/options.png" /></a></div>
</p><br/>
<b>Настройки</b>
<p>Эта страница нам пока не интересна, она создана на будущее. Всё, что можно там сейчас сделать - это сменить секретный ключ и запретить/разрешить генерацию токена. Если генерация запрещена, то вы не сможете повторно получить секретный ключ. Вам может понадобиться заново получить секретный ключ, если вы забыли свой старый ключ, восстановление ключа через отсылку письма на электронную почту пока не реализовано, это будет чуть позже.</p><br/><br/>
<b>Рекомендации</b>
<p>
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPAkDTnpw7Kp00AQ8yA5NrO3iowRwq1UAhlh0tlwQKhkKn6qQAhgI7NzDaw8ahb5ct3AzHyFv_sC7gpYGGmrq_Nj8vEADMBVYh_AtLDmyhFMABdSOEbEDhsEyWoDg0vzEnGUZF67tZzzew/s1600/recomendations.png" imageanchor="1" style="margin-left:1em; margin-right:1em"><img border="0" height="136" width="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPAkDTnpw7Kp00AQ8yA5NrO3iowRwq1UAhlh0tlwQKhkKn6qQAhgI7NzDaw8ahb5ct3AzHyFv_sC7gpYGGmrq_Nj8vEADMBVYh_AtLDmyhFMABdSOEbEDhsEyWoDg0vzEnGUZF67tZzzew/s400/recomendations.png" /></a></div>
<br/>
<i>Ниже будут описаны возможные проблемы, прочтите о них, прежде чем сообщить, что что-то не работает.</i><br/>
На этой странице вы можете создать рекомендации - список ссылок, связанных с заданной страницей. В левой части экрана - уже созданные вами связи, в правой - список ссылок на страницы, на которых установлен виджет рейтингов (для них можно создавать связанные страницы). Например, чтобы для страницы с адресом http://fruitfulbookmarks-ru.blogspot.com/2011/05/blog-post.html задать 3 связанных статьи, нужно в правой половине напротив ссылки нажать на "←" - это создаст контейнер. Затем, нажимая на "✓" можно добавлять связанные с выбранной страницей материалы. Щелкните на изображение выше, чтобы увеличить его - так будет немного понятнее, о чём речь. При добавлении ссылок их заголовки будут загружаться автоматически, но вы можете их менять, как, впрочем, вы можете менять и сами ссылки. Ссылки могут указывать и на сторонние сайты, но в этом случае заголовки вам нужно будет вписывать самостоятельно. Сохраните рекомендации. Для отображения виджета есть две возможности:<br/>
<ol>
<li> скопировать код (пока только для площадки Blogger) и вставить его в шаблон в нужном месте. В этом случае заданные для разных страниц рекомендации будут отображаться автоматически.</li>
<li> если вы хотите показать конкретный список рекомендации в определённом месте, то нажмите на ссылку "Посмотреть" и скопируйте предложенный код в выбранное место. Например, в пост.
Тогда (если вы не забыли подключить стили из файла http://graddit.com/css/graddit.css) при просмотре поста вы увидите что-то вроде этого:
<script type="text/javascript" src="http://www.graddit.com/rec/rus/3117772916741481113"></script><br/>
Добавив кое-какой код:<br/>
<div id='graddit_recommendation' style='display: inline; visibility: hidden;'>Текст заголовка можно задать</div><script src='http://graddit.com/rec/rus/3117772916741481113?id=graddit_recommendation'></script>
<br/>
можно изменить заголовок:
<div id='graddit_recommendation' style='display: inline; visibility: hidden;'>Текст заголовка можно задать</div><script src='http://graddit.com/rec/rus/3117772916741481113?id=graddit_recommendation'></script>
</li></ol>
<i>Возможные проблемы.</i>
<ul>
<li>В правой части экрана вместо ссылок на отдельные страницы вы видите преимущественно ссылки на главную страницу. Это происходит от того, что ваши рейтинги видны на главной и были привязаны к ней во время последнего голосования. Исправление для этого будет представлено в скором времени. Тем не менее, рекомендации привязываются к идентификаторам рейтингов (в случае с Blogger-ом это то же самое, что идентификатор постов), т.е. рекомендации, заданные для таких URL-ов всё равно будут отображаться на правильных страницах. Если вы не хотите во всё это вникать, просто немного подождите исправления этой ошибки.</li>
<li>Пока нельзя создавать рекомендации, не привязанные к рейтингам. Эта возможность скоро появится.</li>
<li>Ручное управление рекомендациями утомительно, как насчёт автоматического подбора материалов? Да, это утомительно, но это и гораздо более точно, чем то, что будет подобрано роботом. Тем не менее, я кое-что планирую в этом отношении, как то: в случае отсутствия рекомендаций отображение ссылок из заданного набора, возможность вызвать сторонний виджет, подбор ссылок на основе тегов. Ждите обновлений.</li>
</ul>
</p><br/>
<i>Внимание! Виджет похожих сообщений обновился, <a href="http://fruitfulbookmarks-ru.blogspot.com/2012/06/blog-post.html">читайте подробности</a>.</i><br/><br/>
<b>Топы</b>
<p>
Тут попроще. Топы - это списки страниц, за которые больше всего голосуют/больше просматривают или которые имеют больший рейтинг:
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpGDD4otVzKtn3F2dErYjVvOUnh0r8kqvK9YwQIWGBx18B6K02NDoktevQekULePd9HQxIDTzY4HsR5wKkWbizpiX5HmBt1R3a5JGNypffQblx798fas2E2FlVbiYKTz9xU2vbOIVj8FEV/s1600/tops.png" imageanchor="1" style="margin-left:1em; margin-right:1em"><img border="0" height="364" width="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpGDD4otVzKtn3F2dErYjVvOUnh0r8kqvK9YwQIWGBx18B6K02NDoktevQekULePd9HQxIDTzY4HsR5wKkWbizpiX5HmBt1R3a5JGNypffQblx798fas2E2FlVbiYKTz9xU2vbOIVj8FEV/s400/tops.png" /></a></div>
Вы можете задать:
<ol>
<li>количество ссылок, отображаемых в топе;</li>
<li>максимальный период обновления информации в топе (в минутах, не менее 60 и не более 1440 - эти лимиты изменятся на основании ваших отзывов и собранной мной статистики);</li>
<li>критерий отбора (количество голосов/количество просмотров/средняя оценка);</li>
<li>параметры:</li>
<ul>
<li><i>только за последний период</i> - если отмечено, то топы будут формироваться на основании информации за недавний период времени; если не отмечено, то в основу лягут текущие значения количества голосов или количества просмотров;</li>
<li><i>вначале с меньшим рейтингом</i> - порядок сортировки ссылок;</li>
<li><i>исключить главную страницу</i> - ссылки на главную страницу не будут отображаться в топе;</li>
<li><i>загружать заголовки</i> - загружать заголовки страниц при отображении в топе. Это не будет происходить каждый раз, данные будут кэшироваться на срок до 12 часов;</li>
<li><i>отбрасывать параметры в URL</i> - рекомендую включать; это позволит избавиться от ссылок на одни и те же страницы с разными параметрами после ? в адресах (например, ?showComment=...). Конечно, если от параметров у вас не зависит что-либо существенное;</li>
<li><i>отображать рейтинги рядом со ссылками</i> - показывать значения, по которым происходит сортировка записей в топе. Рекомендую включать на этапе создания топа и отключать при показе посетителям, эта информация им совершенно ни к чему;</li>
</ul>
<li>инлайн стили - поэкспериментируйте, чтобы придать топам желаемый вид;</li>
<li>максимальное количество символов в отображаемом адресе или заголовке (0 - не обрезать).</li>
</ol>
Поэкспериментировав с инлайн стилями, можно получить что-нибудь такое:<br/><br/>
<div id="graddit_top_wrapper_1" style="visibility: hidden;">Лучшие посты</div><script type="text/javascript" src="http://www.graddit.com/showtop/rus/1?id=graddit_top_wrapper_1"></script>
</p><br/>
На сегодня пока всё. Спрашивайте, критикуйте, высказывайте пожелания. Нашли в тексте ошибку или опечатку - воспользуйтесь виджетом отслеживания ошибок в верхнем правом углу страницы. Следите за обновлениями.
<br/></div>ffbshttp://www.blogger.com/profile/17456754845646147816noreply@blogger.com25tag:blogger.com,1999:blog-9115408885622764300.post-28188306100829376142011-11-11T16:43:00.000-08:002013-05-16T07:27:52.266-07:00Рейтинг-виджет от Graddit <a href="http://fruitfulbookmarks-ru.blogspot.com/2012/10/ratings-widget-for-tumblr.html">Инструкция для пользователей Tumblr здесь</a>.<br/><br/> <a href="http://www.graddit.com/rus">Graddit</a> представляет рейтинг-виджет, который вы легко сможете добавить на страницы своего сайта. Код виджета можно получить на <a href="http://www.graddit.com/ratings-widget">странице рейтингов</a>. У рейтингов гибкие настройки, но обо всём по порядку.<br/><br/> На странице выбора виджета для демонстрации возможностей есть несколько рейтингов с предустановленными настройками, код которых вы сможете тут же скопировать и использовать в блоге. Среди них: рейтинги со звёздами в виде картинкок, рейтнги с символьными звёздами и просто с произвольными символами, рейтинги с отзывами, рейтинги вида +/-. Код специально подготовлен для использования в шаблонах Blogger, но есть и код в "сыром" виде:<br /><div><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjieCtWJBy3UAB8-ClsST6wuzyaNonE6m3EUQBWTk2Tul-uvrJIDZAAxRaWtwtADKRAEOxNItZGVmMDIOmUVCNd6QQGwyBH3ofXV0nWaH5XTz86RTO8ILqqmjc6tL4-qaqjHweWBiGTJmHT/s1600/rating_rus_blogger.png" imageanchor="1"><img border="0" height="158" width="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjieCtWJBy3UAB8-ClsST6wuzyaNonE6m3EUQBWTk2Tul-uvrJIDZAAxRaWtwtADKRAEOxNItZGVmMDIOmUVCNd6QQGwyBH3ofXV0nWaH5XTz86RTO8ILqqmjc6tL4-qaqjHweWBiGTJmHT/s320/rating_rus_blogger.png" /></a></div><br /><br /> Если по какой-то причине вас не устраивает поведение или вид рейтингов по умолчанию, то вы можете по своему вкусу изменить параметры виджета. Вот некоторые из них (на примере общего кода)<br /><table border="0"><tr> <td><br /><div id='rate' class='rate'>{[["&#9734;","&#9733;"]]}</div><br /></td> <td><br />Этот элемент div содердит информацию о символах, которые будут использованы при отображении рейтинга: "&#9734;" соответствует незакрашенной звезде, "&#9733;" — закрашенной. id элемента важен, он передаётся на сервер (см. ниже).<br /></td> </tr><tr> <td><br /><div id='stats'></div><br /></td> <td><br />Этот элемент div будет содержать текст с количеством голосов. Его id также передаётся на сервер, но этот div может и отсутствовать, вместо него можно использовать предыдущий (rate) div.<br /></td> </tr><tr> <td colspan="2" nowrap="true"><br /><div style='overflow-x: scroll; width: 760px;'><table border="1" style='border-collapse: collapse;' cellpadding="2"><tr> <td><script type='text/javascript' src='</td><td>http://www.graddit.com/rate/</td> <td>rus</td><td>/</td> <td>5</td><td>/</td><td>mjov07w</td><td>?</td><td>id=rate</td><td>&</td><td>stats=stats</td><td>'></script></td> </tr><tr> <td colspan="2">обязательная часть, которую не стоит менять</td> <td>язык: rus или eng</td> <td></td> <td>количество звёзд</td> <td></td> <td>уникальный идентификатор рейтинга</td> <td></td> <td>id элемента, куда будет помещён рейтинг</td> <td></td> <td>id элемента, куда будет помещён текст (количество голосов)</td> <td></td> </tr></table></div></td> </tr><tr> <td colspan="2"><br />Конечно, это не все возможные параметры. О некоторых речь пойдёт ниже, о других читайте следующие посты. Всё это касается внешнего вида и некоторых аспектов поведения виджета, но если вы хотите всё кардинально изменить, то специально для этого есть ещё один параметр: ...&callback=my_function_name<br /><br />В этом случае после отображения рейтинга будет вызвана ваша JS функция my_function_name со следующими параметрами:<br /><table border="0"><tr> <td>"key"</td><td>уникальный идентификатор рейтинга</td> </tr><tr> <td>"id"</td><td>id элемента div, в который будет помещён виджет</td> </tr><tr> <td>"stats"</td><td>id элемента div, в который будет помещён текст (количество голосов)</td> </tr><tr> <td>"average"</td><td>средний рейтинг</td> </tr><tr> <td>"amount"</td><td>количество звёзд</td> </tr><tr> <td>"votes"</td><td>количество голосов</td> </tr><tr> <td>"data"</td><td>расшифровка голосов</td> </tr><tr> <td>"views"</td><td>количество просмотров</td> </tr></table></td> </tr><tr> <td colspan="2"><br />Таким образом, вы обладаете полным контролем над виджетом.<br /></td> </tr></table><br /><br /><b>Как добавить рейтинг-виджет в Blogger</b><br /><ol><li><a href="http://www.graddit.com/rus">Выберите</a> виджет, позже вам нужно будет скопировать код из закладки Blogger.</li><li>В настройках блога перейдите на закладку Дизайн в старом интерфейсе Blogger; в новом интерфесе это пункт Template. Сохраните старый шаблон (кнопка Backup/Restore). Нажмите "Изменить HTML" и поставьте галочку напротив "Расширить шаблоны виджета":<br /><table width="100%"><tr><td width="50%">Старый интерфейс Blogger</td><td width="50%">Новый интерфейс</td></tr><tr><td><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAUU8Zs_29ZAbsnPCXJGDxq5bdzmfOujlN1U8tVlsAIrpPm8ie3A55owHBiCTvKxjU05UsaPddyks_p3D_c6gxu0G66sDhdYPt3dBreTUlNrSI17qRPVM3rcgxOw8k-u_ZsBrgPSYxvupv/s1600/settings.png" imageanchor="1"><img border="0" height="188" width="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAUU8Zs_29ZAbsnPCXJGDxq5bdzmfOujlN1U8tVlsAIrpPm8ie3A55owHBiCTvKxjU05UsaPddyks_p3D_c6gxu0G66sDhdYPt3dBreTUlNrSI17qRPVM3rcgxOw8k-u_ZsBrgPSYxvupv/s320/settings.png" /></a></td><td><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCESvADIn_oXl8AF0RPzcHAiQ4zwEo97vfEpyzgAzWAewV2TfGz3ljBiCLcHrKvcY9tz5DXqmRhU6xULhHlVTekmOfDuyGRjLo4GNYvVAJF6xQAmOLnlqG3SlRI4l7hrFAd3CuTCoAZ3On/s1600/expand_template_new.png" imageanchor="1" style=""><img border="0" height="240" width="400" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCESvADIn_oXl8AF0RPzcHAiQ4zwEo97vfEpyzgAzWAewV2TfGz3ljBiCLcHrKvcY9tz5DXqmRhU6xULhHlVTekmOfDuyGRjLo4GNYvVAJF6xQAmOLnlqG3SlRI4l7hrFAd3CuTCoAZ3On/s400/expand_template_new.png" /></a></td></tr></table></li><li>Сделать резервную копию шаблона можно и сейчас — просто выделите весь текст шаблона, скопируйте и сохраните в файле. В коде шаблона найдите строку "<data:post.body/>" и вставьте после неё код виджета. Если строка "<data:post.body/>" присутствует больше, чем в одном месте, и вы не уверены, куда именно вставить код виджета, то можно поэкспериментировать: вставить, например, "!!!", сохранить шаблон и проверить, угадали вы с местом или нет. Чтобы рейтинг отделить от текста парой пустых строк, вставьте перед ним <br/><br/>. Получится что-то вроде:<br /><div class="separator"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzaPWUwg8eMOLq3Kqb9lXrNSSVJCJ7dpG28zgihgrTPTkV-wiTZ8mR-v7fk3215BtWjmpchVGMHuL4nGryehvZnGYHzpGrIep-DdlCqeU_1mFURr7rO_cqIEj37Np_pokhyphenhyphenVWNSlTm_6nY/s1600/settings_2.png" imageanchor="1"><img border="0" height="134" width="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzaPWUwg8eMOLq3Kqb9lXrNSSVJCJ7dpG28zgihgrTPTkV-wiTZ8mR-v7fk3215BtWjmpchVGMHuL4nGryehvZnGYHzpGrIep-DdlCqeU_1mFURr7rO_cqIEj37Np_pokhyphenhyphenVWNSlTm_6nY/s320/settings_2.png" /></a></div></li><li>В секцию <head>...</head> вашей страницы добавьте стили graddit:<br /><link type="text/css" rel="stylesheet" href="http://static.graddit.com/css/graddit.css" /><br /></li><li>Сохраните шаблон и убедитесь, что рейтинг появился под всеми вашими постами. Если вы не хотите, чтобы рейтинг был виден на главной странице блога, а появлялся только при открытии постов, в коде виджета замените<br />"<b:if cond='data:blog.pageType != &quot;static_page&quot;'>"<br />на<br />"<b:if cond='data:blog.pageType == &quot;item&quot;'>"</li></ol><br/> Справа сверху на <a href="http://www.graddit.com/rus">главной странице</a> отображается пульс рейтингов — последние записи на различных сайтах и блогах, за которые голосуют, облако меток наиболее читаемых постов и картинки страниц, на которых недавно проголосовали люди.<br /><br/> Сервис также предоставляет <a href="http://www.graddit.com/rus/stats">статистику</a> голосований, а ещё есть личный кабинет — очень полезная штука, где можно настроить виджеты лучших и похожих постов, но об этом речь пойдёт позже.<br /><br /> Ещё немного про поведение виджета. Наведя (и подержав пару секунд) курсор мыши на виджет можно получить расшифровку голосов:<br /><div class="separator" style="margin-left: 20px;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizQwTwg4OYvUH8nOgKWs0if2UJib0VSFv1rYjJy7-g9Ci7vi42RGRTVhg-nb134lJ23OwXWUaj0ASjAR4JgrHQMyWZ5qPPZMAfeUyV0QKHY_5JoL377LJSegGe4EWaID8Q3usGb20sqvXW/s1600/info.png" imageanchor="1"><img border="0" height="125" width="320" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizQwTwg4OYvUH8nOgKWs0if2UJib0VSFv1rYjJy7-g9Ci7vi42RGRTVhg-nb134lJ23OwXWUaj0ASjAR4JgrHQMyWZ5qPPZMAfeUyV0QKHY_5JoL377LJSegGe4EWaID8Q3usGb20sqvXW/s320/info.png" /></a></div><br/>Это можно отключить — удалите параметры ...&info= и ...&info_delay= из кода виджета. Вы можете контролировать время задержки появления расшифровки при помощи параметра info_delay, значение которого — количество секунд, до появления информации. Вы можете полностью контролировать всплывающее окно при помощи стилей, в т.ч. удалять нежелательные элементы. Для этого, правда, придётся где-то разместить аналог файла graddit.css и поддерживать его самостоятельно.<br /><br /><br /><br />Ниже — наглядный пример, как это будет выглядеть в блоге.<br />И ещё один пример здесь: <a href="http://blogger.omg-linux.ru/2011/11/reitingi-dlya-bloga.html">http://blogger.omg-linux.ru/2011/11/reitingi-dlya-bloga.html</a><!--gradditautomicro--><div><span class="hreview-aggregate"><span class="item"><span class="fn">Рейтинг-виджет от Graddit</span></span>, <span class="rating"><span class="average">4.72</span> out of <span class="best">5</span> based on <span class="votes">50</span> ratings <span class="summary"></span></span></span></div><!--//gradditautomicro--><!--gradditautorelated--><div style="max-width: 440px; font-size: 14px; text-align: left; padding-top: 10px;" id=""><fieldset id=""><legend id="">Интересно почитать</legend><ul id=""><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.com/2012/05/blog-post_12.html" id=""><span style="" id="">Виджет лучших статей с картинками</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.com/2012/04/graddit.html" id=""><span style="" id="">Рейтинги graddit: рекомендации и топы</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2013/01/graddit-aggregator-related-posts-from-multiple-blogs.html" id=""><span style="" id="">Агрегатор graddit: похожие посты с нескольких блогов</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.com/2013/05/rating-snippet-on-google-search-page-and-graddit-ratings.html" id=""><span style="" id="">Расширенный сниппет google и рейтинги graddit</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.ru/2012/11/blogger.html" id=""><span style="" id="">blogger: сортируем посты по популярности</span></a></li></ul></fieldset></div><!--//gradditautorelated-->ffbshttp://www.blogger.com/profile/17456754845646147816noreply@blogger.com128tag:blogger.com,1999:blog-9115408885622764300.post-13778741128311935482011-10-19T17:16:00.000-07:002013-05-15T07:55:18.593-07:00Интеграция сервиса Fruitful Bookmarks с сайтом на примере блог-площадки Blogger (blogspot.com)<div class="separator" style="clear: both; text-align: center;"><a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5yDcOGeuR5JgheczbPxQeBJmYiBpm8Lu3B1oE0qT8TEavSoWruRWAsZbUtROrAkP_LB8xtRjVnb9vSjqDU0t6TGm66ZOE9bPvPwF_hQQ8_cCZvC47oVumWrI7JYttg_SsmK9-mUwopVDl/s1600/blogger_icon.png" imageanchor="1" style="clear:left; float:left;margin-right:1em; margin-bottom:1em"><img border="0" height="150" width="150" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5yDcOGeuR5JgheczbPxQeBJmYiBpm8Lu3B1oE0qT8TEavSoWruRWAsZbUtROrAkP_LB8xtRjVnb9vSjqDU0t6TGm66ZOE9bPvPwF_hQQ8_cCZvC47oVumWrI7JYttg_SsmK9-mUwopVDl/s400/blogger_icon.png" /></a></div> Забегая вперёд, заметим, что результат интеграции вы можете увидеть на этом блоге: появились дополнительные элементы управления слева и справа на странице.<br /> При помощи ссылок слева (↓ и ↑) посетители могут сохранять и восстанавливать позицию просмотра блога. Конечно, это лишь часть функционала, <a href="http://www.fruitfulbookmarks.com/#help">предоставляемого полноценным хранилищем Fruitful Bookmarks</a>, но зато она работает без этого самого хранилища, пользователям (и даже владельцу сайта или блога) не нужно его создавать. Сделать это предельно просто: нужно взять второй скрипт со страницы <a href="http://www.fruitfulbookmarks.com/#site">http://www.fruitfulbookmarks.com/#site</a>, немного модифицировать, а именно, заменить все символы & на &amp; (всего их 4), так как Blogger экранирует эти символы в шаблонах, и добавить его в шаблон блога, например, в самом конце перед закрывающимся тегом </body>.<br /><br /> Элементы справа помогают вашим посетителям сообщать об ошибках и опечатках, найденных в тексте, а вам — отслеживать эту информацию и исправлять найденные недочёты. Для получения панели управления опечатками следуйте инструкции из предыдущего поста: <a href="http://fruitfulbookmarks-ru.blogspot.com/2011/10/blog-post.html">http://fruitfulbookmarks-ru.blogspot.com/2011/10/blog-post.html</a>, модифицируйте стили по собственному желанию и получите удобный инструмент уведомления об ошибках и опечатках в вашем блоге на blogspot.com.<!--gradditautorelated--><div style="max-width: 440px; font-size: 14px; text-align: left; padding-top: 10px;" id=""><fieldset id=""><legend id="">Интересно почитать</legend><ul id=""><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.com/2011/05/fruitfulbookmarks.html" id=""><span style="" id="">fruitfulbookmarks — онлайн закладки с сохранением...</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.com/2011/10/blog-post.html" id=""><span style="" id="">Отслеживание ошибок и опечаток в текстах на вашем сайте...</span></a></li><li style="display: block; word-wrap: break-word; text-align: left; font-size: 12px; margin-left: -20px;" id=""><a href="http://fruitfulbookmarks-ru.blogspot.com/2011/06/blog-post.html" id=""><span style="" id="">Новые возможности: цитирование</span></a></li></ul></fieldset></div><!--//gradditautorelated-->ffbshttp://www.blogger.com/profile/17456754845646147816noreply@blogger.com0