Блогосфера

Тест Blogger-плагина FullSize

noreply@blogger.com (minimus) — Sun, 25 Oct 2009 09:23:35 PDT

Это тест Blogger-плагина FullSize. Наведите мышь на изображение и кликните на, появившемся при наведении, специальном поле.

Блог переехал

noreply@blogger.com (minimus) — Mon, 12 Dec 2011 05:11:49 PST

Ну, вот и всё! Блог окончательно переехал на новую площадку. На этом блоге новых статей больше не будет. Всё новое в моём новом блоге:

Блоговод

http://blogcoding.ru

Этот блог останется для тестирования и демонстрации виджетов для Blogger. Жду Вас на своём новом блоге!

b-cumulus - наш ответ Чемберлену

noreply@blogger.com (minimus) — Mon, 12 Dec 2011 05:16:16 PST

Разбираясь с tagcloud Роя Танка, я заметил, что несколько весьма интересных возможностей этого flash-приложения, в виджете Blogumus не используются. Я задался целью исправить это недоразумение и осуществил задуманное. Результат - мой новый виджет b-cumulus.
О возможностях нового виджета можно прочитать в моём новом блоге, там же можно скачать всё необходимое для его работы. Блог ещё в работе - идет перенос статей с этого блога, да и просто обустройство. Однако, мне хотелось-бы, чтобы базовым блогом для нового виджета был именно мой новый блог.
Пользуясь случаем, хочу ответить на заданный мне вопрос по поводу того, что именно я изменил в tagcloud.swf. По большому счёту ничего особенного. Как все англо-саксы Рой Танк забыл сделать encode исходящей ссылки, хотя декодирование на входе он делает. Меня это не очень удивило. Удивило меня то, что он заявляет, будто-бы виджет выдаёт encoded links. В общем, глюк исправлен, тестирование шло вяло, но всё же шло и результат можно считать положительным. Скачать исправленную версию можно здесь.

Blogumus: Тестирование локализованной версии

noreply@blogger.com (minimus) — Wed, 14 Jan 2009 09:27:08 PST

К сожалению, локализованная версия Blogumus , собранная "с миру по нитке", работала не должным образом. Поступало много нареканий по поводу работы виджета в семействе ОС Microsoft Windows. Пришлось браться за дело своими руками. Вроде всё срослось!

Огромная просьба ко всем читателям блога!!!

Проверьте работоспособность виджета Blogumus (Flash облако тегов) из своих броузеров, особенно пользователи UNIX-подобных ОС !!!

Пожалуйста оформите результаты тестирования в виде комментария к этому посту!!!

На сегодняшний день виджет протестирован в следующих броузерах:
Microsoft Windows Vista

Microsoft Intenet Explorer v.7 - Ok
Mozilla FireFox v. 3.0.5 - Ok
Opera 10 alpha - Ok
Google Chrome - Ok

Способ тестирования:
Кликните по русским тегам в виджете и убедитесь в положительном результате. Желательно выбрать один однословный тег и один многословный.

Заранее благодарен всем, кто примет участие в тестировании.

Установка шаблона темы (XML) Blogger

noreply@blogger.com (minimus) — Sun, 11 Jan 2009 09:59:59 PST

Я уже писал об установке шаблона темы Blogger в статье Blogger: Тонкая настройка. Но видимо недостаточно хорошо разъяснил ... Понадеялся, что все в теме, а зря. Естественно, что у людей появились вопросы. Действительно, не все же специалисты в области HTML, XHTML или XML, есть и "чайники". Только без обид, я тоже являюсь чайником в большинстве областей человеческой деятельности, впрочем, как и все остальные. Попробую исправить положение.

Начнём с азов, а именно, с терминологии:

Шаблоны

Классический шаблон темы Blogger - старый вариант разметки шаблона, кое-кто ещё пользуется, но постепенно уходит в небытие.
Современный шаблон темы Blogger - новый вариант разметки шаблона, основанный на XML последней версии. Позволяет значительно больше как в плане дизайна, так и в плане программирования.

Виджеты

Виджет - некий код (HTML, javascript) позволяющий вывести некую информацию в заданном месте страницы при отображении страници в броузере клиента. Современный шаблон темы Blogger состоит исключительно из виджетов (в естественном, первоначальном состоянии), но являясь XML-документом позволяет добавлять в свою структуру коды, в основном javascript, виджетами не являющиеся.
Гаджет - виртуальный инструмент, хранящий код виджета. Визуальное представление виджета как объекта в режиме дизайнера страницы блога. Существует только в режиме дизайна.

Ну чтож, с терминологией закончили, вернёмся к нашим баранам (к существу вопроса).

Установка современного шаблона темы Blogger состоит из нескольких шагов. А именно

Шаг первый. Подготовка

Зайдите в панель управления Вашим блогом (в обычный или draft) в раздел МАКЕТ->Изменить HTML. Убедитесь, что ваш блог работает в режиме современного, а не классического шаблона:

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

Если блог находится в режиме современного шаблона, сохраните текущий шаблон, чтобы потом не было мучительно больно за утерянные настройки, в случае, если что-то пойдёт не так:

Как только Вы кликните по ссылке "загрузить весь шаблон", начнёт загружаться файл текущего шаблона на Ваш компьютер. Сохраните его, мало ли что ... Вероятность крайне мала, но ... Может и пригодиться.

Шаг второй. Загрузка

Как только файл сохранился, переходим к загрузке нового шаблона:

Выбираем файл темы (обычно .XML), и загружаем его:

Если ранее установленный шаблон был простым, то скорее всего Вы увидите следующую картину:

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

Не пугайтесь, ничего страшного не произошло. Blogger пытается сохранить все виджеты, которые были установлены в предыдущей теме и при совпадении имён вынужден предложить удалить виджеты с совпадающими именами. Действительно, зачем Вам два виджета "Постоянные читатели" - достаточно одного. Нажмите кнопку "ПОДТВЕРДИТЕ И СОХРАНИТЕ" - тема будет сохранена.

Хуже если вы увидите следующее предупреждение:

Это значит, что какой-то тег в шаблоне не закрыт. Blogger считает открывающие и закрывающие угловые скобки. Если какой-то не хватает, Blogger бьёт тревогу. Однако это вовсе не означает, что в шаблоне есть ошибка. Возможно в текст шаблона был вставлен необработанный код javascript и Blogger принял знаки < и > за теги. При вставке javascript в тело шаблона (гаджетов макета это не касается) необходимо заменять знаки "больше", "меньше" и двойные кавычки на соответствующие аббревиатуры.

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

Возможные причины:

Невозможность переноса виджетов из одной темы в другую, вызванная нестандартным расположением секций виджетов в новой или заменяемой теме.
Несоответствие кодировки устанавливаемой локализованной темы кодировке блога. Обычно англоязычные темы кодируются в ANSI и их перекодировка в UTF-8 (UNICODE) не представляет каких либо проблем для Blogger. Если же локализация проведена некорректно (файл с элементами киррилици сохранен в кодировке ANSI), а блог кодирован в UTF-8, то возникает неустранимая ошибка. Если Вы изменили кодировку с UTF-8 на ANSI (Windows-1251), то это тоже может привести к возникновению неустранимой ошибки при попытке загрузить тему в кодировке UTF-8.
Плохой коннект (что-то потерялось на пути от компьютера блоггера к серверу Blogger)

Надеюсь Вам не придётся столкнуться с этими трудностями.

Шаг третий. Расслабляемся

Если всё прошло удачно и Вы увидели эту картину

жмите на ссылку "Посмотреть блог" и наслаждайтесь результатами своего труда!

Удачи!

Шаблон темы Revolution Lifestyle для Blogger-блога

noreply@blogger.com (minimus) — Sat, 10 Jan 2009 02:52:47 PST

