Отображение виджета на конкретной странице блога

суббота, 16 июня 2012 г.
Иногда возникают ситуации, когда та или иная информация должна отображаться только на специфической странице. Раньше я писал про условный оператор и вывод данных на главной что в последствии использовал, например, для задания МЕТА тегов. Данный вариант решения целиком и полностью размещался в коде, что не всегда понятно для пользователей-новичков. Поэтому есть смысл рассмотреть задачу отображения виджета на главной или определенной странице. В таком случае вы можете один раз настроить вывод блока, а потом спокойно редактировать его через админку в разделе "Дизайн" - получится наглядно и просто. На главной можно выводить какие-то приветственные сообщения, ссылки, разные скрипты, убрав их с остальных страниц дабы они не мешали посетителям.

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

1. Заходим в админку в раздел "Дизайн", где добавляем желанный виджет. Можете расположить его где угодно - под постами блога, в боковой панели и т.п. В моем случае я создал простенькое голосование.


2. Нужно определить ID для данного виждета - выбираете его редактирование и в адресной строке интернет браузера увидите ссылку, где параметр widgetId вам нужно запомнить, в данном примере там значение Poll1.

3. Находим код виджета в шаблоне. Для этого заходим в раздел "Шаблон" - кликаем по кнопке "Изменить HTML", а потом нажимаем "Приступить". По ID легко можно будет найти наш блок Poll1:
<b:section  class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Сообщения блога' type='Blog'/>
<b:widget id='HTML2' locked='false' title='' type='HTML'/>
<b:widget id='Poll1' locked='false' title='Голосование' type='Poll'/>
Если вы в данном окне отметите галочку "Расширить шаблоны виджета", то появится чуть больше кода для каждого из блоков, наше голосование будет иметь код:
<b:widget  id='Poll1' locked='false' title='Голосование'  type='Poll'>
<b:includable id='main'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
 <div class='widget-content' id='widget-content'>
   <iframe allowtransparency='true' expr:height='data:iframeheight' expr:name='&quot;poll-widget&quot; + data:pollid' expr:src='data:iframeurl' frameborder='0' style='border:none; width:100%;'/>
   <b:include name='quickedit'/>
  </div>
</b:includable>
</b:widget>
4. Дальше - добавляем в код условный оператор. Внимание, перед редактированием шаблона нужно его сохранить на компьютер дабы потом можно было восстановить. Формат этого "добавляемого условия" следующий. В данном случае условие отображает виджет только на главной странице.
<b:if cond='data:blog.url == data:blog.homepageUrl'>
Обычный код виджета...
<b:else/>
<style type='text/css'>
#XXXX {display:none;} /* убирает пустое место от виджета когда его нет */
</style>
</b:if>
Здесь XXXX это имя видежта, то есть в примере #Poll1. При этом вместе data:blog.homepageUrl вы можете поставить любую другую ссылку - например на страницу или пост блога. В таком случае виджет будет отображаться только на ней.

Дабы понять как именно должен быть размещен условный код предлагаю оценить как выглядит виджет после его вставки:
<b:widget  id='Poll1' locked='false' title='Голосование'  type='Poll'>
<b:includable id='main'>
<b:if cond='data:blog.url == &quot;http://new-tods-blog.blogspot.com/2009/03/2.html&quot;'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content' id='widget-content'>
<iframe allowtransparency='true' expr:height='data:iframeheight' expr:name='&quot;poll-widget&quot; + data:pollid' expr:src='data:iframeurl' frameborder='0' style='border:none; width:100%;'/>
<b:include name='quickedit'/>
</div>
<b:else/>
<style type='text/css'>
#Poll1 {display:none;}/*remove blank space that the gadget leaves*/
</style>
</b:if>
</b:includable>
</b:widget>
Начинает условие после строки и заканчивается сразу перед . После того как весь код добавлен, внимательно проверьте все ли указали и сохраняйте. Если возникла ошибка, что-то сделали не так, еще разок все тщательно посмотрите. Дальше идете на сайт и проверяете работает ли условие для отображения виджета - у меня получилось:)

P.S. Для создание своего представительства в сети пригодится бесплатный конструктор сайтов для бизнеса - сервис Nethouse с хорошей функциональностью.
Сделайте замечательный подарок своей половинке в интернет магазине парфюмерии http://makeup.com.ua/ заказав ей прекрасные духи от ведущих европейский брендов.

Понравился пост? Подпишись на обновления блога по BlogoHelp RSSRSS, BlogoHelp по EmailEmail или twitter!
Как вам пост?   
Related Posts with Thumbnails