www.blogspot.com
dotrb
dotRB
1	http://feedproxy.google.com/~r/dotrb/~3/A-aahyzb4Oo/glowingsword-blog-unable-to-find.html	GlowingSword Blog: Unable to find specified executable ошибка в Thunderbird	2011-09-21T14:13:30.510+04:00	___	GlowingSword Blog: Unable to find specified executable ошибка в ThunderbirdПоимел проблему с Thunderbird 6.0.2 на Linux Mint 9 Росинка.А всего-то и нужно было — доустановить один пакетsudo apt-get install libnotify-binОшибка эта достала — пожалел, что обновил Thunderbird. А вот предложенное решение помогло :)       
2	http://feedproxy.google.com/~r/dotrb/~3/iJ5FeGK3j4k/404.html	4.04	2011-04-04T20:48:49.746+04:00	tag: Web endoftag 	С днем веб-разработчика, веб-мастера!День святого ИсидораCвятой Исидор Севильский считается покровителем учеников и студентов, а в 2003 году папа Иоанн Павел II официально назвал святого Исидора покровителем интернета.Католическая церковь избрала его покровителем интернета, основываясь, прежде всего, на том, что Всемирная сеть — это огромная сокровищница практического и теоретического человеческого знания.Также сегодня отмечают свой профессиональный праздник неутомимые веб-мастера и интернет-разработчики. Этот праздник пока неофициальный, но из года в год становится все популярнее. А дата календаря — «404» — создает прекрасную предпосылку для укрепления традиций празднования этого дня.&copy; calend.ru       
3	http://feedproxy.google.com/~r/dotrb/~3/FWeLy8_lPkg/ne-v-temu-pro-zajigalky.html	Не в тему. Про зажигалку	2011-06-28T22:07:47.554+04:00	tag: self endoftag 	Сегодня (вчера) друг невзначай подарил зажигалку. Видя как я с лицом одухотворенной обезьяны кручу ее в руках, объяснил: «Она зажигается как деньги пересчитывают».А я как дипломированный инженер пытался ее за всевозможные неровности ногтем поддеть!Многие вещи проще, чем кажутся.UPD Специально для тех кто просил фоток :)P.S. Фотки не мои — из того, что выдал гугль.       
4	http://feedproxy.google.com/~r/dotrb/~3/UDte2-ixaK8/vyravnivanie-po-centru.html	Выравнивание по центру	2010-10-21T10:34:47.370+04:00	tag: Blogger endoftag tag: CSS endoftag tag: HTML endoftag 	Простой пример выравнивания по центру; подходит как для страницы, так и для отдельных блоков. Вот как это сделано в шаблонах Blogger.Магия кроется в тегах body и div outer-wrapper. Хотя нет, вру: магия как обычно в CSS.В общем случае, теги расположены так:&lt;body&gt;  &lt;div id="outer-wrapper"&gt;    ...содержание...  &lt;/div&gt;&lt;/body&gt;Чтобы выровнять содержимое по центру, нужно задать body text-align:center, а для блока outer-wrapper фиксированную ширину width:1000px, а так же отступы auto слева и справа.Теперь нужно вернуть содержимому outer-wrapper «нормальное» выравнивание текста (по левому краю) text-align:left.В результате стили CSS для элементов будут выглядеть так:body {  text-align:center;}#outer-wrapper {  margin:0 auto;  text-align:left;  width:1000px;}Вуа-ля – страница расположена по центру.       
5	http://feedproxy.google.com/~r/dotrb/~3/Sd9aHXoNBGM/mailru-vas-ster.html	Mail.ru Вас стер!	2010-11-04T01:12:43.699+03:00	tag: сервисы endoftag tag: self endoftag 	Когда-то в стародавние времена, когда компьютеры были большими, а сервисы маленькими, завел я себе аккаунт на mail.ru. Повзрослев и, – надеюсь, – поумнев, перебрался я на гуглопочту. Старый же почтовый аккаунт оставил преимущественно для мейловских сервисов и «временных» регистраций.Хотя… в той адресной книге оставалось у меня некоторое количество респондентов, с которыми иногда переписываюсьлся. На Новый год, например, или просто по случаю или срочной надобности.Не так давно понадобилось мне списаться через почту М.ру. Тут-то меня и ждал не самый приятный сюрприз:ОшибкаУчетная запись заблокированаПочтовый ящик был закрыт за неиспользование, его содержимое (письма, папки, адреса, настройки) уничтожено в соответствиями с условиями пользовательского соглашения.И чуть ниже:Если Вы хотите продолжить им пользоваться, нажмите разблокировать.Спасибо и на том.Выбираю «разблокировать» и наконец-то попадаю в свой “soap box”. Где действительно ничегошеньки /*не соврали ;)*/ а во Входящих единственное письмо:Добро пожаловать на Mail.Ru!Вы стали пользователем самого большого и надежного почтового сервиса Рунета.Простите, «надежного»?!! %)))Upd 20.10.2010 Улыбнул следующий пункт:8.1 Пользователь согласен с тем, что Mail.Ru оставляет за собой право прекратить действие учетной записи Пользователя в любое время без предварительного уведомления Пользователя.Еще по теме:2 скрытых способа использования адреса Gmail       
6	http://feedproxy.google.com/~r/dotrb/~3/0oIbVsLGsOI/2-gmail.html	2 скрытых способа использования адреса Gmail	2010-10-07T01:03:06.109+04:00	___	Недавно прочел заметку в официальном блоге Gmail о двух скрытых способах использования адреса электронной почты Google. По сути это два способа изменять адрес своей электронной почты, чтобы он по-прежнему оставался рабочим.Добавь знак плюс («+») и любую комбинацию слов или цифр после своего email адреса. Например, если твой адрес topblogger@gmail.com, ты можешь отправлять почту на topblogger+friends@gmail.com или topblogger+mailinglists@gmail.comВставь одну или несколько точек («.») где-либо в своем email адресе. Gmail не учитывает точки в адресах &ndash; мы просто игнорируем их. Например, ты можешь дать человеку свой адрес как topblogger@gmail.com, top.blogger@gmail.com или top.blog.g.er@gmail.com.Про способ с точкой я знал довольно давно и использовал его, например, для многократной регистрации на сайте под одним и тем же (видоизмененным) адресом. Или для регистрации на недоверенных сервисах. Например, использовав адрес вида t.opblogger@gmail.com. Впоследствии, зная адрес, на который приходит нежелаельная почта, я мог тут же загнать ее под фильтр.Способ же с плюсом («+») эти возможности несколько расширяет. Например: topblogger+jobs@gmail.com или topblogger+news@gmail.com; или даже topblogger+sosedki21kv@gmail.com.2 hidden ways to get more from your Gmail address - Official Gmail Blog       
7	http://feedproxy.google.com/~r/dotrb/~3/tc4OJKLyahc/vyigral-pogodu.html	Выиграл погоду	2010-08-09T17:13:09.193+04:00	tag: погода endoftag tag: Yandex endoftag 	Выиграл погоду Яндекс. То, что началось, можно условно назвать метелью, но вместо снега песок =).Я  1:1  Яндекс.Погодавт 10ср 11чт 12метельметельметель+33+31+33Ура, спасибо! Закрепите, пожалуйста.Переиграйте Яндекс.Погоду!       
8	http://feedproxy.google.com/~r/dotrb/~3/l5F4a7d_5wo/blogging-i-trolling.html	Блогинг и троллинг	2010-04-12T03:00:48.113+04:00	tag: Web endoftag tag: self endoftag 	&laquo;Бессмысленная и бездарная статья&raquo;&ndash; Вася Пупкин&laquo;Не знаю шо имел ввиду автор, но читать не рекомендую&raquo;&ndash; Дмытро Сеопульченко&laquo;Это статья о блоггинге и троллинге&raquo;&ndash; Капитан ОчевидностьВ субботу, третьего числа открыл новый беговой сезон. После таких мероприятий лучше пару дней себя не нагружать, иначе потом стопа буквально разваливается. И следующую неделю про какую-либо активность можно забыть. Вот про что-то одно я и забыл :).#TODO: Купить хорошие кроссовки для бега.В общем, в понедельник, после многокилометровых прогулок по городу голеностоп все же дал о себе знать. Настроение по этому поводу было крайне мерзкое, а буквопомойка в тви-ленте так и подмывала устроить сеанс микро-троллинга. Я серьезно. (Не читайте меня).В очередной раз примерю на себя фуражку пижаму Капитана Очевидность и изолью на страницы этого блога потоки банальности и трафаретных откровений. В общем я здесь, чтобы объяснить очевидное, поделиться своими наблюдениями и выводами о том, что ты и без меня знаешь.Мои ёрничания по тексту &ndash; исключительно моя реакция на написанное и не обязательно "правильная".Ощущения такие, что некоторые блогописцы (из обширной и весьма глубокой ниши сео-манимейкинга) в понедельник не совсем удачно похмелившись, вспоминают о том, что "надо бы и поработать". А именно &ndash; тиснуть в Интернет очередную тривиальность, по принципу &laquo;абы було&raquo;.Я на полном серьезе задумываюсь над созданием специальной кнопки для твиттер: &ldquo;Unfollow всех мудаков на этой странице&rdquo;.Оказывается, вчера был день Исидора Севильского &ndash; покровителя Интернет.Ну ты "почти успел"! Буквально в последний вагон уходящего поезда... сутки спустя :). Молодец &ndash; держи свисток! Поэтому это и называется &laquo;день 404&raquo; (4 апреля и по-совместительству &ndash; самая популярная ошибка &laquo;документ не найден&raquo;), Международный День Интернета и День веб-разработчика.&laquo;Джокер&raquo; &ndash; это тот же &laquo;покер&raquo;, но с буквы J. Совпадение?Нет &ndash; &laquo;джовпадение&raquo;!т/с Друзья (Friends)По прочтении некоторых статей в разных блогах создается впечатление, что их пишет один и тот же идиот человек. Броский и бессмысленный заголовок &ndash; невнятное сено внутри &ndash; в конце поста вопрос, &laquo;чтоб типа заставить читателя задуматься&raquo;. Похоже, что такие авторы скачали с депозита книжку &laquo;Суперблогер! Как писать посты, чтобы зарабатывать много бабла в интернете. 100%-ное руководство!&raquo; и четко следуют "сокровенному знанию".Секрет Google раскрыт!Я познал все 32 секретных алгоритмов ЯндексИ теперь я самый главный бездарь СЕО в интернете.Я раскрыл секрет популярности ВикипедииПочитаем...ПесецУхтышка! А я-то думал про 521 037 статей на русском языке, многократно выверенный контент, которому безоговорочно доверяют и потому регулярно ссылаются. Как я ошибался &ndash; оказывается есть &laquo;секрет&raquo;.Джон. Что-то сомнительно...Джен. При всем моем уважении к тебе, Джон, но... Я глава IT-отдела, и я получила этот пост не просто так. Если ты вобьешь в &laquo;Гугле&raquo; слово &laquo;гугл&raquo;, то ты сломаешь Интернет.т/с Компьютерщики (The IT Crowd)По прочтении подобных креативов понимаешь две вещи:Ты абсолютно бездарно потратил 10&ndash;15 минут своего времени;Скорость появления таких постов (и их ценность) сопоставима со скоростью машинописи их &laquo;творца&raquo;;Читать это можно только по диагонали; писалось &ndash; тоже;Автору абсолютно насрать на все твои выводы.Угадай, чего ожидает автор абсолютно пустого и шаблонного поста? &ndash; Как минимум серьезных и конструктивных комментариев! I'm fucking serious! Комментов совершенно отличных от чего-либо в духе &laquo;Ты дурак&raquo;.Да только когда понимаешь, что на подробный и доходчивый комментарий ты потратишь времени едва ли не больше, чем автор на написание поста, ничего другого на ум и не приходит. А ты говоришь &laquo;троллинг&raquo; :)В контексте вышеоткнопанного бреда контента... Любезный блогер-баблоруб, ну сколько можно повторять: &laquo;Не хочешь срать &ndash; не мучай жопу&raquo;. Нечего написать &ndash; не пиши, иди в баню. Я серьезно. Сходи в баню с водкой и девочками, отдохни, развейся. Ты же SEO-гуру и супер-манимейкер. Уж это, наверное, сможешь себе позволить. Мы ведь одинаково понимаем слово &laquo;манимейкинг&raquo;?Такой вот скверный, пустой и бездарный апрельский псто. Всех благ! ..и не верь в &laquo;секретные дзюцу&raquo;.P.S. Кто понял шутку про две вещи &ndash; давай зачётку. Комменты в духе &laquo;Ты ниумеиш щитать!&raquo; тоже всячески приветствуются.Примечание Кэпа: Оказывается, &laquo;троллинг&raquo; и &laquo;тролль&raquo; &ndash; это просто совпадение....И для разрядки обстановки :)Видео: Mr. Freeman &laquo;Я – с большой буквы&raquo;RSS-бонус: демотиваторы Капитан Очевидность       
9	http://feedproxy.google.com/~r/dotrb/~3/t-8czsjdk8o/redesign-bloga.html	Редизайн блога	2010-04-01T14:23:59.777+04:00	tag: self endoftag tag: Design endoftag 	В рамках мероприятий по передаче блога новому владельцу (блог был продан за бочку варенья, коробку печенья и 552 погонных метра оральных ласк) выполнен редизайн блога. В соответствии с новой концепцией.Итак, традиционное &laquo;было &ndash; стало&raquo;.Было &ndash; Ruby BrewedRuby Brewed – Блог web-разработчика. Рецепты для Blogger, Ruby on Rails, XML, XSLT, CSS, HTML, JavaScript на практике.Ruby Brewed – Тюнинг BloggerСтало &ndash; &laquo;Рупор блондинки&raquo;Blogger для блондинок. Обо всем популярно и большими буквами!Рупор блондинки – Blogger для блондинокСледующий пост в этом блоге будет уже от лица нового владельца (точнее &ndash; владелицы) ресурса. Попрошу любить и жаловать :).&copy; 2010 Croaker @ dotrb.blogspot.com       
10	http://feedproxy.google.com/~r/dotrb/~3/Ih7HdAxXTWE/sloeny-zagolovok-blogger.html	Слоеный заголовок Blogger	2010-03-02T12:44:15.663+03:00	tag: tuning endoftag tag: Blogger endoftag tag: CSS endoftag tag: HTML endoftag 	Продолжаю серию постов о тюнинге заголовка Blogger. В этот раз картинка &ndash; фоновое изображение под Названием и Описанием блога.Напомню, что в Blogger существуют три варианта виджета Заголовок. Этот &ndash; второй и в терминах &laquo;Блоггера&raquo; обозначен какИзображение после названия и описанияЦель данного тюнинга, в первую очередь, &ndash; избавиться от громоздкого и недостаточно предсказуемого вычислимого выражения в виджете заголовка.Для своих бесчеловечных экспериментов я снова выбрал стандартный шаблон Minima.Этап первый: Загрузка и настройка изображенияВ первую очередь подготовь фоновое изображение заданной ширины. Для шаблона Minima по-умолчанию это 660 пикселей.Загрузи изображение и настрой размещение с помощью стандартной формы виджета &laquo;заголовок&raquo;Настройка виджета «заголовок»Получится примерно такой вид:Этап 1: Загрузка и настройка виджета «заголовок»Тут же всплыли недостатки вычислимого выражения в виджете, о которых предупреждал разработчик:Вместо самолета получился паровоз;ненужный отступ сверху, над изображением;изображение &laquo;вылазит&raquo; за пределы рамки.Совет &laquo;после сборки обработать напильником&raquo; по-прежнему работает. Поэтому, напильник в руки и вперед!Этап второй: Тюнинг виджетаПерво-наперво на странице настроек шаблона (Дизайн &ndash; Изменить HTML) отметь Расширить шаблоны виджета.Две вещи, которые должны будут подвергнуться тюнингу &ndash; это стили CSS шаблона и, собственно, сам код виджета. Точнее &ndash; тот его фрагмент, который отвечает за отображение &laquo;Изображение после названия и описания&raquo;.Полный код виджета заголовка (с комментариями) можно посмотреть здесь.Листинг 1: Фрагмент виджета «Заголовок»    &lt;b:else/&gt;      &lt;!--      Show image as background to text. You can't really calculate the width      reliably in JS because margins are not taken into account by any of      clientWidth, offsetWidth or scrollWidth, so we don't force a minimum      width if the user is using shrink to fit.      This results in a margin-width's worth of pixels being cropped. If the      user is not using shrink to fit then we expand the header.      --&gt;      &lt;div expr:style='&amp;quot;background-image: url(\&amp;quot;&amp;quot; + data:sourceUrl + &amp;quot;\&amp;quot;); &amp;quot;+ &amp;quot;background-position: &amp;quot; + data:backgroundPositionStyleStr + &amp;quot;; &amp;quot;+ data:widthStyleStr+ &amp;quot;min-height: &amp;quot; + data:height + &amp;quot;px;&amp;quot;+ &amp;quot;_height: &amp;quot; + data:height + &amp;quot;px;&amp;quot;+ &amp;quot;background-repeat: no-repeat; &amp;quot;' id='header-inner'&gt;        &lt;div class='titlewrapper' style='background: transparent'&gt;          &lt;h1 class='title' style='background: transparent; border-width: 0px'&gt;            &lt;b:include name='title'/&gt;          &lt;/h1&gt;        &lt;/div&gt;        &lt;b:include name='description'/&gt;      &lt;/div&gt;    &lt;/b:if&gt;Листинг 2: Фрагмент стилей CSS шаблона#header-inner {  background-position: center;  margin-left: auto;  margin-right: auto;}#header {   margin: 5px;  border: 1px solid $bordercolor;  text-align: center;  color:$pagetitlecolor;}Теперь нужно избавиться от комментариев и вычислимого выражения в коде виджета, а результат вычислимого выражения перенести в стили. Как это сделать показано в листинге 3.Чтобы узнать адрес фонового изображения, просмотри исходный код страницы и найди в нем элемент div с id="header-inner".# Листинг 3: Измененный фрагмент виджета «Заголовок»    &lt;b:else/&gt;      &lt;div id='header-inner'&gt;        &lt;div class='titlewrapper' style='background: transparent'&gt;          &lt;h1 class='title' style='background: transparent; border-width: 0px'&gt;            &lt;b:include name='title'/&gt;          &lt;/h1&gt;        &lt;/div&gt;        &lt;b:include name='description'/&gt;      &lt;/div&gt;    &lt;/b:if&gt;Результат вычисленного выражения style, подсмотренный в исходном коде страницы, нужно перенести в стили шаблона, предварительно выкинув из него вычисленное значение width (чтобы избавиться от &laquo;вылезания&raquo; изображения за пределы рамки).Листинг 4: Измененный фрагмент стилей CSS шаблона#header-inner {  background-image: url(http://2.bp.blogspot.com/_3_wwcvitlLc/S4w1Ikt9CEI/AAAAAAAAB5g/qkeGSn2Tgns/S1600-R/polet-ekzuperi-banner-660px.jpg);  min-height: 153px;  background-repeat: no-repeat;  background-position: center;  border: 1px solid $bordercolor;  margin-left: auto;  margin-right: auto;}#header {   margin: 5px;  text-align: center;  color:$pagetitlecolor;}Замечание: правило для бордюра (&laquo;рамки&raquo;) я перенес из свойств стилей элемента #header в элемент #header-inner. Это сделано для того, чтобы избавиться от отступа сверху.Не забудь сохранить шаблон.Итогом всех этих манипуляций должно стать следующее:Этап 2: &laquo;Обработка напильником&raquo; виджета «заголовок»Успехов!Бонус для RSS-подписчиков: Анекдот про напильник.Украли американцы у русских чертежи истребителя. Собрали — паровоз. Разобрали, собрали — паровоз! Что делать, выкрали русского специалиста. Спец берёт чертёж, смотрит, смотрит и говорит: «Там же внизу маленьким шрифтом: после сборки обработать напильником».Статьи &laquo;в тему&raquo;SEO-friendly заголовок блогаВиджет заголовка BloggerШирина шаблона Blogger&copy; 2010 dotrb.blogspot.com       
11	http://feedproxy.google.com/~r/dotrb/~3/9ZBsffyfpX4/shirina-shablona-blogger.html	Ширина шаблона Blogger	2010-02-11T01:22:46.704+03:00	tag: Blogger endoftag tag: CSS endoftag 	&laquo;Ну-ка, морда, шире тресни!&raquo;Как увеличить ширину шаблона BloggerТяжело будет впихивать третью колонку в шаблон, предварительно не расширив страницу. Добавить блогу ширины можно с помощью несложного тюнинга стилей CSS шаблона.Разные шаблоны спроектированы по-разному, и основные блоки в них могут называться и задаваться по-разному. Хорошее правило: увеличивать ширину тех блоков, где она задана с использованием свойства width.Я объясню на примере стандартного шаблона Minima. По-умолчанию этот шаблон составляет 660 пикселей в ширину. Я увеличу его до 1000 px.Элементы шаблона BloggerЯ специально раскрасил их в попсовые цвета в стиле &laquo;вырви глаз&raquo; для пущей наглядности :).Элементы шаблона Blogger &ldquo;Minima&rdquo;В общем случае, нужно будет увеличить следующие элементы:&laquo;Обертка&raquo; страницы#outer-wrapper {  width: 660px;  margin:0 auto;  padding:10px;  text-align:$startSide;  font: $bodyfont;}Меняю ширину с 660px на 1000px:#outer-wrapper {  width: 1000px;  margin:0 auto;  padding:10px;  text-align:$startSide;  font: $bodyfont;}Здесь и далее изменяется только свойство width; все остальное остается без изменений.Заголовок#header-wrapper {  width:660px;  margin:0 auto 10px;  border:1px solid $bordercolor;}Меняю:#header-wrapper {  width:1000px;  margin:0 auto 10px;  border:1px solid $bordercolor;}&laquo;Подвал&raquo;#footer {  width:660px;  /* ... */}тоже увеличивается до 1000 пикселей в ширину#footer {  width:1000px;  /* ... */}Теперь нужно сохранить шаблон.После этого появится место для дополнительной колонки в блоге.Пост скриптумВозможно, в некоторых шаблонах нужно будет увеличить ширину &laquo;обертки&raquo; центрального блока, внутри которого находятся блок сообщений блога и боковая панель.В шаблоне &laquo;Минима&raquo; это блок #content-wrapper, но ширина для него задается &laquo;автоматически&raquo; и тут ничего менять не надо.       
12	http://feedproxy.google.com/~r/dotrb/~3/fcChb4TVtr8/css3-border-radius.html	CSS3 свойство border-radius	2010-11-04T01:23:53.013+03:00	tag: CSS3 endoftag tag: CSS endoftag 	Скругление углов с помощью CSS3Для скругления углов в CSS3 используется свойство border-radius.Браузеры Google Chrome и Safari &laquo;понимают&raquo; его как с префиксом -webkit так и без оного. Mozilla Firefox понимает это свойство только с префиксом -moz. А Opera и Internet Explorer не понимают его ни под каким видом.Каноническое задание: border-radius: размер, где:размер &ndash; размер в допустимых единицах CSS.radius1 {  -webkit-border-radius: 5px;  -moz-border-radius: 5px;}Скругление определенных угловС помощью свойства CSS3 border-radius можно задавать размер скругления отдельных узлов.Исправлено: Порядок задания размеров последней спецификации border-radius.border-radius: top-left top-right bottom-right bottom-leftПорядок задания размеров запомнить проще так:1 24 3.radius2 {  -webkit-border-radius: 0 10px 0 10px;  -moz-border-radius: 0 10px 0 10px;}Отдельные правила скругления угловМожно использовать отдельные правила для скругления каждого угла.Каноническое задание: border-top-left-radius: размер, где:top &ndash; это top | bottomleft &ndash; это left | rightразмер &ndash; размер в допустимых единицах CSSТут неприятно удивил браузер Firefox, так как синтаксис у него отличается от &laquo;канонического&raquo;:-moz-border-radius-topleft: размер..radius3 {  -webkit-border-top-right-radius: 10px;  -webkit-border-bottom-left-radius: 10px;  -moz-border-radius-topright: 10px;  -moz-border-radius-bottomleft: 10px;}Успехов в &laquo;украшательстве&raquo; веб-страниц! И… пользуйся продвинутыми браузерами ;)Еще по теме CSSВ этой статье я рассказывал про свойство box-shadow.HTML скругление угловСкругление углов с помощью CSS       
13	http://feedproxy.google.com/~r/dotrb/~3/6mr9WlTL4a8/kolonka-sleva-sprava.html	Колонка слева, колонка справа	2010-01-18T16:35:57.716+03:00	tag: Blogger endoftag tag: CSS endoftag tag: HTML endoftag 	Не так давно я рассказывал как быстро и просто создать в шаблоне Blogger дополнительную, третью колонку. В примере колонка размещалась между основным блоком и боковой панелью. В этот раз расскажу как тем же способом добавить третью колонку слева и справа.Сам метод создания 3-колоночного шаблона для Blogger приведен в этой статье: Третья колонка в шаблоне. Из него и буду исходить.Колонка между основным и боковым блокамиФактически это пример из исходной статьи (ссылка выше).Третья колонка между основным блоком и сайдбаромДемоФрагмент кода шаблона с дополнительным блоком&lt;!-- Блок основного содержания --&gt;&lt;div id='main-wrapper'&gt;  &lt;b:section class='main' id='main' showaddelement='no'&gt;    &lt;b:widget id='Blog1' locked='true' title='Сообщения блога' type='Blog'/&gt;  &lt;/b:section&gt;&lt;/div&gt;&lt;!-- Блок боковой панели --&gt;&lt;div id='sidebar-wrapper'&gt;  &lt;b:section class='sidebar' id='sidebar' preferred='yes'&gt;    &lt;!-- Виджеты боковой панели у всех разные --&gt;  &lt;/b:section&gt;&lt;/div&gt;&lt;!-- Блок дополнительной боковой панели --&gt;&lt;div id='sidebar2-wrapper'&gt;  &lt;b:section class='sidebar' id='sidebar2' preferred='yes'&gt;  &lt;/b:section&gt;&lt;/div&gt;&lt;div class='clear'&gt;&amp;#160;&lt;/div&gt;Стили CSS дополнительного блока#sidebar2-wrapper {  width: 170px;  float: right;  word-wrap: break-word;  overflow: hidden;}Третья колонка слеваТретья колонка в шаблоне слеваДемоДля того, чтобы третья (дополнительная) колонка располагалась в шаблоне слева, нужно:Вставить код дополнительного блока перед блоком основного содержания:Фрагмент кода шаблона с дополнительным блоком слева&lt;!-- Блок дополнительной боковой панели --&gt;&lt;div id='sidebar2-wrapper'&gt;  &lt;b:section class='sidebar' id='sidebar2' preferred='yes'&gt;  &lt;/b:section&gt;&lt;/div&gt;&lt;!-- Блок основного содержания --&gt;&lt;div id='main-wrapper'&gt;  &lt;b:section class='main' id='main' showaddelement='no'&gt;    &lt;b:widget id='Blog1' locked='true' title='Сообщения блога' type='Blog'/&gt;  &lt;/b:section&gt;&lt;/div&gt;&lt;!-- Блок боковой панели --&gt;&lt;div id='sidebar-wrapper'&gt;  &lt;b:section class='sidebar' id='sidebar' preferred='yes'&gt;    &lt;!-- Виджеты боковой панели у всех разные --&gt;  &lt;/b:section&gt;&lt;/div&gt;&lt;div class='clear'&gt;&amp;#160;&lt;/div&gt;В свойствах стилей дополнительного блока задать выравнивание по левому краю.Стили CSS дополнительного блока. Положение слева.#sidebar2-wrapper {  width: 170px;  float: left;  word-wrap: break-word;  overflow: hidden;}Третья колонка справаТретья колонка в шаблоне справаДемоЧтобы разместить третью колонку в шаблоне справа:Вставь код дополнительного блока после блока основного содержания, перед блоком боковой панели:Фрагмент кода шаблона с дополнительным блоком справа&lt;!-- Блок основного содержания --&gt;&lt;div id='main-wrapper'&gt;  &lt;b:section class='main' id='main' showaddelement='no'&gt;    &lt;b:widget id='Blog1' locked='true' title='Сообщения блога' type='Blog'/&gt;  &lt;/b:section&gt;&lt;/div&gt;&lt;!-- Блок дополнительной боковой панели --&gt;&lt;div id='sidebar2-wrapper'&gt;  &lt;b:section class='sidebar' id='sidebar2' preferred='yes'&gt;  &lt;/b:section&gt;&lt;/div&gt;&lt;!-- Блок боковой панели --&gt;&lt;div id='sidebar-wrapper'&gt;  &lt;b:section class='sidebar' id='sidebar' preferred='yes'&gt;    &lt;!-- Виджеты боковой панели у всех разные --&gt;  &lt;/b:section&gt;&lt;/div&gt;&lt;div class='clear'&gt;&amp;#160;&lt;/div&gt;В свойствах стилей дополнительного блока задать выравнивание по правому краю.Стили CSS дополнительного блока. Положение справа.#sidebar2-wrapper {  width: 170px;  float: right;  word-wrap: break-word;  overflow: hidden;}Таким образом дополнительную, третью колонку в шаблоне Blogger можно размещать где угодно на странице.P.S. Спасибо Александру и Елене за вопрос.&copy; 2010 dotrb.blogspot.com       
14	http://feedproxy.google.com/~r/dotrb/~3/VlakHC0OBBI/izobrazhenie-ssylka-na-post.html	Изображение – ссылка на пост	2010-01-13T19:54:56.747+03:00	tag: javascript endoftag tag: tuning endoftag tag: Blogger endoftag 	Как сделать чтобы ссылка загруженного изображения Blogger вела на страницу сообщения? Отвечаю на вопросы читателей.По-умолчанию, ссылка ведет на полноразмерное изображение, и обычными средствами Blogger это реализовать нельзя. Поэтому, я написал Javascript-функцию для ссылок изображений Blogger.Важный момент. Помимо самой функции добавлены следующие условия:на главной (индексной) странице блога ссылка изображения ведет на пост;на странице сообщения ссылка ведет на изображение.Это реализовано с помощью условных операторов Blogger:&lt;b:if cond='data:blog.pageType != &amp;quot;item&amp;quot;'&gt;  &lt;!-- код Javascript--&gt;&lt;/b:if&gt;Итак, два варианта подключения скрипта для изображений в шаблоне Blogger.1. Полный код функцииЛистинг 1: Полный код для вставки в шаблон Blogger.&lt;b:if cond='data:blog.pageType != &amp;quot;item&amp;quot;'&gt;&lt;script type='text/javascript'&gt;//&lt;![CDATA[/* Функция для ссылок изображений в BloggerDenis Neverov aka Croaker, @jcdenhttp://dotrb.blogspot.com*/var nodeId = "Blog1";var postClassName = "hentry";var postTitleTag = "h3";// Сторонняя функция getElementsByClassNamegetElementsByClassName = function (classname, node){  if(!node) node = document.getElementsByTagName("body")[0];  var a = [];  var re = new RegExp('\\b' + classname + '\\b');  var els = node.getElementsByTagName("*");  for(var i=0,j=els.length; i&lt;j; i++)    if(re.test(els[i].className))a.push(els[i]);  return a;}// Сама функция для обработки ссылок изображенийbloggerImageLink2Post = function(){  var node = document.getElementById(nodeId);  var posts = getElementsByClassName(postClassName, node);  for(var i=0,j=posts.length; i&lt;j; i++){    var titleLinks = posts[i].getElementsByTagName(postTitleTag)[0].getElementsByTagName("a");    var imgs = posts[i].getElementsByTagName("img");    if (imgs[0] != undefined){      var aParent = imgs[0].parentNode;      if ( (aParent != undefined)&&(aParent.tagName == "A") ){        aParent.href = titleLinks[0].href;      }    }  }}// Вызов функцииbloggerImageLink2Post();//]]&gt;&lt;/script&gt;&lt;/b:if&gt;Для чего нужен элемент CDATA, я рассказывал здесь: XML термин CDATAИли второй вариант &ndash; подключение внешнего файла Javascript с последующим вызовом функции.2. Подключаемый Javascript-файлЛистинг 2: Код для подключения внешнего файла javascript.&lt;b:if cond='data:blog.pageType != &amp;quot;item&amp;quot;'&gt;&lt;script src='http://sites.google.com/site/railsdepot/files/imagelink2post.js' type='text/javascript'/&gt;&lt;script type='text/javascript'&gt;bloggerImageLink2Post();&lt;/script&gt;&lt;/b:if&gt;Используй либо первый вариант, либо второй (не оба сразу!)Куда вставлять javascript-кодСкрипт (код javascript) вставлять в код шаблона Blogger перед закрывающим тегом &lt;/body&gt;.Если ты используешь код Google Analytics &ndash; тогда перед кодом Google Analytics.Не забудь сохранить шаблон.Post scriptumРабота обоих вариантов скрипта протестирована в Firefox, Chrome, Opera и IE.Код разрабатывался для стандартных шаблонов Blogger и для шаблонов на основе стандартных. В &laquo;сильно нестандартных&raquo; шаблонах Blogger может не работать. Скорей всего придется задавать собственные значения переменных nodeId, postClassName и postTitleTag.P.S. Всем читателям еще раз желаю, чтобы Новый год был счастливым! И пусть любимые приносят только радостные известия.&copy; 2010 dotrb.blogspot.com       
15	http://feedproxy.google.com/~r/dotrb/~3/LXtIKhgqRFg/seo-friendly-zagolovok-bloga.html	SEO-friendly заголовок блога	2010-01-07T14:50:01.657+03:00	tag: tuning endoftag tag: Blogger endoftag tag: widgets endoftag 	Речь пойдет о том как сделать заголовок блога более SEO-привлекательным. И в частности, &ndash; заголовок первого типа.Тюнинг заголовка Blogger: Изображение вместо названия и описанияНапомню, что в шаблонах Blogger доступно три варианта заголовка:Изображение вместо заголовка и описаниятолько изображениеИзображение после названия и описанияфоновое изображение + текстБез изображениятолько текстВ своем блоге я использую вариант &laquo;номер раз&raquo; – изображение вместо заголовка и описания. И недавно заметил, что стандартный заголовок Blogger не удовлетворяет требованиям поисковой оптимизации. Да и структуре страницы вообще. Поэтому, как говорится, &laquo;будем лечить&raquo; или тюнинговать &ndash; кому как больше нравится.Структуру заголовка я рассматривал здесь: Виджет заголовка Blogger. При желании можешь ознакомиться подробнее. Меня же интересует следующий фрагмент кода.Исходный код заголовка# Листинг 1: Фрагмент виджета «Заголовок» – только изображение.&lt;b:if cond='data:imagePlacement == &amp;quot;REPLACE&amp;quot;'&gt;  &lt;div id='header-inner'&gt;    &lt;a expr:href='data:blog.homepageUrl' style='display: block'&gt;      &lt;img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &amp;quot;_headerimg&amp;quot;' expr:src='data:sourceUrl' expr:width='data:width' style='display: block'/&gt;    &lt;/a&gt;  &lt;/div&gt;&lt;b:else/&gt;И тут я вижу две проблемы:Отсутствует заголовок верхнего уровня (h1) на странице блога;Отсутствует описание блога.Тюнинг заголовка BloggerСледовательно, нужно добавить и то и другое.Заключить ссылку на главную страницу блога в теги заголовка верхнего уровня &lt;h1&gt; и &lt;/h1&gt;;Добавить описание блога в тег ссылки как вычислимое выражение: expr:title='data:description'.Вот что в итоге должно получиться:# Листинг 2: Исправленный фрагмент виджета «Заголовок» – только изображение.&lt;b:if cond='data:imagePlacement == &amp;quot;REPLACE&amp;quot;'&gt;  &lt;div id='header-inner'&gt;    &lt;h1&gt;&lt;a expr:title='data:description' expr:href='data:blog.homepageUrl' style='display: block'&gt;      &lt;img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &amp;quot;_headerimg&amp;quot;' expr:src='data:sourceUrl' expr:width='data:width' style='display: block'/&gt;    &lt;/a&gt;&lt;/h1&gt;  &lt;/div&gt;&lt;b:else/&gt;Не забудь сохранить шаблон.Кстати, текстом заголовка верхнего уровня будет название блога. В первом варианте заголовка это альтернативный текст изображения &ndash; атрибут alt.       
16	http://feedproxy.google.com/~r/dotrb/~3/VhO1OzR0uE4/shablon-sifr20-bez-flash.html	Шаблон sIFR 2.0 без флэш	2009-12-30T19:47:49.333+03:00	tag: Blogger endoftag tag: templates endoftag 	Обезфлэшивание шаблона для BloggerНедавно переделал довольно симпатичный шаблон для Blogspot-блогов &ndash; sIFR 2.0.Шаблон sIFR 2.0 без flashСудя по названию*, технология Flash как раз и должна была быть главной &laquo;фичей&raquo; этого шаблона. Но, как это порой случается, в реальности фича обратилась в баг и из главной идеи превратилась в головную боль. Дизайн шаблона удался, а вот Flash оказался &laquo;не в тему&raquo; и пришелся &laquo;не ко столу&raquo;.sIFR*sIFR &ndash; это технология, позволяющая использовать любые шрифты на веб-странице.Scalable Inman Flash Replacement (sIFR) технология с открытым кодом на JavaScript и Shockwave Flash создана для замены текстовых элементов HTML страниц на Flash эквиваленты с выбранным уникальным шрифтом.Цитата из Википедии: siFRНедостатки оригиналаВот так оригинальный шаблон смотрелся на системах Linux:Ошибки шаблона sIFR 2.0Несмотря на настройки, объекты flash не отображались в transparent mode (прозрачно);Не отображалась кириллица.ИзмененияИсключено отображение шрифтов с помощью Flash;подобраны шрифты для заголовков;изменен цвет подложки на более подходящий к текстуре шаблона;добавлены CSS стили для заголовков внутри сообщения;исправлены стили списков внутри сообщений;Важно: шаблон настроен под использование стандартного &laquo;ката&raquo; Blogger &lt;!-- more --&gt;множество небольших изменений, подробности которых я не помню.Подробнее можно посмотреть на демо-странице шаблонаДемо / Скачать       
17	http://feedproxy.google.com/~r/dotrb/~3/fSvmF7liTDg/header-novogodniy.html	Хидер «Новогодний»	2009-12-28T22:01:26.088+03:00	tag: Blogger endoftag tag: self endoftag tag: widgets endoftag tag: New Year endoftag 	Сменил баннер заголовка блога. По &laquo;телебатору&raquo; все чаще докладывают, что скоро Новый год, поэтому и тема для заголовка была выбрана новогодняя.Посвящать целый пост смене какого-либо элемента дизайна, даже такого важного как заголовок блога, &ndash; это несколько скучно и, я бы даже сказал, &ndash; убого. Хотя кое кто, бывает, делает на этом рейтинг.&laquo;Йоу, босота! Я сменил дизайн страницы ошибки 404! Давайте станцуем по этому поводу джигу!&raquo;Поэтому будет бонус. А то и два.Традиционное &laquo;было &ndash; стало&raquo;БылоХидер блога (было)СталоХидер «Новогодний»Нижние пиксели пообкусаны &ndash; их съел Кризис. И по этой же причине изображение сохранено в 128-цветной палитре &ndash; я забочусь об экономии трафика моих читателей :). Бонус №1 &ndash; ширина баннераПомнишь эту картинку?Настройка виджета «Заголовок»Если не помнишь, то она была иллюстрацией к статье &laquo;Виджет заголовка Blogger&raquo;. Там внизу есть мелкая, неприметная строчка:Изображение будет уменьшено до 660 пикс. в ширину.Так вот размер &laquo;XXX пикс. в ширину&raquo; берется не &laquo;от балды&raquo;, а прямиком из стилей CSS шаблона. Точнее &ndash; это размер блока, окружающего секцию (section) заголовка. В данном случае &ndash; блока #header-wrapper:#header-wrapper {  width:660px;  margin:0 auto 10px;  border:1px solid $bordercolor;  }Бонус №2 &ndash; как танцевать джигу&laquo;Так как все-таки правильно отплясывать джигу?&raquo; &ndash; спросит меня пытливый читатель. По моему сугубо личному убеждению, &ndash; если душа требует, то отплясывать джигу можно и &laquo;в одного&raquo;. Но всё же куда веселее делать это &laquo;хором&raquo;, как мальчики и девочки в танцевальном шоу Riverdance.Видео: Ирландский степ танец. Шоу Riverdance.Побольше поводов сплясать на радостях джигу в Новом году!&copy; 2009 и уже почти 2010 dotrb.blogspot.com       
18	http://feedproxy.google.com/~r/dotrb/~3/jyQNdp-2ykE/widget-zagolovka-blogger.html	Виджет заголовка Blogger	2009-12-24T15:49:46.687+03:00	tag: Blogger endoftag tag: widgets endoftag tag: templates endoftag 	Виджет Заголовок (Header) включен в шаблон блога по-умолчанию. С виду этот виджет &laquo;висит себе и жрать не просит&raquo;, но он далеко не так прост, как может показаться. В этой статье я разобрал &laquo;по деталям&raquo; код виджета заголовка. Попутно рассмотрев такие конструкции шаблона как b:section, b:widget и b:includable. И сделав, пожалуй, самый подробный разбор виджета &laquo;Заголовок&raquo;. Во всяком случае, этой информации пока нет даже в официальной справке.В результате получилось очень много букв. Но все рассмотрено на конкретном примере, разобрано как целиком, так и по фрагментам, поэтому думаю будет не сложно.СодержаниеТри состояния виджета «заголовок»Код виджета «Заголовок»Условия в коде виджетаПодробнее о Секциях и Виджетахb:sectionb:widgetb:includable1. Изображение вместо заголовка и описанияЧто такое exprdata2. Изображение после названия и описанияЗначения data3. Только текст&sect; Три состояния виджета «заголовок»В настройках виджета можно задать название блога, добавить описание и загрузить изображение для заголовка.Настройка виджета «заголовок»Заголовок может отображаться тремя разными способами:Изображение вместо заголовка и описания – только изображениеИзображение после названия и описания* – изображение + текстБез изображения – только текст* – С недавних пор изображение добавляется как фон заголовка, под текстом названия блога и описания.Все три варианта отображения заголовка учитываются в коде виджета&sect; Код виджета «Заголовок»Чтобы посмотреть код виджета заголовок нужно перейти на вкладку редактирования шаблона Blogger (Дизайн &rarr; Изменить HTML) и нажать &laquo;Расширить шаблоны виджета&raquo;.# Листинг 1: Код виджета «Заголовок» (с моими комментариями).&lt;div id='header-wrapper'&gt;  &lt;b:section class='header' id='header' maxwidgets='1' showaddelement='no'&gt;    &lt;b:widget id='Header1' locked='true' title='Успешный блог (заголовок)' type='Header'&gt;      &lt;b:includable id='main'&gt;        &lt;b:if cond='data:useImage'&gt;          &lt;!-- Использовать изображение --&gt;          &lt;b:if cond='data:imagePlacement == &amp;quot;REPLACE&amp;quot;'&gt;            &lt;!-- 1. Изображение: Вместо заголовка и описания --&gt;            &lt;div id='header-inner'&gt;              &lt;a expr:href='data:blog.homepageUrl' style='display: block'&gt;                &lt;img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &amp;quot;_headerimg&amp;quot;' expr:src='data:sourceUrl' expr:width='data:width' style='display: block'/&gt;              &lt;/a&gt;            &lt;/div&gt;          &lt;b:else/&gt;            &lt;!-- 2. Изображение: После названия и описания            Изображение как фон текста            --&gt;            &lt;div expr:style='&amp;quot;background-image: url(\&amp;quot;&amp;quot; + data:sourceUrl + &amp;quot;\&amp;quot;); &amp;quot; +            &amp;quot;background-position: &amp;quot; + data:backgroundPositionStyleStr + &amp;quot;; &amp;quot; +            data:widthStyleStr + &amp;quot;min-height: &amp;quot; + data:height + &amp;quot;px;&amp;quot; + &amp;quot;_height: &amp;quot; +            data:height + &amp;quot;px;&amp;quot; + &amp;quot;background-repeat: no-repeat; &amp;quot;' id='header-inner'&gt;              &lt;div class='titlewrapper' style='background: transparent'&gt;                &lt;h1 class='title' style='background: transparent; border-width: 0px'&gt;                  &lt;b:include name='title'/&gt;&lt;!-- Включить вложение 'title' --&gt;                &lt;/h1&gt;              &lt;/div&gt;              &lt;b:include name='description'/&gt;&lt;!-- Включить вложение 'description' --&gt;            &lt;/div&gt;          &lt;/b:if&gt;        &lt;b:else/&gt;          &lt;!-- 3. Без изображения --&gt;          &lt;div id='header-inner'&gt;            &lt;div class='titlewrapper'&gt;              &lt;h1 class='title'&gt;                &lt;b:include name='title'/&gt;&lt;!-- Включить вложение 'title' --&gt;              &lt;/h1&gt;            &lt;/div&gt;            &lt;b:include name='description'/&gt;&lt;!-- Включить вложение 'description' --&gt;          &lt;/div&gt;        &lt;/b:if&gt;      &lt;/b:includable&gt;            &lt;!-- Код вложения 'title' --&gt;      &lt;b:includable id='title'&gt;        &lt;b:if cond='data:blog.url == data:blog.homepageUrl'&gt;          &lt;data:title/&gt;        &lt;b:else/&gt;          &lt;a expr:href='data:blog.homepageUrl'&gt;&lt;data:title/&gt;&lt;/a&gt;        &lt;/b:if&gt;      &lt;/b:includable&gt;      &lt;!-- Код вложения 'description' --&gt;      &lt;b:includable id='description'&gt;        &lt;div class='descriptionwrapper'&gt;          &lt;p class='description'&gt;&lt;span&gt;&lt;data:description/&gt;&lt;/span&gt;&lt;/p&gt;        &lt;/div&gt;      &lt;/b:includable&gt;    &lt;/b:widget&gt;  &lt;/b:section&gt;&lt;/div&gt;&sect; Условия выбора варианта отображения# Листинг 2: Упрощенный (&laquo;условный&raquo;) код виджета «Заголовок».&lt;b:if cond='data:useImage'&gt; &lt;!!-- Если: Использовать изображение --&gt;  &lt;b:if cond='data:imagePlacement == &amp;quot;REPLACE&amp;quot;'&gt; &lt;!-- Если: Режим == Замена --&gt;    &lt;!-- только изображение --&gt;  &lt;b:else/&gt;&lt;!-- Иначе --&gt;    &lt;!-- изображение + текст --&gt;  &lt;/b:if&gt;&lt;!-- Конец условия --&gt;&lt;b:else&gt;&lt;!-- Иначе --&gt;  &lt;!-- только текст --&gt;&lt;/b:if&gt;&lt;!-- Конец условия --&gt;&sect; Подробнее о Секциях и Виджетахb:sectionb:section &ndash; секция шаблона Blogger. Это контейнер для виджетов (гаджетов).&lt;b:section class='header' id='header' maxwidgets='1' showaddelement='no'&gt;  &lt;!-- ... --&gt;&lt;/b:section&gt;Атрибуты section:class &ndash; CSS класс элемента (секции);id &ndash; уникальный идентификатор элемента в DOM &ndash; Объектной модели документаmaxwidgets &ndash; максимальное количество виджетов в секцииshowaddelement &ndash; отображать пункт &laquo;Добавить гаджет&raquo;. Значения: yes|no|maybe (да/нет/для блондинок**)** – Автор шутит. Только yes или no.b:widgetb:widget &ndash; код виджета или гаджета. Это небольшой, ограниченный блок страницы, который содержит собственный контент.&lt;b:widget id='Header1' locked='true' title='Успешный блог (заголовок)' type='Header'&gt;  &lt;!-- ... --&gt;&lt;/b:widget&gt;Атрибуты widget:id &ndash; уникальный идентификатор элемента в DOMlocked &ndash; разрешено ли перемещение виджета. Значения: true|false (запрещено/разрешено)title &ndash; заголовок виджетаtype &ndash; тип виджета. Бывают виджеты разных типов: Header, HTML, Label, BlogArchive, LinkList...b:includableb:includable &ndash; Подключаемый блок в виджете. Небольшая, повторяющаяся часть кода виджета.Имеет единственный атрибут:id &ndash; уникальный идентификатор вложенияПодключается командой b:include с атрибутом name='идентификатор включаемого вложения'.Вложение с id='main' включено в виджет по-умолчанию &ndash; это основной блок виджета.# Листинг 3: Упрощенный код виджета «Заголовок» с вложениями.&lt;b:widget id='Header1' locked='true' title='Успешный блог (заголовок)' type='Header'&gt;  &lt;b:includable id='main'&gt;    &lt;!-- ... --&gt;    &lt;h1 class='title'&gt;      &lt;b:include name='title'/&gt;&lt;!-- Включить вложение 'title' --&gt;    &lt;/h1&gt;    &lt;!-- ... --&gt;  &lt;/b:includable&gt;        &lt;!-- Код вложения 'title' --&gt;  &lt;b:includable id='title'&gt;    &lt;b:if cond='data:blog.url == data:blog.homepageUrl'&gt;    &lt;!-- Если открыта главная страница блога --&gt;      &lt;data:title/&gt;&lt;!-- Отобразить текст заголовка --&gt;    &lt;b:else/&gt;    &lt;!-- Иначе --&gt;      &lt;!-- Отобразить ссылку на главную страницу блога --&gt;      &lt;a expr:href='data:blog.homepageUrl'&gt;&lt;data:title/&gt;&lt;/a&gt;    &lt;/b:if&gt;  &lt;/b:includable&gt;&lt;/b:widget&gt;Теперь можно рассмотреть фрагменты кода подробнее.&sect; 1. Изображение вместо заголовка и описанияПро условия выбора я рассказал чуть выше. Следующий код для разбора такой:# Листинг 4: Фрагмент кода виджета для варианта 1 &ndash; только изображение.&lt;a expr:href='data:blog.homepageUrl' style='display: block'&gt;  &lt;img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &amp;quot;_headerimg&amp;quot;' expr:src='data:sourceUrl' expr:width='data:width' style='display: block'/&gt;&lt;/a&gt;Что такое exprexpr &ndash; это команда движку Blogger, что следующая строка является вычислимым выражением. Например, строка в моем шаблоне:&lt;a expr:href='data:blog.homepageUrl'&gt;Главная&lt;/a&gt;В коде HTML на выводе (после вычисления) будет выглядеть так:&lt;a href='http://dotrb.blogspot.com'&gt;Главная&lt;/a&gt;dataЗначения data из приведенного кода виджета Заголовка.data:blog.homepageUrl &ndash; URL адрес главной страницы блога;data:title &ndash; название блога;data:height &ndash; вычисленная высота изображения для заголовка;data:widget.instanceId &ndash; id виджета (см. раздел Секции и Виджеты для справки);Кодexpr:id='data:widget.instanceId + &amp;quot;_headerimg&amp;quot;'даст:id='Header1_headerimg'data:sourceUrl &ndash; URL адрес изображения в заголовке;data:width &ndash; вычисленная ширина изображения для заголовка.&sect; 2. Изображение после названия и описанияНа самом деле, в современных шаблонах Blogger картинка вставляется как фоновое изображение под текстом заголовка и описания блога.В этом блоке содержится небольшой комментарий дизайнера шаблонов. Кому интересно, мой приблизительный перевод:Отобразить изображение как фон под текстом. Вы не сможете достаточно точно вычислить ширину в JS поскольку отступы (margins) не принимаются во внимание ни одним из clientWidth, offsetWidth или scrollWidth, поэтому мы не можем четко задать минимальную ширину если пользователь использует уменьшенное изображение.Эти результаты ширины отступов получены ценой обрезанных пикселей. Если пользователь не использует уменьшенное изображение, мы расширяем заголовок.# Листинг 5: Фрагмент кода виджета для варианта 2 &ndash; текст и фоновое изображение.&lt;!-- создается блок div с фоновым изображением --&gt;&lt;div expr:style='&amp;quot;background-image: url(\&amp;quot;&amp;quot; + data:sourceUrl + &amp;quot;\&amp;quot;); &amp;quot; +&amp;quot;background-position: &amp;quot; + data:backgroundPositionStyleStr + &amp;quot;; &amp;quot; +data:widthStyleStr + &amp;quot;min-height: &amp;quot; + data:height + &amp;quot;px;&amp;quot; + &amp;quot;_height: &amp;quot; +data:height + &amp;quot;px;&amp;quot; + &amp;quot;background-repeat: no-repeat; &amp;quot;' id='header-inner'&gt;  &lt;div class='titlewrapper' style='background: transparent'&gt;    &lt;h1 class='title' style='background: transparent; border-width: 0px'&gt;      &lt;b:include name='title'/&gt;&lt;!-- Включить вложение 'title' --&gt;    &lt;/h1&gt;  &lt;/div&gt;  &lt;b:include name='description'/&gt;&lt;!-- Включить вложение 'description' --&gt;&lt;/div&gt;Значения datadata:sourceUrl &ndash; URL адрес фонового изображения в заголовке;data:backgroundPositionStyleStr &ndash; строка задания background-position (left center);data:widthStyleStr &ndash; вычисленная ширина;data:height &ndash; вычисленная высота.Честно говоря, не особо я надеюсь на &laquo;автоматику&raquo; и этот блок предпочел бы отредактировать самостоятельно через редактор шаблона.Про b:include я уже рассказывал в разделе про секции и виджеты.&sect; 3. Только текстСамый простой вариант заголовка.# Листинг 6: Фрагмент кода виджета для варианта 3 &ndash; только текст.&lt;!-- 3. Без изображения --&gt;&lt;div id='header-inner'&gt;  &lt;div class='titlewrapper'&gt;    &lt;h1 class='title'&gt;      &lt;b:include name='title'/&gt;&lt;!-- Включить вложение 'title' --&gt;    &lt;/h1&gt;  &lt;/div&gt;  &lt;b:include name='description'/&gt;&lt;!-- Включить вложение 'description' --&gt;&lt;/div&gt;Тут используются стандартные теги HTML и два инклуда &ndash; вложения. Инклуды я уже описал в разделе Секции и Виджеты.&copy; 2009 dotRB.blogspot.com       
19	http://feedproxy.google.com/~r/dotrb/~3/IR_H1KKV0KY/google-wave-podsvetka-koda.html	Google Wave подсветка кода	2009-12-17T03:46:01.804+03:00	tag: сервисы endoftag tag: tools endoftag tag: development endoftag tag: Google endoftag 	Многие программисты уже используют Google Wave как средство командной разработки. В этом отношении, кстати, весьма полезный инструмент. Можно поделиться фрагментом сырого кода, прокомментировать или исправить проблемный код, предложить свой вариант. Рано или поздно каждый разработчик задает вопрос: &laquo;Как подключить подсветку синтаксиса в Google Wave&raquo;? Не так давно я нашел простое и удобное решение.Этим советом поделился Antonio Cangiano в своем блоге.Создай новый вейв (wave &ndash; &laquo;волна&raquo;) и добавь к нему робота Syntaxy. Используй вейв-адрес: kasyntaxy@appspot.com.Возможно, нужно будет добавить бота к твоим Контактам Google;Определи язык кода &ndash; в начале сообщения укажи #!python или #!ruby;Вставляй свой код.Бот Syntaxy автоматически подсветит код в твоем сообщении как на картинке ниже:Подсветка синтаксиса в Google WaveКак я и обещал, все очень просто.Бонус для RSS-подписчиков: Аватар бота SyntaxyАватар бота Syntaxy для Google Wavehttp://kasyntaxy.appspot.com/assets/avatar.gif       
20	http://feedproxy.google.com/~r/dotrb/~3/4fBj3c4gH2c/3-kolonka-v-shablone.html	Третья колонка в шаблоне	2010-01-18T21:16:52.087+03:00	tag: Blogger endoftag tag: CSS endoftag tag: HTML endoftag 	Как сделать третью колонку в шаблоне BloggerТрехколоночный шаблон блога BlogspotСкриншот | ДемоПростая и подробная инструкция.В теории добавление 3-й, дополнительной колонки можно представить так:Уменьшить основной блок;сузить боковую панель;добавить еще одну боковую панель.На практике все ненамного сложнее.Найди в редакторе HTML шаблона следующий код. Коды могут отличаться в зависимости от используемого шаблона, но не существенно.&lt;!-- Блок основного содержания --&gt;&lt;div id='main-wrapper'&gt;  &lt;b:section class='main' id='main' showaddelement='no'&gt;    &lt;b:widget id='Blog1' locked='true' title='Сообщения блога' type='Blog'/&gt;  &lt;/b:section&gt;&lt;/div&gt;&lt;!-- Блок боковой панели --&gt;&lt;div id='sidebar-wrapper'&gt;  &lt;b:section class='sidebar' id='sidebar' preferred='yes'&gt;    &lt;!-- Виджеты боковой панели у всех разные --&gt;  &lt;/b:section&gt;&lt;/div&gt;&lt;div class='clear'&gt;&amp;#160;&lt;/div&gt;Добавь код для 3-й колонки после блока боковой панели:&lt;!-- Блок основного содержания --&gt;&lt;div id='main-wrapper'&gt;  &lt;b:section class='main' id='main' showaddelement='no'&gt;    &lt;b:widget id='Blog1' locked='true' title='Сообщения блога' type='Blog'/&gt;  &lt;/b:section&gt;&lt;/div&gt;&lt;!-- Блок боковой панели --&gt;&lt;div id='sidebar-wrapper'&gt;  &lt;b:section class='sidebar' id='sidebar' preferred='yes'&gt;    &lt;!-- Виджеты боковой панели у всех разные --&gt;  &lt;/b:section&gt;&lt;/div&gt;&lt;!-- Блок дополнительной боковой панели --&gt;&lt;div id='sidebar2-wrapper'&gt;  &lt;b:section class='sidebar' id='sidebar2' preferred='yes'&gt;  &lt;/b:section&gt;&lt;/div&gt;&lt;div class='clear'&gt;&amp;#160;&lt;/div&gt;Блоки &laquo;обертки&raquo; (wrapper) и секции (section) дожны иметь уникальные идентификаторы. &laquo;Уникальные&raquo; &ndash; не значит &laquo;оригинальные&raquo;, поэтому я задал им id sidebar2-wrapper и sidebar2 соответственно.Задай стили CSS для 3-й колонки. И не забудь уменьшить секцию основного раздела и боковой панели.#main-wrapper {  width: 530px;  float: left;  word-wrap: break-word;  overflow: hidden;}#sidebar-wrapper {  width: 220px;  float: right;  word-wrap: break-word;  overflow: hidden;}#sidebar2-wrapper {  width: 170px;  float: right;  word-wrap: break-word;  overflow: hidden;}Сохрани изменения.Страница &laquo;Изменить дизайн&raquo; должна выглядеть примерно так:Добавить и упорядочить элементы страницыМожешь добавлять гаджеты Blogger в дополнительную, третью колонку.Рекомендую по теме:Колонка слева, колонка справаСайдбар в шаблоне BloggerФутер Blogger в три колонки       
21	http://feedproxy.google.com/~r/dotrb/~3/knhAkH6d6FE/ruby-1000-chertey.html	Ruby, 1000 чертей!	2009-12-08T11:57:12.575+03:00	tag: Ruby on Rails endoftag tag: Ruby endoftag 	Случается, что число чертей или других сущностей (и не обязательно &ndash; зловредных) переваливает далеко за 1000+. В моем случае это было количество товаров в тестовом приложении. Ровно 40305. Отобразить такое большое число на странице, не поломав при этом верстку, бывает довольно проблематично. Поэтому я сегодня добавил пару методов для сокращения размера оного.Пример:210 &rarr; 1024 &rarr; 1k+Код написан на Ruby.def bignum_format(number)  if number &gt; 1000000 # == 10**6    (number/1000000).to_i.to_s+"M+"  elsif number &gt; 1000 # == 10**3    (number/1000).to_i.to_s+"k+"  else    number  endenddef html_bignum_format(number)  number &gt; 1000 ? "&lt;span class='bignum' title='#{number}'&gt;"+bignum_format(number)+"&lt;/span&gt;" : numberendСтили CSS для сокращенного числа:.bignum {  border-bottom:1px dashed;  cursor:help;}Вызов метода из хэлпера (helper):&lt;%= html_bignum_format(@items_count) %&gt;В качестве суффиксов M и k, для миллиона и тысячи соответственно, взял префиксы системы СИ.       
22	http://feedproxy.google.com/~r/dotrb/~3/dtBz_vwRt6Y/twitter-i-friend-connect-stanovyatsya.html	Twitter и Friend Connect становятся ближе	2009-12-03T15:55:06.798+03:00	tag: сервисы endoftag tag: новости endoftag tag: Google endoftag tag: Web 2.0 endoftag 	Хорошая новость для всех &laquo;орнитологов&raquo; блогосферы! Эту новость я уже упоминал в своем твиттере. Итак, Twitter и Friend Connect преодолели фазу &laquo;предварительных ласк&raquo; и теперь эти два социальных сервиса стали по-настоящему близки. Кратко: можно подключаться к сети Friend Connect используя свой аккаунт Twitter.Вот что пишет об этом Google Social Web Blog:Сегодня мы делаем Twitter и Friend Connect еще ближе друг к другу. Теперь ты можешь присоединиться к более чем 9 миллионам Google Friend Connect сайтов, используя свой Twitter логин. Присоединившись, твой Twitter-профайл будет автоматически связанным с сетью FC и ты сможешь твитить твою активность на сайтах, делиться дискуссиями из гаджета Комментариев и приглашать друзей через Twitter.Видео: Google Friend Connect добавляет функции для TwitterПереврать новость по-своему можно, используя первоисточник: Friend Connect: Birds of a Feather Tweet Together. Предложить лучший вариант перевода можно в комментах.       
23	http://feedproxy.google.com/~r/dotrb/~3/BlhTt4tZjx8/povorot.html	Поворот!	2009-11-30T11:41:15.875+03:00	tag: CSS3 endoftag tag: notebooks endoftag tag: self endoftag tag: fun endoftag tag: laptops endoftag 	под неожиданным угломПятничная медитацияИ снова пятница. В качестве объекта для традиционной пятничной медитации сегодня выступает мое рабочее место.Вот, новый поворот, и мотор ревёт,Что он нам несёт, пропасть или взлёт,Омут или брод?И не разберёшь, пока не повернёшьЗа поворот.&#160;Upd 30.11.2009 Что же это было?Объект для медитацииОснованный на CSS3 поворот домашней страницы Google.В обертке Ubuntu 8.10 внутри Dell Inspiron 1501Техника исполнения&laquo;Секретный&raquo; код CSS3 для поворота:iframe {   -webkit-transform: rotate(-90deg);   -moz-transform: rotate(-90deg);   transform: rotate(-90deg);   position: absolute;   filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=3);}Авторская методикаДемо от Animatter15 &larr; A CSS3-based Rotated GoogleP.S. Парню 14 лет! Трепещите, черви! :)       
24	http://feedproxy.google.com/~r/dotrb/~3/C8mNSxMDizo/sidebar-v-shablone-blogger.html	Сайдбар в шаблоне Blogger	2009-11-27T11:30:12.988+03:00	tag: Blogger endoftag tag: templates endoftag tag: CSS endoftag tag: HTML endoftag 	Невероятно, но факт &ndash; существуют шаблоны Blogger и вовсе без боковой панели &ndash; &laquo;сайдбара&raquo; (sidebar). Лично я подозреваю, что основным инструментом создания таких шаблонов является клавиша Del, нажатая в нужном месте. Тем не менее нельзя полностью исключить исчезновение сайдбара как результат некоего Высшего Замысла.В данном случае речь о ситуации когда нужды пользователя идут вразрез с замыслом Его Рукоблудия &ndash; дизайнера.Как вернуть сайдбар в BloggerЗа редкими исключениями, основной блок (main) и боковая панель (sidebar) располагаются внутри блока &laquo;содержимое&raquo; (content). Причем, main &ndash; с &laquo;прилипанием&raquo; к левому краю содержимого, sidebar &ndash; к правому. Или наоборот (зависит от ВЗ).Блоки Main и Sidebar в шаблоне BloggerПеред внесением любых изменений в шаблон, рекомендую сделать резервную копию.Перво-наперво, следует добавить HTML код сайдбара в шаблон. Внутри блока content (или content-wrapper), сразу за блоком main (main-wrapper):&lt;div id='content-wrapper'&gt;    &lt;div id='main-wrapper'&gt;    &lt;b:section class='main' id='main' showaddelement='no'&gt;      &lt;b:widget id='Blog1' locked='true' title='Сообщения блога' type='Blog'/&gt;    &lt;/b:section&gt;  &lt;/div&gt;  &lt;!-- Код для сайдбара --&gt;  &lt;div id='sidebar-wrapper'&gt;    &lt;b:section class='sidebar' id='sidebar' preferred='yes'&gt;      &lt;!-- Здесь будут виджеты сайдбара --&gt;    &lt;/b:section&gt;  &lt;/div&gt;  &lt;!-- Конец кода сайдбара --&gt;  &lt;!-- Следующий код убирает обтекание текста --&gt;  &lt;div class='clear'&gt; &lt;/div&gt;&lt;/div&gt; &lt;!-- end content-wrapper --&gt;С помощью CSS стилей шаблона Blogger задать боковой панели выравнивание справа: float: right;Важный момент (смотри картинку): Поскольку блоки main и sidebar расположены на одном уровне внутри контейнера content-wrapper, нужно доступную ширину разделить между ними. Можно попросту задать &laquo;от бадлы&raquo;, а потом &laquo;доработать напильником&raquo;. В общем случае будет выглядеть так:#main-wrapper {  width: 500px;/* ширина основного блока */  float: left;/* выравнивание по левому краю */}#sidebar-wrapper {  width: 300px;/* ширина боковой панели */  float: right;/* выравнивание по правому краю */}Сохранить шаблон.Теперь всё на своих местах; порядок и благолепие.--Организовать твою поклажу, &ndash; лэптоп, коммуникатор, бутерброд и два пакетика кофе, &ndash; помогут специальные средства. Например &ndash; сумки для ноутбуков или другого багажа.       
25	http://feedproxy.google.com/~r/dotrb/~3/K-cy-JGLGT0/rassylka-ili-uvedomleniya.html	Рассылка или Уведомления?	2009-11-29T08:44:52.687+03:00	tag: теория endoftag tag: RSS endoftag 	ЛикбезЧем отличается Рассылка от Почтовых уведомленийЧто же все-таки Почтовая рассылка, а что &ndash; Уведомления об обновлениях (на e-mail). В общих чертах.Что я понимаю под словом &laquo;Рассылка&raquo;.Это средство коммуникации или услуга, которую автор (в данном случае называется &laquo;Ведущий&raquo;) предоставляет с помощью специального сервиса рассылок. Самые известные &ndash; subscribe.ru, content.mail.ru, maillist.ru. Как это выглядит в общем:Ведущий регистрируется на Сервисе и создает свою рассылкуНа своем сайте он уведомляет своих посетителей о том, что дескать, я тут (помимо всего прочего) рассылочку создал &ndash; подписывайтесьКаждое письмо в рамках Рассылки Ведущий составляет вручную и публикует на СервисеПосле чего Сервис рассылает составленное письмо Подписчикам данной рассылки.+ Если сервис &laquo;бесплатный&raquo;, то он наверняка, &ndash; даже и не сомневайся, &ndash; прилепит к письму проплаченную рекламу. Реклама эта может быть как в виде текстовых ссылок, графических баннеров, так и в виде убогого &laquo;баннеро-ротатора&raquo; внутри iframe.&laquo;Почтовые уведомления&raquo;. В данном случае &ndash; о новых сообщениях в блоге.Тут все в разы проще. Как правило, это является дополнением к RSS-подписке. Как выглядит:Зарегистрировав свой RSS-feed на одном из сервисов, автор блога может подключить услугу рассылки обновлений RSS-фида блога по email. Сервисы, которые приходят на ум - это Feedburner и rss2emailКак только автор добавляет новое сообщение в блог, обновляется и RSS-feed блогаСервис рассылок через определенные промежутки времени сканирует RSS-канал, или RSS-ленту, или RSS-feed блога (что одно и то же) на предмет обновленийКак только Сервис видит, что RSS-feed обновился, он по-быстрому облекает обновление в форму сообщения электронной почты и отправляет Подписчикам.Дополнительно об RSS можно почитать в Википедии: RSS.P.S. к теме &laquo;Вирусы приходят большими порциями&raquo; форума &laquo;Russian Blogger Help Group&raquo;       