Вот ещё одна великолепная тема из серии Revolution для Blogger-блога. Это тема Брайана Гарднера Revolution Lifestyle. Это действительно очень красивая тема, выполненная в пастельных тонах. В шаблоне предусмотрены места для рекламы (в шапке и в большой боковой панели). Имеется два!!! выпадающих меню, котрые легко настраиваются. Место для вывода статей достаточно широкое, чтобы обеспечить хорошую читаемость текста.

3 колонки. Боковая колонка состоит из широкой (вверху) и двух узких (внизу)
2 выпадающих настраиваемых меню
Места для рекламы (см. код шаблона)
Русифицирован

Настройки

Меню настраиваются очень просто и задаются простым списком:
<ul id='nav'> <li><a expr:href='data:blog.homepageUrl'>Главная</a></li> <li><a href='#'>Страница 1</a> <ul> <li><a href='#'>Вложеие #1</a> <ul> <li><a href='#'>Ещё глубже #1</a></li> <li><a href='#'>Ещё глубже #2</a></li> <li><a href='#'>Ещё глубже #3</a></li> </ul> </li> <li><a href='#'>Вложеие #2</a></li> <li><a href='#'>Вложеие #3</a></li> <li><a href='#'>Вложеие #4</a></li> <li><a href='#'>Вложеие #5</a></li> </ul> </li> <li><a href='#'>Страница 2</a></li> <li><a href='#'>Страница 3</a></li> </ul>

найдите вышеприведённый код в шаблоне и измените структуру так, как считаете нужным.
Замените символы # на нужные адреса

Второе меню настраивается аналогичным образом.
© minimusX, 2009. При копировании и републикации статьи ссылка на первоисточник обязательна.

Серия шаблонов Revolution Code для Blogger-блога

noreply@blogger.com (minimus) — Thu, 08 Jan 2009 06:04:42 PST

На сегодняшний день серия тем для Wordpress Revolution является самой популярной в среде Wordpress блоггеров. Но и Blogger-блоговоды не отстают ... Я давно хотел опубликовать свою коллекцию шаблонов Blogger Revolution. Эти темы действительно красивы и функциональны. Сегодня я представляю серию шаблонов тем для Blogger Брайана Гарднера Revolution Code. Серия выполнена в трёх цветовых гаммах: голубой, серой и красной.

Revolution Code Blue

Revolution Code Blue
Шаблон темы Blogger в синих тонах.

Русифицирован
3 колонки
Настраиваемое выпадающее меню

Revolution Code Gray

Revolution Code Gray
Шаблон темы Blogger в серых тонах.

Русифицирован
3 колонки
Настраиваемое выпадающее меню

Revolution Code Red

Revolution Code Red
Шаблон темы Blogger в красных тонах.

Русифицирован
3 колонки
Настраиваемое выпадающее меню

Настройки

Меню настраивается очень просто и задаётся простым списком:

найдите вышеприведённый код в шаблоне и измените структуру так, как считаете нужным.
Замените символы # на нужные адреса.

Если Вы в этом не разбираетесь - пишите, задавайте вопросы. Я помогу.
© minimusX, 2009. При копировании и републикации статьи ссылка на первоисточник обязательна.

Универсальный файл-хостинг для блоггера

noreply@blogger.com (minimus) — Tue, 06 Jan 2009 06:49:19 PST

Недавно зашёл на GooglePages и с удивлением обнаружил, что ресурс закрыт для регистрации новых пользователей!

We are no longer accepting new sign-ups for Page Creator because we have shifted our focus to developing Google Sites, which offers many of the capabilities of Page Creator ...

А это значит, что мои рекомендации по размещению файлов кодов и библиотек кодов на этом ресурсе уже не актуальны. А жаль! Новый, рекламируемый Google'ем ресурс, Сайты Google тоже не очень-то хорош (в свете рассматриваемой темы). Кроме того, я уже знаю нескольких блоггеров, пострадавших (забаненных) за не целевое использование ресурса Страницы Google.

В общем, c помощью поисковика Google, я нашёл ресурс, который удовлетворяет заданным требованиям. К сожелению, я нашёл только один такой ресурс. Это - FileAve.

Вот что написано на главной странице FileAve:

Host 50 MB of your video's, music, and images for use anywhere - free! Perfect for MySpace, eBay, LiveJournal, Xanga, photographers, sharing your files, homework, and more.

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

Что предлагает ресурс:

50МБ дискового пространства
5ГБ bandwidth (ежемесячный траффик)
возможность создавать вложенные папки
прямые линки
FTP-доступ к вашим файлам
возможность создать сайт на ресурсе (это уже лишнее - для сайта параметры слабоваты)

К минусам можно отнести вот это:

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

Удачи!

OnLine статистика в реальном времени

noreply@blogger.com (minimus) — Wed, 31 Dec 2008 09:13:45 PST

Счётчики крупных сервисов, такие как Google Analitics, LiveInternet и т.д., используют многие блоггеры, можно даже сказать все, а вот статистику в реальном времени почему-то немногие ... А тем не менее такая статистика позволяет увидеть реальную картину происходящего на блоге. Вот два, как мне кажется, наиболее интересных виджета.

FEEDJIT

Виджет от FEEDJIT "Live traffic feed" позволяет отслеживать траффик (последние 10 посетителей) в любой момент непосредственно на блоге или перейдя на сайт сервиса по ссылке виджета "Watch in Real-Time" (в предпоследней строке). Информация выдаётся в текстовом виде (кроме флагов принадлежности), что весьма благотворно сказывается на скорости загрузки виджета. Регистрация на сайте сервиса не требуется - просто установите виджет в своём блоге и информация о посещениях сразу же начнёт отображаться в теле виджета. Установка производится стандартно - через гаджет Blogger'а HTML/javascript или автоустановкой, что, в общем-то, одно и то-же. Если Вы не хотите, чтобы информация о Ваших посещениях выводилась в виджет, кликните Options и выберите Ignore my browser (необходимо включать для каждого броузера отдельно).Для просмотра карты стран посетителей - там же выберите Life Traffic Map. Для просмотра самых посещаемых страниц за текущий день выберите Options-Popular Pages Today.

Кроме виджета "Live traffic feed", на сайте сервиса можно найти ещё три неплохих статистических виджета:

Live Traffic Map (карта траффика) - выводит карту мира и обозначает страны из которых пришли посетители.
Recommended Readings (рекомендуемые статьи) - По специальной технологии (посещение + время на странице) определяет самые читаемые статьи. !!! Работает при траффике не менее 20-ти уникальных страниц в день !!!
Page Popularity (популярность статей) - популярность страниц по посещениям.

Рекомендую! Сам пользуюсь ...

NeoWORX

Нереально красивый flash-виджет NeoCounter от NeoWORX. Настолько красивый, что я установил его на свой блог, несмотря на то, что у меня уже стоит виджет от FEEDJIT. Этот виджет, так-же как и предыдущий, показывает посещаемость сайта в реальном времени. Имеется множество настроек, как по выводу информации (по городам, по странам и т.п.), так и по внешнему виду (без скина, с анимированным flash-скином (большой выбор), размер и т.п.). Можно даже настраивать флаги и выводимый текст, но, к сожалению, на сегодняшний день русский язык не поддерживается. Для установки виджета требуется регистрация, однако процесс этот не сложный - от Вас потребуется e-mail и пароль. Сразу после установки виджета, Ваш блог появится в боковой колонке "My newest friends" сайта ресурса (ко мне даже кто-то зашёл), но не надолго - пока новые пользователи не вытеснят ваш блог из стека. Информация начинает выводится немедленно после регистрации.

Информация выводится в виде текста и флагов стран посетителей. При наведении курсора мыши на флаг выводится карта страны посетителя. Более полная статистика отслеживается на сайте ресурса в Вашем аккаунте

или в специальном тулбаре Вашего броузера, который Вы можете загрузить (по желанию) на сайте. На сегодняшний день доступны тулбары для FireFox и Internet Explorer.

