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

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


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

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

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

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

Комментариев нет: