Пропустить

Как создать свой собственный виджет на WordPress

Divi: самая простая тема WordPress для использования

Divi: Лучшая тема WordPress всех времен!

Более Загрузка 600.000, Divi - самая популярная тема WordPress в мире. Он является полным, простым в использовании и поставляется с более чем бесплатными шаблонами 62. [Рекомендуется]

Хотите создать свои собственные виджеты на WordPress?

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

Но раньше, если вы никогда не устанавливали WordPress, откройте для себя Как установить WordPress блог шаги 7 et Как найти, установить и активировать WordPress тему на своем блоге

Тогда вернемся к тому, почему мы здесь.

Создайте собственный виджет на wordpress

Что такое виджет WordPress?

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

По умолчанию WordPress поставляется со стандартным набором виджетов, которые вы можете использовать с любой темой WordPress.

Откройте для себя тоже наши лучшие премиальные темы WordPress.

Виджет панели управления Wordpress

WordPress также позволяет разработчикам создавать свои собственные виджеты. Многие темы и плагины WordPress поставляются со своими собственными виджетами, которые вы можете добавить на свои боковые панели.

Например, вы можете добавить форма контакта, форма входа обычай или фотогалерея в боковой панели без написания кода.

Тем не менее, давайте посмотрим, как легко создавать свои собственные виджеты на WordPress.

Как создать свой собственный виджет на WordPress

Этот учебник для людей, которые имеют знания о веб-разработке.

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

Легко создайте свой сайт с Elementor

Elementor позволяет легко создать любой дизайн сайта с профессиональным дизайном. Прекратите платить дорого за то, что вы можете сделать сами. [Free]

Вы также можете вставить код в файл functions.php вашей темы WordPress. Однако он будет доступен только тогда, когда эта конкретная тема WordPress активна.

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

// Регистрация и загрузить функцию виджета wpb_load_widget () {register_widget ( 'wpb_widget'); } Add_action ( 'widgets_init', 'wpb_load_widget'); // Создание класса виджета wpb_widget расширяет WP_Widget {функция __construct () {родительский :: __ конструкт (// Base ID вашего виджета wpb_widget '// имя виджета появится в IU __ (' PCBs Widget '' wpb_widget_domain «) // описание Widget массив ( 'описание' => __ ( 'Простой виджет WordPress', 'wpb_widget_domain'))); } // Создание виджета общественного переднего конца функция виджет ($ арга, $ экземпляра) {$ названия = apply_filters ( 'widget_title' $ экземпляра [ 'название']); // до и после виджета аргументы определяются по темам эхо $ арг [ «before_widget»]; если (! пусто ($ названия)) эхо $ арга [ 'before_title']. $ Title. $ Args [ 'after_title']; // Здесь вы запустите код и отображение выходного эхо __ ( «Простой виджет», «wpb_widget_domain»); Эхо $ арг [ 'after_widget']; } // виджет Backend форма публичной функции ($ экземпляра) {если (Исеть ($ экземпляра [ 'название'])) {$ название = $ экземпляра [ 'название']; } Else {$ название = __ ( 'Новое название', 'wpb_widget_domain'); ?} // Widget форма админ> <p> <метка для = "<? Php эхо $ this-> get_field_id ( 'название');>?"> <Php _e? ( 'Название:'); ?> </ Label> <входной класс = "widefat" ID = "<? Php Эхо $ этом-> get_field_id ( 'название');?>"? Name = «<Php Эхо $ этом-> get_field_name ( 'название'? );?> "тип =" текст "значение =" <PHP эхо esc_attr ($ название);??> «/> </ p> <PHP} // обновление экземпляров виджета Замена старого с новым обновлением общественные функции ($? new_instance, old_instance $) {$ экземпляр = массив (); $ Instance [ 'название'] = (! Empty ($ new_instance [ 'название']))? strip_tags ($ new_instance [ 'название']): ''; вернуть $ экземпляр; }} // Класс wpb_widget заканчивается

После добавления кода необходимо перейти к Внешний вид> Виджеты ». Вы заметите новый виджет PCB Widget В списке доступных виджетов. Вы должны перетащить этот виджет в боковую панель.

Пользовательский виджет Wordpress

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

Теперь давайте посмотрим на этот код.

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