Для "фанатов этого дела" существует мобильная (mobile) версия тулбара, позволяющая отслеживать траффик своего блога в любое время дня и ночи, в любой точке земного шара.

В member area Вы увидете, что виджет находится в trial состоянии на ближайшие двадцать дней. Не пугайтесь - после истечения триального периода Вам будет предложено несколько вариантов использования в том числе и бесплатный (25 000 посещений вашего блога в месяц).

Кроме виджета NeoCounter NeoWORX предлагает ещё шесть статистических виджетов, очень интересных и изумительно красивых:

Короче! Лучше увидеть своими глазами! Не поленитесь - зайдите, не пожалеете.

Новый FeedBurner

noreply@blogger.com (minimus) — Sat, 27 Dec 2008 08:20:43 PST

Появился новый FeedBurner. Зайдя в Google AdSense обнаружил новое предложение - создать канал для фида. После этого появилось предложение перевести фид-канал из FeedBurner в Google FeedBurner. Что я и сделал.

Суть та же, что и в старом FeedBurner, за исключением того, что в фид теперь добавляется реклама от AdSense. Тем кто планирует регистрацию на FeedBurner, рекомендую сразу регистрироваться на новом FeedBurner.
P.S. Вроде решилась проблема с русскоязычным названием фида. Поживём - увидим.

Виджет Active Commentators (Активные комментаторы) для Blogger

noreply@blogger.com (minimus) — Thu, 25 Dec 2008 08:03:54 PST

В одной из ранее опубликованных статей, я представлял виджет Top Commentators, написанный на YAHOO Pipes автором блога Assess My Blog. Однако, являясь сторонником Открытых кодов (Open Source) и, справедливо полагая, что виджет, являющийся частью блога, работает быстрее (не обращается к "третьему" сервису), я написал свой виджет "Активные комментаторы" ("Active Commentators"), который и представляю в этой статье.

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

Установка

Устанавливается, как содержимое стандартного гаджета Blogger HTML/JavaScript.

Код виджета:
 <div id="mx-ac"></div> <script type="text/javascript"> var maxList = 5; // Количество позиций в списке активных комментаторов var sFilter = ""; // Фильтр комментаторов. Разделять запятыми БЕЗ ПРОБЕЛОВ! var baseUrl = "http://minimusx.blogspot.com/"; // URL блога. var commentsUrl = "feeds/comments/default?alt=json-in-script&callback=listComments"; var aFilter = sFilter.split(","); function oCommentator (name, url, num) { this.name = name; this.url = url; this.num = num; } function doGetComments () { var container = document.getElementById("mx-ac"); var srcComm = document.createElement("script"); srcComm.type = "text/javascript"; srcComm.src = baseUrl + commentsUrl; container.appendChild(srcComm); } function isInFilter(str){ for (var i = 0; i < aFilter.length; i++) { if (str == aFilter[i]) return(true); } return(false); } var aCommentators = new Array(); function listComments (root) { var feed = root.feed; var entries = feed.entry || []; var maxNum = 0; for (var i = 0; i < entries.length; ++i) { var entry = entries[i]; var isInList = new Boolean(); var numInList = 0; if ((entry.author[0].name.$t != "Anonymous") & (!isInFilter(entry.author[0].name.$t))) { var name = entry.author[0].name.$t; var url = entry.author[0].uri.$t; if (aCommentators.length == 0) { aCommentators.push(new oCommentator(name, url, 1)); maxNum = 1; } else { for (var j = 0; j < aCommentators.length; j++) { isInList = false; if ((aCommentators[j].name == name) & (aCommentators[j].url == url)) { isInList = true; numInList = j; break; } } if (isInList) { aCommentators[numInList].num++; if (maxNum < aCommentators[numInList].num) maxNum = aCommentators[numInList].num; } else aCommentators.push(new oCommentator(name, url, 1)); } } } var container = document.getElementById("mx-ac"); var divFooter = document.createElement("div"); var aFooter = document.createElement("a"); divFooter.style.fontSize = "x-small"; aFooter.appendChild(document.createTextNode("minimusX")); aFooter.href = "http://minimusx.blogspot.com"; divFooter.appendChild(document.createTextNode("Widget by ")); divFooter.appendChild(aFooter); var numList = 0; for (var i = maxNum; i > 0; i--) { for (var j = 0; j < aCommentators.length; j++) { if ((aCommentators[j].num == i)) { var br = document.createElement("br"); var a = document.createElement("a"); a.appendChild(document.createTextNode(aCommentators[j].name + " (" + aCommentators[j].num + ")")); a.href = aCommentators[j].url; container.appendChild(a); container.appendChild(br); numList++; } if (numList >= maxList) break; } if (numList >= maxList) break; } container.appendChild(divFooter); } doGetComments(); </script>

Настройка

var maxList = 5; - настройка позиций в списке комментаторов

var sFilter = ""; - фильтр. Если Вы не хотите фильтровать список оставьте как есть. Для фильтрации введите свой псевдоним, или псевдонимы всего коллектива авторов.
Например: var sFilter = "minimus"; или var sFilter = "minimus,Вася Пупкин,alconavt"; Псевдонимы разделяйте запятыми БЕЗ ПРОБЕЛОВ!

var baseUrl = "http://minimusx.blogspot.com/"; - URL Вашего блога. Обратный слэш в конце - ОБЯЗАТЕЛЕН!

Графика для блога. Blogger Icons Set Pack

noreply@blogger.com (minimus) — Thu, 25 Dec 2008 08:04:21 PST

Вот нарисовал пару иконок для Blogger ...

Blogger Icons Set v1.0 Pack
10 изображений в формате PNG (256x256, прозрачный фон). 391 KB

Blogumus – анимированный виджет Облако тегов для Blogger

noreply@blogger.com (minimus) — Fri, 13 Mar 2009 01:29:35 PDT

Blogumus – анимированный (.swf) Blogger-виджет, “родной брат” очень популярного WordPress-виджета Cumulus, написанного Роем Танком (Roy Tanck). Виджет выводит облако тегов в виде сферы, вращающейся при наведении на неё курсора мыши. Версия виджета 1.14 от 17.09.2008

Установка

Скачать со страницы блога "Блоговод" и распаковать файл архива локализованной версии Blogumus. Полученные файлы закачать на какой-нибудь хост (например Google Pages).
Установить код виджета в тему (только XML-тема!). Для этого зайти в Панель управления, Макет-Изменить HTML (не устанавливая флажок “Расширить шаблоны виджета”) и найти код начала секции навигационной панели: <b:section class='sidebar' id='sidebar' preferred='yes'>. Вставить код виджета либо сразу после этой строки, либо, если Вы не хотите, чтобы этот виджет был первым, после какого-либо другого виджета в секции навигации.
Настроить код виджета для использования в своём блоге.

Код виджета:

<b:widget id='Label99' locked='false' title='Labels' type='Label'>
  <b:includable id='main'>
    <b:if cond='data:title'>
      <h2><data:title/></h2>
    </b:if>
    <div class='widget-content'>
      <script src='http://rublezoid.googlepages.com/swfobject.js' type='text/javascript'/>
      <div id='flashcontent'>Blogumulus by <a href='http://www.roytanck.com/'>Roy Tanck</a> and <a href='http://www.bloggerbuster.com'>Amanda Fazani</a></div>
      <script type='text/javascript'>
        var so = new SWFObject("http://rublezoid.googlepages.com//tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");
        // uncomment next line to enable transparency
        //so.addParam("wmode", "transparent");
        so.addVariable("tcolor", "0x333333");
        so.addVariable("mode", "tags");
        so.addVariable("distr", "true");
        so.addVariable("tspeed", "100");
        so.addVariable("tagcloud", "<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>");
        so.addParam("allowScriptAccess", "always");
        so.write("flashcontent");
      </script>
      <b:include name='quickedit'/>
    </div>
  </b:includable>
</b:widget>

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

Настройка

По умолчанию Blogumus настроен следующим образом:

