3.8. Виджеты в WordPress |

Время чтения: 6 мин.

Структура урока

  1. Что такое виджеты и как они выглядят
  2. Особенность виджетов в WordPress.
  3. О пользе экспериментов.
  4. Итоги эксперимента: два виджета.
  5. Перенос виджета из одного сайдбара в другой

1.Что такое виджеты и как они выглядят.

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

Чтобы было понятнее рассмотрим скриншот:

То, что обведено красным и есть виджет.

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

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

2.Особенность виджетов в WordPress.

Для того, чтобы изменить виджеты в Вашей теме, необходимо зайти в Административную панель и нажать в навигационной панели на «Внешний вид» и в открывшемся списке выбрать «Виджеты»:

Откроется страница «Виджеты», в ней Вы увидите 2 колонки «Доступные виджеты» и колонку с 2 сайдбарами:

Доступных виджетов всего 12, а вот в сайдбарах – пусто. Как же так, на главной странице виджеты есть!

В этом заключена еще одна особенность WordPress’а. Те виджеты, которые есть на главной странице, помещены туда как бы для образца. На самом деле вебмастер должен сам определить, какие именно виджеты ему нужны на блоге.

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

Многих это пугает – «вдруг я что-нибудь сломал». Но так устроен WordPress, с этим надо просто смириться. Почему это сделано так, какая здесь заложена глубокая мысль – не знаю.

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

Для примера возьмем Календарь, его в нашем шаблоне нет. Установим на него курсор, появится четырехстрелочный курсор. Значит, виджет готов к перемещению. Будем перемещать его, например, в «Сайдбар 1». Напомню, что на главной странице блога сейчас расположены виджеты «Рубрики», «Разное» и «Спонсоры».

Нажав на левую кнопку мыши и, не отпуская ее, тащим в сторону «Сайдбар1». Когда под серым изображением виджета появится пунктирный прямоугольник, расположенный в поле сайдбара 1, отпускаем кнопку. Должно получиться вот так:

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

Нажимаем «Сохранить». Теперь лучше всего свернуть этот виджет, нажав на треугольник (показан стрелкой). Должно получиться так:

Причем обратите внимание на то, что в поле «Сайдбар1» после нашего виджета появилось свободное место – для следующего виджета. Перейдем на главную страницу сайта. Для этого можно пойти и другим путем, чуть-чуть более удобным. Раньше мы нажимали на кнопку «Просмотр сайта», а сейчас попробуем кликнуть по названию самого сайта (у меня называется Site1):

На главной странице сайта появился наш виджет. Если у Вас его нет на экране монитора, нажмите кнопку в браузере «Обновить». Обратите внимание на название: оно вполне поместилось:

Но третье слово уже не войдет. Впрочем, попробуйте и увидите, что получилось:

Тем, кто не понял, что здесь написано, поясню – «Календарь новых записей». Значит, надо срочно вернуть все как было.

Из остальных виджетов — «Разное» исчезло, а виджеты «Рубрики» и «Спонсоры» остались. Значит, они зашиты в саму тему. И если мы желаем их изменить или убрать, надо лезть в код и править там.

А если мы сами поставим виджет «Рубрики» сами, может старые «Рубрики» уйдут? И чем они будут отличаться друг от друга? Поэкспериментируем.

Здесь хочу немного отвлечься. Но для пользы дела.

3.О пользе экспериментов.

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

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

На Денвере же можете проводить такие эксперименты, какие пожелаете. Всегда можно отыграть назад, в худшем случае – переустановить сайт. В самом крайнем случае, перезалить сам Денвер.

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

Заканчивая с экспериментами, замечу, что, во-первых, никому (даже мне :-)) не надо верить на слово, все проверяйте сами, учитесь на ошибках. Пока они не являются фатальными.

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

4.Итоги эксперимента: два виджета.

Заходим в Административную панель, в разделе «Внешний вид» выбираем «Виджеты». В колонке «Доступные виджеты» находим виджет «Разделы», кликаем по нему и перетаскиваем в раздел «Sidebar1». Устанавливаем ниже «Календаря». Должно получиться вот так:

Заполняете заголовок и ставите галочки в чекбоксы. Сначала поставьте все галочки, сохраните и посмотрите на главной странице Вашего блога, как все это выглядит и как работает. Если что-то не понравится – вернитесь и уберите галочки из чекбоксов (еще раз кликните по ним). Я поставил флажок только в чекбокс «Показывать количество записей». Оставьте и Вы, потом увидите, для чего нам это надо. Вот, что мы видим:

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




5.Перенос виджета из одного сайдбара в другой.

Попробуем перенести установленный нами виджет из одного сайдбара в другой. Заходим в Адмпанель (раздел «Внешний вид», подраздел «Виджеты») и на открывшейся странице с Виджетами в правом столбце открываем Sidebar1 и Sidebar2. Устанавливаем курсор на только что установленный виджет «Рубрики», нажимаем левую кнопку мыши и, не отпуская мыши, перетаскиваем его из первого сайдбара во второй.

Посмотри, что у нас получилось. Напомню, что втором сайдбаре были виджеты «Ссылки», «Архив» и «Облако тэгов». Нажимаем кнопку браузера «Обновить» и отчетливо видим то, что я говорил выше – все установленные ранее виджеты исчезли, а вместо них красуется наш виджет «Рубрики»:

Установленный нами виджет в правом (втором) сайдбаре, видите цифры в скобках – это количество записей, значит, это наш новый виджет (для этого мы и ставили флажки в чекбоксы, чтобы как-то различать виджеты «Рубрика»). Теперь нам надо как-то убрать из первого сайдбара «Рубрики».

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

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

Удачи!

Перейти к следующему уроку.

…Сообщите об этой статье своим друзьям:

Благодарю Вас!

А еще Вы можете подписаться на рассылку и первым получать самые свежие статьи.

Автор: Сергей Ваулин


Похожие записи по этой теме:

Раздел: Без рубрики