Наконец, мы определили, как обрабатывать изменения, внесенные в виджет.

Теперь есть несколько вещей, которые вы можете захотеть узнать. Например, какова цель " wpb_text_domain "?

Вы ищете лучшие темы и плагины WordPress?

Загрузите лучшие плагины и темы WordPress на Envato и легко создайте свой сайт. Уже больше, чем 49.720.000. [ЭКСКЛЮЗИВ]

WordPress использует «gettext» для управления переводом и локализацией. Итак wpb_text_domain «и __e сообщает gettext, как получить строку перевода, если она существует.

Если вы создаете собственный виджет для вашей темы WordPress, вы можете заменить «wpb_text_domain» текстом домена вашей темы.

Откройте для себя также несколько премиальных плагинов WordPress

Вы можете использовать другие плагины WordPress, чтобы придать современный вид и оптимизировать управление вашим блогом или веб-сайтом.

Мы предлагаем вам несколько премиальных плагинов WordPress, которые помогут вам сделать это.

1. Galaxy Funder

Galaxy Funder - это краудфандинговая система, разработанная для любого веб-сайта WooCommerce и обладающая широкими возможностями. Используя премиальный плагин WordPress Galaxy Funder, вы можете управлять своим собственным краудфандинговым сайтом или добавлять кампании по сбору средств в заголовок вашего интернет-магазина WooCommerce.

Плагин для краудфандинговой системы Galaxy funder woocommerce wordpress

Вы также можете использовать любой платежный шлюз поддерживается WooCommerce. Обращаем ваше внимание, что «Galaxy Funder» работает непосредственно на странице интернет-магазина, что облегчает процесс вклада пользователей.

скачать | Демонстрация | веб-хостинг

2. Нажмите, чтобы Чат WhatsApp

Премиум плагин WordPress Click to WhatsApp Chat позволяет клиентам WordPress легко подключаться к владельцу веб-сайта или поддержке клиентов, используя свою учетную запись WhatsApp.

Нажмите, чтобы чат в WhatsApp для плагина wordpress

Просто нажмите на учетную запись WhatsApp, и она будет направлена ​​непосредственно на мобильную учетную запись WhatsApp с сообщением по умолчанию. И если клиент находится на настольном компьютере или ноутбуке, он будет перенаправлен в WhatsApp Web.

Этот плагин требует номер и время и день WhatsApp, который владелец сайта или служба поддержки будет использовать для чата. Кнопка чата может быть добавлена ​​на страницу сведений о продукте WooCommerce., который напрямую связан с этим продуктом.

скачать | Демонстрация | веб-хостинг

3. Загрузить изображение Watermark

Это премиальное расширение WordPress позволяет легко добавлять водяные знаки на ваши изображения. Easy Digital загрузки.водяной знак простых цифровых файл-загрузка-изображения

Эти водяные знаки может быть изображением символа авторского права, логотип компанииили часть имиджа бренда в виде прозрачного PNG-изображения.

скачать | Демонстрация | веб-хостинг

Легко создайте свой интернет-магазин

Загрузите бесплатные WooCommerce, лучшие плагины для электронной коммерции, чтобы продавать свои физические и цифровые продукты в WordPress. [Рекомендуется]

Другие рекомендуемые ресурсы

Мы также приглашаем вас ознакомиться с указанными ниже ресурсами, чтобы получить дополнительную информацию о вашем веб-сайте и блоге.

Заключение

Вуаля! Это все для этого урока, я надеюсь, что оно позволит вам создавать собственные виджеты в своем блоге WordPress. Если у вас есть Комментарии или предложения, не стесняйтесь, дайте нам знать в зарезервированном разделе.

Однако вы также сможете ознакомиться с нашими Ressources, если вам нужно больше элементов для реализации ваших проектов создания интернет-сайтов, обратитесь к нашему руководству по Создание блога на WordPress или Divi: лучшая тема WordPress всех времен.

Но тем временем поделитесь этой статьей в разных социальных сетях.

...

Эта статья содержит комментарии 0

Оставить комментарий

Ваш электронный адрес не будет опубликован. Обязательные для заполнения поля помечены *

Этот сайт использует Akismet для уменьшения нежелательности. Узнайте больше о том, как используются ваши комментарии.

Вверх
10 акции
доля8
чирикать1
Регистрация1