ширина: 240px
высота: 300px;
цвет фона: белый
цвет текста: серый
размер шрифта: "12"

Для изменения ширины и высоты найдите следующую строку кода и внесите необходимые изменения:

var so = new SWFObject("http://rublezoid.googlepages.com/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");

для альтернативного варианта:

<object type="application/x-shockwave-flash" data="http://rublezoid.googlepages.com/tagcloud.swf" width="250" height="200" allowscriptaccess="always" >

Для изменения цвета фона, найдите и измените следующий код:

var so = new SWFObject("http://rublezoid.googlepages.com/tagcloud.swf", "tagcloud", "240", "300", "7", "#ffffff");

для альтернативного варианта:

<param name="bgcolor" value="#ffffff" />

Для изменения цвета текста, найдите и измените следующий код:

so.addVariable("tcolor", "0x333333");

для альтернативного варианта:

<param name="flashvars" value="tcolor=0x000000&mode=tags&distr=true&tspeed=100&tagcloud=<tags>

Для изменения размера шрифта, найдите и измените следующий код:

so.addVariable("tagcloud", "<tags><b:loop values='data:labels' var='label'><a expr:href='data:label.url' style='12'><data:label.name/></a></b:loop></tags>");

для альтернативного варианта:

<a expr:dir='data:blog.languageDirection' expr:href='data:label.url' style='12'>

Update 17.01.2009: Исправлена ошибка перехода по русскоязычным линкам.

Виджет Most Commented Posts (Популярные статьи) для Blogger

noreply@blogger.com (minimus) — Thu, 08 Jan 2009 02:39:32 PST

Вообще-то название “Most Commented Posts” лучше переводить, как “Наиболее комментируемые статьи”, но в ру-нете почему-то принято называть “Популярные статьи”, хотя популярность и комментируемость не всегда идут “рука об руку”. Этот виджет широко используют блоггеры, ведущие свои блоги на платформе WordPress, а вот на платформе Blogger мне этот виджет не попадался, за исключением виджета использующего YAHOO Pipes от BloggerBuster, но он, к сожалению, выводит в список URL, а не названия статей, что, как мне кажется, не вполне профессионально. Я попытался исправить этот дисбаланс.

Описание:

Виджет выводит список наиболее комментируемых статей в порядке убывания числа комментариев. Устанавливается одним “копи-пастом” (copy-paste). Минимальное количество настроек позволяет использовать виджет даже неискушенным в кодировании блоггерам ;-)

Установка:

Установка производится в три шага:

Зайдите в “Панель управления” вашего блога. Перейдите на закладку Макет-Элементы страницы.
Добавьте на панели гаджетов новый гаджет HTML/JavaScript. Дайте ему название (например: “Популярные статьи”). Вставьте код виджета.
Проведите настройку виджета. Сохраните виджет, а затем и сам макет.

Код виджета:

<div id="mx-mcp"></div>

var postsUrl = "feeds/posts/default?alt=json-in-script&callback=listPosts&max-results=" + maxResults;
  var commentsUrl = "feeds/comments/default?alt=json-in-script&callback=listCommentss&max-results=" + maxResults;

function oPost(title, url, num) {
    this.title = title;
    this.url = url;
    this.num = num;
  }

function doSrcMcp() {
    var container = document.getElementById("mx-mcp");
    var srcP = document.createElement("script");
    var srcC = document.createElement("script");

srcP.type = "text/javascript";
    srcC.type = "text/javascript";
    srcP.src = baseUrl + postsUrl;
    srcC.src = baseUrl + commentsUrl;
    container.appendChild(srcP);
    container.appendChild(srcC);
  }

var aPosts = new Array();
  var aComments = new Array();

function listPosts(root) {
    var feed = root.feed;
    var entries = feed.entry || [];

for (var i = 0; i < entries.length; ++i) {
      var entry = entries[i];
      var title = entry.title.$t;
      var url = "";

for (var j = 0; j < entry.link.length; j++) {
        if (entry.link[j].rel == 'alternate') url = entry.link[j].href;
      }
      aPosts.push(new oPost(title, url, 0));
    }
  }

function listComments(root) {
    var feed = root.feed;
    var entries = feed.entry || [];
    var maxNum = 0;

for (var i = 0; i < entries.length; ++i) {
      var entry = entries[i];
      var url = "";

for (var j = 0; j < entry.link.length; j++) {
        if (entry.link[j].rel == 'alternate') url = entry.link[j].href;
      }
      aComments.push(url);
    }
    for (var i = 0; i < aPosts.length; i++) {
      for (var j = 0; j < aComments.length; j++) {
        if (aComments[j].indexOf(aPosts[i].url) == 0) aPosts[i].num++;
        if (aPosts[i].num > maxNum) maxNum = aPosts[i].num;
      }
    }
    var container = document.getElementById("mx-mcp");
    var divFooter = document.createElement("div");
    var aFooter = document.createElement("a");

divFooter.style.fontSize = "x-small";
    aFooter.appendChild(document.createTextNode("minimusX"));
    aFooter.href = "http://minimusx.blogspot.com";
    divFooter.appendChild(document.createTextNode("Widget by "));
    divFooter.appendChild(aFooter);

var numList = 0;
    for (var i = maxNum; i > 0; i--){
      for (var j = 0; j < aPosts.length; j++){
        if (aPosts[j].num == i){
          var br = document.createElement("br");
          var a = document.createElement("a");
          var div = document.createElement("div");

a.appendChild(document.createTextNode(aPosts[j].title));
          a.href = aPosts[j].url;
          div.appendChild(document.createTextNode(" (" + commStr + ": " + aPosts[j].num + ")"));
          container.appendChild(a);
          container.appendChild(br);
          container.appendChild(div);
          numList++;
        }
        if (numList >= maxList) break;
      }
      if (numList >= maxList) break;
    }
    container.appendChild(divFooter);
  }

doSrcMcp();
</script>

Настройка:

URL Вашего блога: var baseUrl = "http://YOUR_BLOG_NAME_HERE.blogspot.com/"; Вставьте URL ВАШЕГО блога. И не забывайте поставить обратный слэш в конце URL!
По умолчание виджет выводит список из пяти позиций: var maxList = 5; измените это значение, если хотите выводить больше или меньше позиций.
Количество комментариев к каждой позиции (статье) выводится строкой (Комментариев: Х): var commStr = "Комментариев";. Для локализации виджета измените этот параметр (например на значение Comments).

Update 08.01.2009: Добавлен параметер для настройки глубины сканирования - maxResults.

Виджет Most Related Posts (Очень похожие статьи) для Blogger

noreply@blogger.com (minimus) — Thu, 25 Dec 2008 08:06:40 PST

Некоторое время назад я опубликовал обзор виджета “Related Posts”. Виджет неплохой, но, как водится, не всё в нём меня устраивало. А именно:

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

В общем, как говорится, “если хочешь, что бы всё было “как надо” – сделай сам”. Я решил последовать этому совету и, вот, что у меня получилось:

виджет Most Related Posts базируется на библиотеке JSON от Google и, следовательно, расположен на одном из самых быстрых серверов в мире
выдача ссылок в список осуществляется по индексу соответствия на базе меток (тегов, labels): чем больше совпадающих меток, тем выше индекс соответствия, тем выше ссылка в списке
ссылка на текущую статью не выводится (не пользуйтесь кавычками в названиях постов – этот глюк RSS может привести к выдаче ссылки на текущую статью в список)
виджет устанавливается “одним кликом” (copy-paste)

Инструкция по установке

Скопируйте приведённый ниже код и вставьте его в шаблон темы непосредственно после кода <data:post.body/>. Если же Вы пользуетесь Fullpost, то после кода <data:post.body /> <b:if cond="data:blog.pageType != "item""> <a expr:href="data:post.url">Read more!</a> </b:if>

Код виджета:

<div><b:if cond='data:blog.pageType == "item"'>
  <div class='widget-content'>
    <br/><br/><h3>Most Related Posts</h3>

