Аватары для комментариев в блоге на Blogspot

понедельник, 28 сентября 2009 г.
Система Blogspot, а точнее ее разработчики не перестают нас удивлять. Один из сотрудников компании Lu Chen из Филадельфии представил возможность отображать аватары возле текста комментария. Я уже как-то рассматривал данный вопрос в посте улучшаем систему комментирования, где рассказывал об одном стороннем скрипте, а также в каммнтах пользователи рекомендовали другие сервисы, но сейчас это все уже не столь актуально – ведь для Blogspot добавлена поддержка аватар в качестве функциональной возможности движка. При этом аватаркой является изображение, которое указано в профайле пользователя (смотрите панель управления блогом).


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


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

Внимание! Чтобы позвонить аватарам отображаться в блоге требуется в разделе «Настройки» меню «Комментарии» указать соответствующие настройки – ищите поле «показывать в комментариях изображения из профиля?».

Как всегда придется потрудится для подключения опции владельцам нестандартных шаблонов Blogspot. Нужно будет сделать несколько правок в HTML шаблоне.

1. Поэтому заходим в меню «Макет» - «Изменить HTML», сохраняем предварительно имеющийся шаблон на всякий случай.
2. Затем отмечаем галочку «расширить шаблоны виджета» и находим в коде:
<dl id='comments-block'>
Заменяем его на:
<dl expr:class='data:post.avatarIndentClass' id='comments-block'>
3. Дальше ищем в шаблоне
<a expr:name='data:comment.anchorName'/>
Лично у меня такого не было, в принципе, вам главное нужно найти место, где выводятся комментарии – а это совсем рядом с предыдущей кодом, рассмотренным в пункте 2. Так вот после найденного или нет кода добавляем
<b:if cond='data:blog.enabledCommentProfileImages'>
<data:comment.authorAvatarImage/>
</b:if>
4. Сохраняем шаблон. Последние строки непосредственно отвечают за вывод изображения.
5. Дальше укажем изображение, которое будет показываться, если у пользователя нет аватарки. Для этого находим в шаблоне код
<a expr:name='data:comment.anchorName'/>
Либо перемещаемся на место, где был только что добавлен вывод картинки, и помещаем после него условный оператор:
<b:if cond='data:comment.favicon'>
<img expr:src='data:comment.favicon' height='35px' style='margin-bottom:-2px;' width='35px'/>
</b:if>
6. После этого добавляем в CSS стили (перед ]]></b:skin>) следующие строки:
/* Avatar */
.avatar-image-container img {
background:url(http://i860.photobucket.com/albums/ab162/LeBloggerTemplate/AvatarBlogger.png);
width:35px;
height:35px;
}
В параметре background указывается ссылка на изображение. Если у вас что-то не получается, еще раз проверьте разрешили ли вы аватары в настройках блога.

P.S. Постовой. Кстати, насчет аватар. Есть классный сервис для создания аватар онлайн - Face Your Manga.
В походах и путешествия важен рюкзак, в котором можно все разместить.
Все для свадьбы - идеи, аксессуары, свадьба подарки, оригинальная организация.
Понравился пост? Подпишись на обновления блога по BlogoHelp RSSRSS, BlogoHelp по EmailEmail или twitter!
Как вам пост?   

Вставка Google Adsense после заголовка в постах на Blogspot

четверг, 24 сентября 2009 г.
blogger adsenseТут меня попросили объяснить как вставить рекламу Google Adsense в сообщения блога после заголовка. Вопрос это не такой простой, состоит из нескольких «подготовительных этапов», если можно так выразиться. Один таких моментов я рассмотрел в прошлый раз – это статья про условный оператор и вывод данных на главной странице.

Перед тем, как размещать код Google Adsense в любом месте шаблона вам нужно будет его добавить, причем сделать это «напролом», открыв HTML код макета не получится. Поэтому приходится устанавливать контекстную рекламу с помощью средств самой системы Blogspot. Это этап номер2 – смотрите вторую часть данного поста. Нужно добавить код Google Adsense между постами в блоге. Соответствующая опция доступна в разделе «Макет» в свойствах элемента «Сообщения блога».

В общем, там нужно будет еще разрешить доступ adsense к системе Blogger, если у вас его нет, и некоторые другие мелочи в настройке. Хотя, в принципе, все должно быть понятно и так. Если после установки видите сообщения между постами – то все хорошо и можно переходить к следующему этапу.

1. Заходим в раздел «Макет» - «Изменить HTML». Перед правками шаблона, как обычно, сохраняем его бэкап (резервную копию) чтобы можно было восстановить.

2. Отмечаем галочку «расширить шаблоны виджета», после чего находим в коде строку <data:post.body> - это начало элемента статьи.

3. Сразу же после него добавляем строки:
<b:if cond='data:post.includeAd'>
<data:adEnd/>
<data:adCode/>
<data:adStart/>
</b:if>
Кстати, не забывайте, что только 3 элемента контекстной рекламы adsense (не ссылок) может одновременно находится на странице.

4. Если вы хотите чтобы код рекламы отображался не так как у меня, а имел обтекание текстом справа или слева, то следует добавить в код выше строки:
<div style='float:left;'> или <div style='float:right;'>
5. Теперь вспоминаем уроки прошлого поста – чтобы задать отображение Google Adsense только на странице с полным текстом поста нужно использовать:
<div style='float:left;'>
<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:post.includeAd'>
<data:adEnd/>
<data:adCode/>
<data:adStart/>
</b:if>
</b:if>
blogspot google adsense

Здесь задано обтекание текстом справа. Внимание, если вы хотите добавить контекстную рекламу adsense после поста, то найдите в коде шаблона строку <data:post.body/> и вставляйте рекламный код после нее.

P.S. Постовой. Кондиционеры сплит системы - купить в Киеве.
Выбирайте необычный и оригинальный подарок в нашем интернет магазине.
Понравился пост? Подпишись на обновления блога по BlogoHelp RSSRSS, BlogoHelp по EmailEmail или twitter!
Как вам пост?   

Собственный сайт как необходимое условие успешной работы корпорации

суббота, 19 сентября 2009 г.
Создание сайтов – одно из основных направлений, которым занимается веб студия SitePark.com.ua. В комплекс услуг по созданию сайтов практически всегда входит также его продвижение в самых популярных поисковых системах(Google, Yandex) и социальных сетях (Facebook, Twitter, Вконтакте).
Заказывая у нас собственный сайт, вы можете быть абсолютно уверенными в высоком уровне качества работ. Веб студия SitePark.com.ua создает проэкты любого уровня сложности и любой направленности.
Мы можем сделать сайт-визитку, корпоративный сайт, интернет магазин или даже целый портал. Нас не пугают объемы работ и поставленные перед нами задачи. Мы всегда делаем свою работу на высоком технологическом уровне и точно в срок. Наши специалисты – настоящие профессионалы и знатоки своего дела. В штате нашей веб студии работают только дипломированные специалисты в области IT-технологий, дизайна, маркетинга и копирайтинга, а также других областей.
Понравился пост? Подпишись на обновления блога по BlogoHelp RSSRSS, BlogoHelp по EmailEmail или twitter!
Ярлыки:
Как вам пост?   

Условный оператор и вывод данных на главной странице

пятница, 18 сентября 2009 г.
blogger html шаблонИногда бывают ситуации в блоге, когда вам нужно выводить определенные данные отдельно на главной и странице с полным текстом поста. Для этого используется условный оператор в коде шаблона. Косвенно данную тему мы уже рассматривали в посте об оптимизации BlogSpot блога с помощью настройки заголовка Tilte.

Итак, заходим в раздел Макет – меню «Изменить HTML». Ставим галочку в поле «расширить шаблоны виджета», после чего находим в шаблоне нужное там место, где будет вставляться условие. Синтаксис кода следующий:
<b:if cond='data:blog.pageType == "item"'>
информация, которая выводится на странице с полным текстом поста
<b:else/>
здесь код, что выполняется не на странице сообщений, то есть на главной
</b:if>
Это наиболее общая запись, если нужно рассмотреть 2 варианта условия - в случае положительного и отрицательного результата.

шаблон html blogspot

Можно ограничиться кодом без else. Например, если вам просто нужно вывести какую-то информацию на странице с полным текстом статьи, тогда используете код:
<b:if cond='data:blog.pageType == "item"'>
вывод нужной информации
</b:if>
Можно применить условие «если нет», тогда вместо двух символов равно «==» используете такое сочетание – «!=», в коде это выглядит следующим образом:
<b:if cond='data:blog.pageType != "item"'>
вывод нужной информации на главной
</b:if>
Зачем это все может быть нужно. Разные могут быть причины. У меня, например, условия используются для:
  • вывода разных значений title
  • вывода связных сообщений только на странице с полным текстом статьи
  • разного отображения контекстной рекламы google adsense на главной и других страницах
Вообще использовать условный оператор можно и в других случаях, проверяя те или иные условия. В справке я читал о возможности его применения для блогов с несколькими авторами.
<b:if cond='data:team=="true"'>
отображать нескольких авторов
</b:if>
Теоретически, думаю, можно использовать и другие переменные, полный их список вы найдете на этой странице.

P.S. Советую глянуть красивые черно-белые фотографии для вдохновения.
Понравился пост? Подпишись на обновления блога по BlogoHelp RSSRSS, BlogoHelp по EmailEmail или twitter!
Как вам пост?   

Кнопка «читать далее» в Blogger

воскресенье, 13 сентября 2009 г.
Можно сказать лишь одно слово – свершилось! Теперь в блогах на Blogspot доступна опция кратких сообщений со ссылкой «читать далее» на полный текст статей. Спасибо следует сказать разработчику Sean McCullough. Если вы продвинутый пользователь Blogger, то, видимо, уже в курсе, что многие создавали сообщения «под катом» и без этого нововведения. Только не для всех данный процесс был легким, потому и приводил к множеству ошибок. Теперь же все гораздо проще.

Итак, с помощью «Jump Break» (именно так называют скрытие под кат) можно опубликовать на главной странице небольшую часть вашего поста (снипет), после которого будет следовать ссылка «читать далее». Кликнув по ней читатель сможет просмотреть весь текст сообщения.



Существует несколько способов вставить ссылку «читать далее». Во-первых, если вы используете новый текстовый редактор (доступен в черновиках Blogger или при включении соответствующей опции в меню «Настройки» - «Основные сведения»), то вы должны заметить в самом конце панели управления кнопку «Insert jump break» («Вставить переход»). Собственно, нажимаете ее в том месте, где хотите сделать разделение.



Если вы не используете новый текстовый редактор, то всегда можете вставить разрыв для поста в режиме редактирования HTML. Для этого заходим в правку текста HTML без редактора и в нужном месте добавляем текст <!-- more -->.



Для того чтобы изменить текст ссылки «Читать далее» на любой другой, нужно зайти в раздел «Макет», где для центрального блока Сообщения блога кликнуть по ссылки «Изменить» чтобы отредактировать его настройки. В открывшемся окне в самом начале вы найдете поле «Текст ссылки на страницу сообщения», где и задается текст для ссылки.


Следует также заметить, что вставка разрыва Jump Break никоим образом не влияет на то как отображается пост в RSS фиде. Напомню, что данная конфигурация может быть произведена в разделе «Настройки» меню «Канал сайта».

Внимание! Если вы обладатель какого-то нового и навороченного шаблона Blogger с множеством фишек, вам может понадобится дополнительная правка кода для активации сообщений под катом. Для этого, во-первых, сделайте бэкап шаблона, затем в разделе «Макет» - «Редактировать HTML» отмечаете галочку «расширить шаблоны виджета». Далее находите в тексте код
<data:post.body/>
Сразу же после него размещаете:
<b:if  cond='data:post.hasJumpLink'> 
<div class='jump-link'>
<a expr:href='data:post.url + "#more"'><data:post.jumpText/></a>
</div>
</b:if >
Сохраняете и смотрите на результаты. Забегая наперед, скажу, что я лично этот код не пробовал, поэтому ничего конкретного относительно его работоспособности сказать не могу. Он предоставляется самими разработчиками в этой статье, посему должен работать корректно.

P.S. Постовой. На нашем сайте вы можете скачать покер бесплатно.
Понравился пост? Подпишись на обновления блога по BlogoHelp RSSRSS, BlogoHelp по EmailEmail или twitter!
Как вам пост?   

BlogPress Lite - бесплатное приложение для iPhone

суббота, 5 сентября 2009 г.
Разработчики рады сообщить всем, что теперь Blogger стал боле доступным для пользователей iPhone. Если быть точным, приложение уже продавалось iPhone App Store, но команда создателей решила выпустить бесплатную версию BlogPress как раз в честь празднования 10 юбилея движка Blogspot. Приложение называется BlogPress Lite и содержит множество полезных возможностей движка Blogger, что делают его максимально простым и эффективным для мобильного блоггинга.

Функциональный текстовый редактор, загрузка изображений, теги, разные настройки, авто сохранение – вот некоторые из фишек клиента BlogPress Lite, плюс некоторые другие особенности специально для iPhone. Поддерживается также режим редактирования в горизонтальном положении телефона (Landscape), знакомый многим пользователям iPhone. Посты в блоге автоматически сохраняются когда на аппарат поступает телефонный звонок – вам не нужно переживать из-за того, что данные будут утеряны.



В общем, если вы счастливый обладатель iPhone, есть повод порадоваться вдвойне – хороший у вас телефон, ну и вскоре вы сможете бесплатно воспользоваться приложением BlogPress Lite.
Понравился пост? Подпишись на обновления блога по BlogoHelp RSSRSS, BlogoHelp по EmailEmail или twitter!
Как вам пост?   
Related Posts with Thumbnails