¿Quieres crear tus propios widgets personalizados en WordPress?

Los widgets le permiten arrastrar y soltar elementos en cualquier barra lateral o área de widgets en su sitio web. En este artículo, le mostraremos cómo crear fácilmente un widget de WordPress personalizado.

Pero antes, si nunca has instalado WordPress, descubre ¿Cómo instalar un blog de WordPress pasos 7 et ¿Cómo encontrar, instalar y activar un tema de WordPress en tu blog 

Luego de vuelta a por qué estamos aquí.

Crea un widget personalizado en wordpress

¿Qué es un widget de WordPress?

Los widgets de WordPress contienen fragmentos de código que puede agregar a las barras laterales de su sitio web o áreas compatibles con widgets. Piense en ello como módulos que puede usar para agregar diferentes elementos usando una interfaz simple de "Arrastrar y Soltar".

De forma predeterminada, WordPress viene con un conjunto estándar de widgets que puede usar con cualquier tema de WordPress. 

Descubrir también nuestros mejores temas premium de WordPress.

Widget de panel de Wordpress

WordPress también permite a los desarrolladores crear sus propios widgets personalizados. Muchos temas y plugins de WordPress vienen con sus propios widgets personalizados que puedes agregar a tus barras laterales.

Por ejemplo, puedes agregar un formulario de contacto, un formulario de inicio de sesión personalizado o una galería de fotos en una barra lateral sin escribir ningún código.

Dicho esto, veamos cómo crear fácilmente sus propios widgets personalizados en WordPress.

¿Cómo crear un widget personalizado en WordPress

Este tutorial es para personas que tienen conocimiento del desarrollo web.

Antes de comenzar, sería mejor crear un complemento específico en el sitio web donde pegue el código del widget para este tutorial.

También puede pegar el código en el archivo "functions.php" de su tema de WordPress. Sin embargo, solo estará disponible cuando ese tema particular de WordPress esté activo.

En este tutorial, crearemos un widget simple que simplemente saludará a los visitantes. Mire este código, luego péguelo en su complemento específico para verlo en acción.

// Registre y cargue la función del widget wpb_load_widget () {register_widget ('wpb_widget'); } add_action ('widgets_init', 'wpb_load_widget'); // La creación de la clase de widget wpb_widget extiende WP_Widget {function __construct () {parent :: __ construct (// ID base de su widget 'wpb_widget', // El nombre del widget aparecerá en la interfaz de usuario __ ('BPC Widget', 'wpb_widget_domain') , // Matriz de descripción de widget ('descripción' => __ ('Widget de WordPress simple', 'wpb_widget_domain'),)); } // Creación de un widget de función de widget de front-end público ($ args, $ instancia) {$ título = apply_filters ('widget_title', $ instancia ['título']); // Los argumentos antes y después del widget se definen mediante temas echo $ args ['before_widget']; if (! empty ($ title)) echo $ args ['before_title']. $ título. $ args ['after_title']; // Aquí es donde ejecuta el código y muestra la salida echo __ ('Simple Widget', 'wpb_widget_domain'); echo $ args ['after_widget']; } // Formulario de función pública de Widget Backend ($ instancia) {if (isset ($ instancia ['título'])) {$ título = $ instancia ['título']; } else {$ title = __ ('Nuevo título', 'wpb_widget_domain'); } // Widget de formulario de administrador?> get_field_id( 'title' ); ?>" name="get_field_name( 'title' ); ?>" type="text" value="" />

Después de agregar el código, debe ir a " Apariencia> Widgets ". Notarás el nuevo widget " PCB Widget En la lista de widgets disponibles. Debe arrastrar y soltar este widget en una barra lateral.

Widget personalizado de Wordpress

Ahora, al visitar su blog, verá un widget en la barra lateral donde agregó el widget en cuestión.

Ahora echemos un vistazo a este código.

Primero grabamos " wpb_widget Y cargó nuestro widget personalizado. A continuación, definimos qué hace este widget y cómo mostrarlo en el tablero.

Finalmente, definimos cómo manejar los cambios realizados en el widget.

Ahora, hay algunas cosas que es posible que desee saber. Por ejemplo, cuál es el objetivo " Wpb_text_domain »?

WordPress utiliza "gettext" para gestionar la traducción y localización. Entonces " Wpb_text_domain "y __e le dice a gettext cómo recuperar una cadena de traducción si existe.

Si crea un widget personalizado para su tema de WordPress, puede reemplazar "wpb_text_domain" con el texto del dominio de su tema.

Descubre también algunos complementos premium de WordPress  

Puedes usar otros plugins de WordPress para dar una apariencia moderna y optimizar el manejo de tu blog o sitio web.

Aquí le ofrecemos algunos complementos premium de WordPress que lo ayudarán a hacerlo.

1. Galaxy Funder

Galaxy Funder es un sistema de financiación colectiva repleto de funciones diseñado para cualquier sitio web de WooCommerce. Utilizando el Plugin de WordPress premium Galaxy Funder podrás administrar tu propio sitio web de crowdfunding o agregar campañas de recaudación de fondos en el encabezado de tu tienda en línea WooCommerce.

Plugin del sistema de crowdfunding de woocommerce de galaxy funder wordpress

También puede utilizar cualquier pasarela de pago compatible con WooCommerce. Tenga en cuenta que "Galaxy Funder" funciona directamente en la página de la tienda en línea, lo que facilita el proceso de contribución del usuario.

Descargar | Demo | alojamiento web

2. Haga clic para WhatsApp Chat

Le Plugin de WordPress Premium Click to WhatsApp Chat facilita que los clientes de WordPress se conecten con el propietario del sitio web o con el servicio de atención al cliente utilizando su cuenta de WhatsApp. 

Haga clic en el chat de whatsapp para el complemento de wordpress

Simplemente haga clic en la cuenta de WhatsApp y se dirigirá directamente a la cuenta de WhatsApp móvil con un mensaje predeterminado. Y si el cliente está en una computadora de escritorio o portátil, será redirigido a WhatsApp Web.

Este complemento requiere el número de WhatsApp, la hora y el día, que el propietario del sitio web o el equipo de soporte utilizará para discutir. El botón de chat se puede agregar a la página de detalles del producto WooCommerce, que está directamente relacionado con este producto.

Descargar | Demo | alojamiento web

3. Descargar imagen de marca de agua

Esta Extensión de WordPress premium le permite agregar fácilmente marcas de agua a sus imágenes Fácil descargas digitales.marca de agua digital-de descarga de archivos de imágenes fácil

Estas marcas de agua puede ser una imagen de símbolo de copyright, un logo de la compañíao parte de la marca como una imagen PNG transparente.

Descargar | Demo | alojamiento web

Otros recursos recomendados

También lo invitamos a consultar los recursos a continuación para avanzar en el control y agarre de su sitio web y blog.

Conclusión

Listo ! Eso es todo por este tutorial, espero que te permita crear widgets personalizados en tu blog de WordPress. Si tienes comentarios o sugerencias, no dude en hacérnoslo saber en la sección reservada.

Sin embargo, también podrá consultar nuestra Recursos, si necesita más elementos para llevar a cabo sus proyectos de creación de sitios de Internet, consulte nuestra guía sobre Creación de blog de WordPress o el de Divi: el mejor tema de WordPress de todos los tiempos.

Pero mientras tanto, comparte este artículo en tus diferentes redes sociales

...