function initialize() {
      var aLabels = new Array();
      var sLabel = "";
      var postTitle = "";

<b:loop values='data:posts' var='post'>
        <b:loop values='data:post.labels' var='label'>
          sLabel = "<data:label.name/>";
          aLabels.push(sLabel);
        </b:loop>
        postTitle = "<data:post.title/>"
      </b:loop>

var num = 100; // глубина сканирования
      var maxList = 5; //максимальное количество постов в списке

var feed = new google.feeds.Feed("YOUR_FEED_URL");
      var maxRelIndex = 0;

feed.setNumEntries(num);
      feed.load(function(result) {
        if (!result.error) {
          var aTitles = new Array();
          var aHRefs = new Array();
          var aRelIndex = new Array();

var relIndex = 0;

Виджет настроен на сканирование последних 100 статей (var num = 100;) и вывода в список 5-ти ссылок (var maxList = 5;) на похожие статьи. Не забудьте изменить строку YOUR_FEED_URL на url feed’а Вашего блога.

Я играю в Blogowar.ru, чего и вам советую.

Подсветка кодов в блоге. Часть вторая.

noreply@blogger.com (minimus) — Thu, 25 Dec 2008 08:07:08 PST

Вернёмся к нашим баранам. Продолжим обзор инструментов для подсветки синтаксиса исходных кодов начатый в предыдущей статье.

Google Code Prettifier

Google Code Prettifier – простой и лёгкий инструмент. Поддерживает C (C, C++, C#), Java, Python, Bash, SQL, HTML, XML, CSS, Javascript, и Make-файлы.

Не тормозит загрузку страницы.
Работает на любых платформах.
Возможно использование встроенных ссылок (в строках комментариев)
Возможна нумерация строк
Возможно изменение цветовой схемы (изменить CSS-файл)

Скриншот:

Инструкция по установке

Вставьте показанный ниже код в секцию head (например перед закрывающим тегом).

Измените открывающий тег body следующим образом:

Для подсветки кода используйте теги <pre class="prettyprint">...</pre> или <code class="prettyprint">...</code>.

Для конкретизации языка подсвечиваемого кода измените значение параметра class с “prettyprint” на “prettyprint lang-спецификатор” (например “prettyprint lang-html”).

Вот перечень доступных спецификаторов: "c", "cc", "cpp", "cs", "cyc", "java", "bsh", "csh", "sh", "cv", "py", "perl", "pl", "pm", "rb", "js", "html", "xhtml", "xml", "xsl".

Для организации нумерации в подсветке исходного кода используется следующий приём:

<pre class=prettyprint> <span class="nocode">1:</span> /* This is line 1 of my code <span class="nocode">2:</span> * and here's line 2 */ <span class="nocode">3:</span> print("I'm line number 3"); </pre>

Syntaxhighlighter

Syntaxhighlighter – мой любимый инструмент, именно им я и пользуюсь. Кроме отличной подсветки и встроенной нумерации этот инструмент так же имеет меню, позволяющее вывести код в отдельном окне в виде простого текста или скопировать его в буфер обмена, что очень удобно для посетителей блога. Инструмент мультиплатформенный – может работать в любых блогах, поддерживающих JavaScript и не только в блогах. Кроме того, имеется дополнение SyntaxHighlighter для Windows Live Writer, позволяющее строить конструкции для Syntaxhighlighter не имеея соответствующих навыков.

Инструкция по установке

Вставьте приведённый ниже код в конец секции body (перед закрывающим тегом):

Для подсветки кода используйте конструкцию
<pre name="code" class="c-sharp">...</pre> или
<textarea name="code" class="c#" cols="60" rows="10">...</textarea>

Параметер name должен обязательно иметь значение “code”, а параметер class должен иметь значение из таблицы “поддерживаемых языков”.

Поддерживаемые языки:

Язык	Псевдонимы (значение параметра class)
C++	`cpp`, `c`, `c++`
C#	`c#`, `c-sharp`, `csharp`
CSS	`css`
Delphi	`delphi`, `pascal`
Java	`java`
Java Script	`js`, `jscript`, `javascript`
PHP	`php`
Python	`py`, `python`
Ruby	`rb`, `ruby`, `rails`, `ror`
Sql	`sql`
VB	`vb`, `vb.net`
XML/HTML	`xml`, `html`, `xhtml`, `xslt`

Я пользуюсь конструкцией (тегами) textarea, т.к. небольшой глюк библиотеки не позволяет использовать меню “копирования в буфер обмена” с тегами pre (пропадают переносы строки).

Внимание! Во всех приведённых примерах объявления внешних файлов приведены без учёта реального расположения оных в сети! Это значит, что в реальных условиях необходимо указывать реальное размещение внешних файлов. Например для файлов prettify, в привязке к моему блогу, необходимо произвести следующие изменения:

Послесловие

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

Подсветка кодов в блоге. Часть первая.

noreply@blogger.com (minimus) — Thu, 25 Dec 2008 08:07:36 PST

Подсветка синтаксиса исходного кода в блоге на сегодняшний день уже не роскошь, а признак хорошего тона. Действительно, подсвеченный синтаксис не только смотрится респектабельней по сравнению с неподсвеченным, но и существенно лучше читается и поддается анализу. Разумеется “спрос рождает предложение”. Инструментов в этой области уже придумано немало и именно об этих инструментах моя очередная статья.

Инструментарий используемый для подсветки синтаксиса исходных кодов можно разделить на две категории (по способу обработки) – на статические и динамические.

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

Перейдём к конкретным инструментам.

Статические

Среди статических инструментов чаще всего встречаются add-on’s и plug-in’s для блог-клиентов, как встроенные, так и подгружаемые. Поскольку я, в некотором роде, являюсь поклонником Windows Live Writer, то, в качестве примера, приведу несколько дополнений для WLW.

Code Snippet plugin for Windows Live Writer – вставка и подсветка синтаксиса исходного кода.

Insert Source Code Snippet – вставка и подсветка кода из буфера обмена, скопированного из Visual Studio или какого либо другого инструмента разработчика.

Кроме дополнений к блог-клиентам существуют сетевые сервисы, которые позволяют сделать то-же самое не устанавливая дополнения. Это удобно для тех, кто не пользуется блог-клиентами для написания статей. Вот типичный пример:

Source Code Highlighter – выдаёт подсвеченный код в HTML-коде.

Динамические

highlight.js - подсветка синтаксиса в примерах кода в блогах, форумах и вообще на любых веб-страницах. Пользоваться им очень просто, потому что работает он автоматически: сам находит блоки кода, сам определяет язык, сам подсвечивает.

Скриншот:

Поддерживается подсветка следующих языков:

Python
Ruby
Perl
PHP
XML
HTML
CSS
Django
Javascript
VBScript
Delphi
Java
C++
Lisp
RenderMan (RSL и RIB)
Maya Embedded Language
SQL
SmallTalk
Axapta
1С
Ini
Diff
DOS .bat
Bash

Инструкция по установке

WordPress – для установки highlight.js в WordPress в комплекте поставки есть соответствующий плагин.

Для установки плагина надо скопировать всю директорию с файлами highlight.js в директорию плагинов WordPress. После этого в панели плагинов его можно будет включать и отключать. В меню Options также добавляется страничка highlight.js, где можно настраивать список языков и CSS-стили.

Blogger – для установки highlight.js в Blogger (XML тема) необходимо вставить следующий код, где-нибудь в районе закрывающего тега body (перед тегом).

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

Полный список классов для разных языков приведен в readme.rus.txt.

Для определения цветов подсветки используйте следующий код:

разместите его перед закрывающим тегом head.

Использование

В тексте статьи для подсветки синтаксиса исходного кода используйте следующую конструкцию:

для принудительного использования подсветки конкретного языка или для отказа от подсветки используйте параметр class тега code:

P.S. Продолжение следует. У меня есть в запасе ещё пара неплохих прибомбасов на эту тему.

Виджет “Динамическая страница содержания” для блога

noreply@blogger.com (minimus) — Thu, 25 Dec 2008 08:08:02 PST

Виджет “Динамическая страница содержания” (Dynamic Contents Page) позволяет динамически обновлять страницу содержания блога, созданную для облегчения навигации по какой-либо теме постов. Как это работает можно посмотреть выбрав в меню моего блога пункт “Виджеты”

На странице “Виджеты” отображаются ссылки на все мои статьи связанные с виджетами.

При добавлении новых статей с меткой (label) “виджет” (для моей страницы), ссылки на них будут добавлены в содержание автоматически. Другими словами, виджет работает по принципу “установил и забыл”.

Виджет является платформонезависимым и может использоваться на любой платформе позволяющей использование JavaScript.

Инструкция по установке

Код:

google.load("feeds", "1");

google.setOnLoadCallback(initialize);

</script>

Вариант 1:

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

Вариант 2:

Показанный выше код вставьте непосредственно в текст поста используемого в качестве страницы содержания. Для этого необходимо выбрать режим редактирования HTML.

Код для страницы:

Для обоих вариантов установки необходимо разместить следующий код на странице поста статьи-содержания:

В варианте 2 этот код необходимо вставить ниже кода скрипта.

Настройки

Найдите в тексте кода скрипта текст YOUR_FEED_URL и замените его на URL фида вашего блога (для блогов Blogger этот URL выглядит приблизительно так: http://minimusx.blogspot.com/feeds/posts/default).

class="виджет" – в “коде для страницы” измените значение параметра class на значение метки (label) по которой вы определяете вхождение поста в данный список постов.

var num = 100; – глубина сканирования. Если в Вашем блоге всего 100 статей, нет смысла устанавливать глубину сканирования 10 000!

Удачи!

adadae0f-a0f4-4072-981f-2bede04fd9b3

Виджет Top Commentators (Лучшие Комментаторы) для Blogger

noreply@blogger.com (minimus) — Thu, 25 Dec 2008 08:08:35 PST

Этот виджет выводит топ самых активных комментаторов блога, анализируя последние 500 комментариев. В отличии от других виджетов этого типа, этот виджет имеет возможность фильтрации комментаторов (например можно отсеять собственные комментарии). Виджет базируется на YAHOO Pipes. Устанавливается очень просто: как содержимое стандартного виджета Blogger HTML/JavaScript.

Исправьте нижеследующий код. Вместо YOUR_BLOG_URL вставьте URL вашего блога, а вместо NICK_NAME_FILTER ваш ник или несколько ников через запятую.

Виджет Related Posts by Categories (Похожие статьи по категориям) для Blogger'а

noreply@blogger.com (minimus) — Thu, 25 Dec 2008 08:09:02 PST

Ещё один виджет из серии “Related Posts”. Этот виджет мне нравится даже больше чем тот, что я описывал в предыдущей статье. Виджет разработан Hoctro, слегка переработан для удобства Джеком и доработан мной для устранения бага, связанного с использованием виджета в Unicode блогах (non-English).

Инструкция по установке

Зайдите в Панель инструментов > Макет > Изменить HTML, установите флажок “Расширить шаблоны виджета”, найдите код <p><data:post.body /></p> и вставьте код, представленный ниже, сразу после найденного кода.

<b:if cond='data:blog.pageType == "item"'><br />
 <div class='similiar'><br />
  <br />
  <br />
<br />
  <br />
  <br />
  <br />
<br />
  <div class='widget-content'><br />
  <h3>Related Posts by Categories</h3><br />
  <div id='data2007'/><br/><br/><br />
   <div id='hoctro'><br />
    Widget by <u><a href='http://hoctro.blogspot.com'>Hoctro</a></u> | <u><a href='http://www.jackbook.com/' title='Related Posts on Blogger Modified by JackBook.Com. Read More?'>Jack Book</a></u> | <u><a href='http://minimusx.blogspot.com/' title='Related Posts on Blogger Modified by minimusX Read More?'>minimusX</a></u><br />
   </div><br />
   <script type='text/javascript'><br />
<br />
   var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;<br />
   var maxNumberOfPostsPerLabel = 4;<br />
   var maxNumberOfLabels = 10;<br />
<br />
   <b:if cond='data:blog.pageType == "item"'><br />
    maxNumberOfPostsPerLabel = 100;<br />
    maxNumberOfLabels = 3;<br />
   </b:if><br />
   <br />
<br />
<br />
   function listEntries10(json) {<br />
     var ul = document.createElement(&#39;ul&#39;);<br />
     var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ? <br />
                    json.feed.entry.length : maxNumberOfPostsPerLabel;<br />
     for (var i = 0; i &lt; maxPosts; i++) {<br />
       var entry = json.feed.entry[i];<br />
       var alturl;<br />
<br />
       for (var k = 0; k &lt; entry.link.length; k++) {<br />
         if (entry.link[k].rel == &#39;alternate&#39;) {<br />
           alturl = entry.link[k].href;<br />
           break;<br />
         }<br />
       }<br />
       var li = document.createElement(&#39;li&#39;);<br />
       var a = document.createElement(&#39;a&#39;);<br />
       a.href = alturl;<br />
<br />
    if(a.href!=location.href) {<br />
     var txt = document.createTextNode(entry.title.$t); <br />
     a.appendChild(txt);<br />
     li.appendChild(a);<br />
     ul.appendChild(li); <br />
    }<br />
     }<br />
     for (var l = 0; l &lt; json.feed.link.length; l++) {<br />
       if (json.feed.link[l].rel == &#39;alternate&#39;) {<br />
         var raw = json.feed.link[l].href;<br />
         var label = decodeURI(raw.substr(homeUrl3.length+13));<br />
         var k;<br />
         for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;);<br />
         var txt = document.createTextNode(label);<br />
         var h = document.createElement(&#39;b&#39;);<br />
         h.appendChild(txt);<br />
         var div1 = document.createElement(&#39;div&#39;);<br />
          div1.appendChild(h);<br />
         div1.appendChild(ul);<br />
         document.getElementById(&#39;data2007&#39;).appendChild(div1);<br />
       }<br />
     }<br />
   }<br />
   function search10(query, label) {<br />
<br />
   var script = document.createElement(&#39;script&#39;);<br />
   script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;<br />
    + label +<br />
   &#39;?alt=json-in-script&amp;callback=listEntries10&#39;);<br />
   script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);<br />
   document.documentElement.firstChild.appendChild(script);<br />
   }<br />
<br />
   var labelArray = new Array();<br />
   var numLabel = 0;<br />
<br />
   <b:loop values='data:posts' var='post'><br />
     <b:loop values='data:post.labels' var='label'><br />
       textLabel = &quot;<data:label.name/>&quot;;<br />
       <br />
       var test = 0;<br />
       for (var i = 0; i &lt; labelArray.length; i++)<br />
       if (labelArray[i] == textLabel) test = 1;<br />
       if (test == 0) { <br />
          labelArray.push(textLabel);<br />
          var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ? <br />
                 labelArray.length : maxNumberOfLabels;<br />
          if (numLabel &lt; maxLabels) {<br />
             search10(homeUrl3, textLabel);<br />
             numLabel++;<br />
          }<br />
       }<br />
     </b:loop><br />
   </b:loop><br />
   </script><br />
  </div><br />
<br />
 </div><br />
</b:if><br />

Сохраните шаблон и посмотрите на результат.

Настройки виджета

Две переменные, показанные ниже, позволяют управлять внешним видом и временем загрузки виджета

maxNumberOfPostsPerLabel – количество статей выводимых по каждой категории.

maxNumberOfLabels – глубина сканирования статей на предмет соответствия теме. Чем глубже копаешь, тем больше найдёшь. С другой стороны – чем глубже копаешь, тем дольше получаешь результат. Здесь главное найти “золотую середину”.

P.S. Пока готовил статью к публикации, Hoctro внёс изменения в свой виджет. Изменения фактически идентичны моим, разница лишь в названии функции – результат тот-же.

Графика для блога

noreply@blogger.com (minimus) — Thu, 25 Dec 2008 08:09:23 PST

Несколько наборов иконок RSS от FastIcons. Весь баласт убран – только изображения в формате PNG (256х256, прозрачный фон). Как изменить размер изображения, надеюсь все знают.

Нестандартные логотипы RSS

Нестандартные логотипы RSS
8 изображений в формате PNG (256x256, прозрачный фон). 335 KB

Разноцветные круглые логотипы RSS

Разноцветные круглые логотипы RSS
4 цвета. 4 изображения в формате PNG (512x512, прозрачный фон). 224 KB

3D логотип RSS

3D логотип RSS
1 изображение в формате PNG (128x128, прозрачный фон). 12,5 KB

Логотипы социальных сетей

Логотипы социальных сетей
23 изображения в формате PNG (256x256, прозрачный фон) . 550 KB

Виджет Related Posts (“Другие статьи по теме”) для Blogger

noreply@blogger.com (minimus) — Sun, 03 Aug 2008 06:49:30 PDT

Наличие в блоге виджета “другие статьи по теме” (Related Posts) очень сильно влияет на привлечение качественного траффика. Весьма часто читатель, придя на блог и убедившись в полезности прочитанной статьи, ищет дополнительную информацию по интересющей его теме и, не сумев найти, даже если эта информация в блоге имеется, уходит туда, где, как ему кажется, она есть. Поэтому виджет Related Posts весьма востребован в среде блоггеров. Увы, в Blogger’е такой “стандартный” виджет отсутствует, но всё, что нужно для его создания, есть. Приступим …

Виджет, который мы сейчас создадим, использует технологию JSON (подробнее о JSON можно прочитать здесь) и информацию “стандартного” виджета Labels (не того, что показывает все метки (категории) блога, а того, который показывает метки статьи). Для того что бы перейти непосредственно к установке виджета, не обходимо убедиться, что шаблон темы готов к нашим манипуляциям. Зайдите в Панель инструментов > Макет > Элементы страницы и убедитесь, что секция статей блога выглядит так:

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

необходимо внести в шаблон темы некоторые небольшие изменения. Зайдите в Панель инструментов > Макет > Изменить HTML и найдите в коде шаблона следующие строки

и замените значение параметра showaddelement с no на yes. Теперь эти строки должны выглядеть так:

Зайдите на страницу “Добавить элементы страницы” и убедитесь, что секция статей блога выглядит так же, как на первом изображении. Если это так, Вы готовы к установке виджета.

Инструкция по установке

Зайдите в Панель инструментов > Макет > Изменить HTML и вставьте код, представленный ниже, в секцию head шаблона (где-нибудь перед закрывающим тегом /head)

Сохраните шаблон. Установите флажок “Расширить шаблоны виджета” и найдите следующий код:

и замените его на следующий:

Ещё раз сохраните шаблон и перейдите на страницу “Добавить элементы страницы”. В секции “Сообщения блога” добавьте новый HTML/Javascript виджет. В поле “Заголовок” введите что-то вроде “Другие статьи по этой теме:”, а в поле “Содержание” следующий код:

Сохраните шаблон и вернитесь на страницу “Изменить HTML”. Установите флажок “Расширить шаблоны виджета” и найдите код только что установленного виджета (виджет не обязательно будет называться HTML13, как в примере). Внесите изменения (две строки) как показано ниже:

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

Если что-то не сложилось, значит Вы что-то пропустили или упустили. У меня всё работает.

Форма отправки комментариев на странице поста в Blogger

noreply@blogger.com (minimus) — Thu, 25 Dec 2008 08:10:21 PST

В настоящее время Blogger разрабатывает форму отправки комментариев, которую можно будет размещать на странице поста. Многие блоггеры очень ждут когда настанет этот момент. Однако уже сейчас существует возможность установить такую форму в свой блог, используя Blogger in Draft.

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

На странице Настройки > Комментарии установите “Размещение формы для ввода комментариев” как показано ниже:

Сохраните настройки.

Вариант 1:

Перейдите на страницу Макет > Изменить HTML. Установите флажок “Расширить шаблоны виджета” и найдите в тексте HTML следующий код:

Замените его следующим кодом:

К сожалению не все шаблоны поддерживают этот вариант размещения формы отправки комментариев.

Вариант 2:

Всё тоже самое. Перейдите на страницу Макет > Изменить HTML. Установите флажок “Расширить шаблоны виджета” и найдите в тексте HTML следующий код:

Сразу же после этой строки кода вставьте следующую строку:

Этот вариант должен работать со всеми шаблонами.

В результате манипуляций по варианту 1 или варианту 2 на страницах постов должна появиться следующая форма:

Если что-то “не сложилось”, убедитесь, что в настройках действительно стоит “Размещение формы для ввода комментариев” – “Вложенное ниже сообщение”. Если совсем ничего не получается, пишите – разберёмся.

iTheme-Techno. Серия XML тем для Blogger

noreply@blogger.com (minimus) — Thu, 25 Dec 2008 08:10:52 PST

Шаблон темы iTheme Techno для Blogger выполнен в стиле интерфейса Mac OS, с перемещаемыми панелями виджетов (именно в этой теме впервые была применена технология плавающих панелей для Blogger) и мини иконками. Оригинальная тема разработана Nick La.

Скачивая и используя этот шаблон темы, Вы соглашаетесь со следующими условиями использования:

Вы НЕ МОЖЕТЕ продавать или перепродавать этот шаблон
Линки на N.Design Studio , Magznetwork и minimusX расположенные внизу шаблона ДОЛЖНЫ оставаться на месте (модифицированные или немодифицированные)
Вы МОЖЕТЕ использовать этот шаблон как в личных, так и в коммерческих проектах
Вы МОЖЕТЕ изменять, переводить и распространять этот шаблон темы

Для того чтобы при установке темы не возникло каких-либо проблем, внимательно ознакомьтесь с инструкцией по установке.

Инструкция по установке

Скачайте и распакуйте zip файл.
Закачайте все изображения на ваш аккаунт GooglePages или на какой-либо фото-хостинг.
Если закачали на GooglePages замените все встречающиеся в коде XML url http://YOURGOOGLEPAGES.googlepages.com на имя Вашего аккаунта. В противном случае - на фактические url изображений.
Зайдите в Панель управления Blogger.
Перейдите в Макет > Изменить HTML.
Загрузите XML-файл шаблона (ни в коем случае не используйте Copy-Paste)
Сохраните но НЕ ПРОСМАТРИВАЙТЕ, перейдите в Макет > Элементы страницы.
Измените элемент (виджет) Top Menu. Добавьте хотя бы один элемент, например линк на главную страницу Вашего блога.
Измените элемент (виджет) Свежие Статьи – измените RSS канал на канал Вашего блога.
Измените элемент (виджет) Свежие Комментарии – измените RSS канал комментариев на канал комментариев Вашего блога.
Сохраните изменения и перейдите в Настройки > Форматирование. Выберите Формат отметки времени вида День недели-Месяц-Число-Год. Это необходимо для правильного отображения даты в иконке даты статьи.
Сохраните изменения. Можно смотреть полученный результат.

ЧАВО

Почему в иконке даты пишется Undefined?
Смотрите пункт 11 инструкции по установке. Перейдите в Настройки > Форматирование. Выберите Формат отметки времени вида День недели-Месяц-Число-Год.

У меня нет времени на поиск хостинга для картинок. Чем Вы можете мне помочь?
Замените все встречающиеся в коде XML url http://YOURGOOGLEPAGES.googlepages.com на http://rublezoid.googlepages.com Там есть все необходимые изображения, но в этом случае Вы будете зависеть от моего желания поддерживать хранение этих изображений на сервере.

Скачать

iTheme-Techno 2 колонки (01)

Скачать iTheme-Techno (01)

1. Русифицированная, 2 колонки, колонка виджетов справа
2. Расширенная (FullPost), русифицированная, 2 колонки, колонка виджетов справа

iTheme-Techno 2 колонки (10)

Скачать iTheme-Techno (10)

1. Русифицированная, 2 колонки, колонка виджетов слева
2. Расширенная (FullPost), русифицированная, 2 колонки, колонка виджетов слева

iTheme-Techno 3 колонки (011)

Скачать iTheme-Techno (011)

1. Русифицированная, 3 колонки, обе колонки виджетов справа
2. Расширенная (FullPost), русифицированная, 3 колонки, обе колонки виджетов справа

iTheme-Techno 3 колонки (101)

Скачать iTheme-Techno (101)

1. Русифицированная, 3 колонки, одна колонка виджетов слева, другая - справа
2. Расширенная (FullPost), русифицированная, 3 колонки, одна колонка виджетов слева, другая - справа

iTheme-Techno 3 колонки (110)

Скачать iTheme-Techno 3 колонки (110)

1. Русифицированная, 3 колонки, обе колонки виджетов слева
2. Расширенная (FullPost), русифицированная, 3 колонки, обе колонки виджетов слева

Виджет “Облако тегов” для Blogger’а

noreply@blogger.com (minimus) — Thu, 25 Dec 2008 08:11:19 PST

Практически все блоггеры, использующие платформу WordPress, включают виджет “Облако тегов” в оформление своих блогов. В Blogger’е такого виджета нет. Несправедливо? Несправедливо. Попробуем устранить эту несправедливость …

Этот виджет можно использовать только в “новом стиле” Blogger (XML), в “старом стиле” Blogger виджет работать не будет. Кроме того, виджет имеет один, как мне кажется, некритичный баг, а именно, для корректной работы виджета требуется наличие хотя бы двух статей в блоге имеющих один тег.

Инструкция по установке и описание

Прежде чем устанавливать виджет, обязательно сохраните текущий шаблон на случай если что-то пойдёт не так как этого хотелось.

Код виджета состоит из трёх частей. Предстоит внести изменения в секции определения стилей и конфигурации, а также заменить код уже существующего виджета “Labels”. Если виджет “Labels” не стоит в макете Вашего блога, его необходимо добавить до начала внесения изменений.

Для внесения первой части кода в шаблон темы, в секцию определения стилей, необходимо найти в тексте шаблона следующий код:

]]></b:skin>

и вставить нижеследующий код выше найденного кода.

Следующая часть кода виджета должна располагаться в секции конфигурации. Проще всего разместить его там – это вставить нижеследующую часть кода после строки ]]></b:skin>, но до тага </head>

Третья часть работы состоит в замене самого виджета “Label”. Спуститись вниз по тексту шаблона темы и найдите код, который должен выглядеть приблизительно так:

<b:widget id='Label1' locked='false' title='Метки' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
    <h2><data:title/></h2>
</b:if>
<div class='widget-content'>
    <ul>
    <b:loop values='data:labels' var='label'>
      <li>
        <b:if cond='data:blog.url == data:label.url'>
          <span expr:dir='data:blog.languageDirection'>
            <data:label.name/>
          </span>
        <b:else/>
          <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'>
            <data:label.name/>
          </a>
        </b:if>
        <span dir='ltr'>(<data:label.count/>)</span>
      </li>
    </b:loop>
    </ul>

<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>

Выделите и замените его на нижеследующий код:

<b:widget id='Label1' locked='false' title='Облако тегов' type='Label'><br />
<b:includable id='main'><br />
<b:if cond='data:title'><br />
<h2><br />
<data:title></data></h2><br />
</b:if><br />
<div class='widget-content'><br />
<div id='labelCloud'></div><br />
<script type='text/javascript'><br />
// Don't change anything past this point -----------------<br />
// Cloud function s() ripped from del.icio.us<br />
function s(a,b,i,x){<br />
      if(a>b){<br />
          var m=(a-b)/Math.log(x),v=a-Math.floor(Math.log(i)*m)<br />
             }<br />
      else{<br />
          var m=(b-a)/Math.log(x),v=Math.floor(Math.log(i)*m+a)<br />
          }<br />
      return v<br />
   }<br />
var c=[];<br />
var labelCount = new Array();  <br />
var ts = new Object;<br />
<b:loop values='data:labels' var='label'><br />
var theName = "<data:label.name></data>";<br />
ts[theName] = <data:label.count></data>;<br />
</b:loop><br />
for (t in ts){<br />
     if (!labelCount[ts[t]]){<br />
           labelCount[ts[t]] = new Array(ts[t])<br />
           }<br />
        }<br />
var ta=cloudMin-1;<br />
tz = labelCount.length - cloudMin;<br />
lc2 = document.getElementById('labelCloud');<br />
ul = document.createElement('ul');<br />
ul.className = 'label-cloud';<br />
for(var t in ts){<br />
    if(ts[t] < cloudMin){<br />
       continue;<br />
       }<br />
    for (var i=0;3 > i;i++) {<br />
             c[i]=s(minColor[i],maxColor[i],ts[t]-ta,tz)<br />
              }      <br />
         var fs = s(minFontSize,maxFontSize,ts[t]-ta,tz);<br />
         li = document.createElement('li');<br />
         li.style.fontSize = fs+'px';<br />
         li.style.lineHeight = '1';<br />
         a = document.createElement('a');<br />
         a.title = ts[t]+' Posts in '+t;<br />
         a.style.color = 'rgb('+c[0]+','+c[1]+','+c[2]+')';<br />
         a.href = '/search/label/'+encodeURIComponent(t);<br />
         if (lcShowCount){<br />
             span = document.createElement('span');<br />
             span.innerHTML = '('+ts[t]+') ';<br />
             span.className = 'label-count';<br />
             a.appendChild(document.createTextNode(t));<br />
             li.appendChild(a);<br />
             li.appendChild(span);<br />
             }<br />
          else {<br />
             a.appendChild(document.createTextNode(t));<br />
             li.appendChild(a);<br />
             }<br />
         ul.appendChild(li);<br />
         abnk = document.createTextNode(' ');<br />
         ul.appendChild(abnk);<br />
    }<br />
  lc2.appendChild(ul);    <br />
</script><br />
<noscript><br />
<ul><b:loop values='data:labels' var='label'><br />
<li><br />
<b:if cond='data:blog.url == data:label.url'><br />
<data:label.name></data><br />
<b:else></b><br />
<a expr:href='data:label.url'><data:label.name></data></a><br />
</b:if><br />
(<data:label.count></data>)<br />
</li><br />
</b:loop>     </ul><br />
</noscript><br />
<b:include name='quickedit'></b><br />
</div><br />
</b:includable><br />
</b:widget>               <br />
</b:widget>

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

Ручная настройка внешнего вида виджета

Изменяя значения переменных в секции настройки, можно изменить внешний вид виджета.

var cloudMin= 1;

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

Этот блок определяет максимальное и минимальное значение для размера шрифта в облаке и крайние значения градации цвета для него в формате RGB.

var lcShowCount = false;

Значение False (по умолчанию) – теги выводятся без количества статей. True – возле каждого тега будет выведено количество статей на которые он ссылается.

При желании освежить облако тегов можно поэкспериментировать со значением text-align в секции определения стилей. Text-align может принимать следующие значения:

text-align:justify;
text-align:right;
text-align:left;

В строке определения стилей

#labelCloud .label-cloud li{display:inline;background-image:none !important;padding:0 5px;margin:0;vertical-align:baseline !important;border:0 !important;}

можно изменить display:inline; на display:block; что бы отображать каждый тег на отдельной строке.

И последнее. Если вы установили значение переменной lcShowCount в значение true, вы можете изменить параметры вывода счётчиков изменив стиль #labelCloud .label-count.