Cómo crear sus propios widgets básicos wordpress

Muchos bloggers buscar alta y baja para el widget de WordPress perfecto que hará exactamente lo que quieren, pero con un poco de experiencia en programación puede que le resulte más fácil escribir su widget personalizado.

Esta semana me gustaría mostrar cómo hacer exactamente eso, y el widget Vamos a escribir es simple que escoge al azar un solo puesto de su sitio, tira de la imagen ofrecida, y lo muestra en la barra lateral - una representación visual “mira esto” widget que ayudará a los usuarios a encontrar más contenido en su sitio.

Esta es también una extensión de una serie continua en la que os muestro lo fácil que es personalizar la plantilla de WordPress.2 nuevo se refresca plugins de Wordpress & Comprender la estructura del tema de Wordpress2 nuevo se refresca plugins de Wordpress & Comprender la estructura del tema de WordpressEsta semana va a ser un echar un vistazo a una alternativa superior a la frecuencia elogiado All-In-One SEO-un plugin que le da el poder de un sistema de publicación Wordpress pero permite a la salida ...Lee mas

También puede estar satisfecho de saber que hemos añadido un nuevo categoría WordPress tutoriales a MakeUseOf, así que asegúrese de comprobar que fuera de un archivo cada vez mayor de hasta consejos cita y guías para la plataforma de blogs más popular del mundo.

Conceptos clave: Búsquedas WordPress y el bucle

Cada página de tu blog se compone de una consulta a la base de datos de mensajes. Dependiendo de la página que está viendo, la consulta va a cambiar. Su página principal del blog, por ejemplo, puede utilizar la consulta “Obtener las últimas 10 entradas de blog“. Al ver los archivos de la categoría, la consulta puede cambiar a “Obtener las últimas 20 puestos de categoría sólo las fotos de la familia, ordenar los resultados por fecha de publicación“. Cada consulta devolverá un conjunto de resultados, y en función de la plantilla de página que se utiliza, cada resultado se llevará a cabo a través de la principal “bucle” de la plantilla.

Cada página puede consistir, de hecho más de una consulta embargo, y usted puede incluso crear sus propias consultas para agregar funcionalidad a varios lugares en su plantilla. Se puede ver un ejemplo de esto en uso en la parte inferior de este artículo - tenemos algunas consultas adicionales que se ejecutan en todas las páginas que tienen como objetivo mostrar los artículos relacionados que pueden interesarle, o los artículos que están en tendencia esta semana.

Para hacer que nuestro widget personalizado, sin embargo, que sólo tendrá que crear una consulta adicional que se agarra X número de puestos al azar, además de sus imágenes, y las muestra de alguna manera en la barra lateral. Ya le mostré la semana pasada el código para captar la imagen ofrecida, así que realmente sólo hay que saber cómo hacer un widget de WordPress nuevos y colocarlo en la barra lateral. Cómo Jazz encima de su Wordpress añadiendo imágenes destacadasCómo Jazz encima de su Wordpress añadiendo imágenes destacadasImágenes se introdujeron en Wordpress en la versión 2.9, y que le permite desplegar fácilmente una imagen que se asocia con la entrada de blog en varias partes de su tema. Hoy me gustaría para mostrar ...Lee mas

Código Widget básico

Para comenzar, cree un nuevo archivo .php en su wp-content / plugins directorio. También podría seguir el tutorial en línea luego subirlo utilizando la interfaz de WordPress, pero me resulta más fácil escribir a medida que avanzamos en el caso de tener que depurar. Llame a su archivo de lo que quiera, pero yo voy con random-post-widget.php

Pegue lo siguiente en el archivo y guardarlo. Siéntase libre de cambiar la sección en la parte superior con mi nombre en ella, pero no ajuste el resto del código todavía. Esto es básicamente un widget esqueleto vacío, y se puede ver donde dice // código del widget VA AQUÍ es donde vamos a añadir nuestra funcionalidad en adelante.

lt;? php/ * Plugin Nombre: Random post WidgetPlugin URI: https://jamesbruce.me/Description: Random post Widget agarra un puesto de azar y la miniatura asociada a mostrar en su sidebarAuthor: James BruceVersion: 1Author URI: https://jamesbruce.me / * /clase RandomPostWidget se extiende WP_Widget{función RandomPostWidget(){$ widget_ops = formación(`nombre de la clase` =gt; `RandomPostWidget`, `descripción` =gt; `Muestra un puesto al azar con miniatura` )-$ this-gt;WP_Widget(`RandomPostWidget`, `Random Post y en miniatura`, $ widget_ops)-}función formar($ instancia){$ instancia = wp_parse_args( (formación) $ instancia, formación( `título` =gt; `` ) )-$ titulo = $ instancia[`título`]-?gt;lt;paggt;lt;etiqueta para="lt;? php eco $ this-gt;get_field_id(`título`)- ?gt;"gt;Título: lt;entrada clase="widefat" carné de identidad="lt;? php eco $ this-gt;get_field_id(`título`)- ?gt;" nombre="lt;? php eco $ this-gt;get_field_name(`título`)- ?gt;" tipo="texto" valor="lt;? php eco attribute_escape($ titulo)- ?gt;" / Gt;etiquetagt;paggt;lt;? php}función actualizar($ new_instance, $ old_instance){$ instancia = $ old_instance-$ instancia[`título`] = $ new_instance[`título`]-regreso $ instancia-}función Reproductor($ args, $ instancia){extraer($ args, EXTR_SKIP)-eco $ before_widget-$ titulo = vacío($ instancia[`título`]) ? `` : apply_filters(`Widget_title`, $ instancia[`título`])-Si (!vacío($ titulo))eco $ before_title . $ titulo . $ after_title--// código del widget VA AQUÍeco "

Este es mi nuevo widget!

"
-eco $ after_widget-}}add_action( `Widgets_init`, create_function(``, `Register_widget volver ("RandomPostWidget") -`) )-?gt;

Como es, el plugin no hace mucho, aparte de impresión a cabo un gran título con las palabras “Este es mi nuevo widget!“.

cómo crear widgets

Sin embargo, sí le dan la opción de cambiar el título, que es un poco esencial para cualquier tipo de artilugio. Incluimos el resto de opciones es un poco más allá del alcance de este artículo de hoy, así que por ahora vamos a pasar a darle un propósito real.

escribir su propio widget

Una nueva consulta & El lazo

Para realizar una nueva consulta a la base de datos del blog, es necesario utilizar el query_posts () función junto con algunos parámetros, a continuación, ejecutar a través de la salida mediante un bucle while. Vamos a probar esto - una consulta muy básica y el bucle de demostrar. Vuelva a colocar la línea de código que dice:

Este es mi nuevo widget!

con lo siguiente:

// código del widget VA AQUÍquery_posts(``)-Si (have_posts()) :mientras (have_posts()) : el cargo()-el título()-endwhile-terminara si-wp_reset_query()-

Esta es una consulta absolutamente básica utilizando opciones por defecto y cero el formato de la salida. Dependiendo de cómo tu blog está configurado, el valor por defecto será muy probablemente para agarrar los 10 últimos mensajes - a continuación, todo el código anterior es para dar salida al título de cada post. Es bastante feo, pero funciona:

escribir su propio widget

Podemos hacerlo un poco mejor de inmediato simplemente añadiendo un poco de formato HTML a la salida con la ECO mando, y crear un enlace al mensaje usando get_the_permalink () función:

query_posts(``)-Si (have_posts()) :eco ""-mientras (have_posts()) : el cargo()-eco "".get_the_title().""-endwhile-eco ""-terminara si-wp_reset_query()-

escribir su propio widget

Ya se ve mucho mejor. Pero sólo queremos un puesto, escogido al azar. Para ello, especificamos algunos parámetros de la consulta:

query_posts(`Posts_per_page = 1&orderby = rand`)-

Por supuesto, usted podría cambiarlo a cualquier número de puestos - de hecho, hay toda una serie de bits adicionales que puede pasar a la consulta con el fin de restringir, ampliar o cambiar el orden de los resultados, pero vamos a seguir con eso de ahora. Si actualiza, debería ver un solo mensaje que se asignó al azar a cada vez que se actualiza.

Ahora, para la miniatura de las funciones. Reemplace el código con esto, es de esperar que pueda ver dónde estamos agarrando la miniatura y mostrarla:

query_posts(`Posts_per_page = 1&orderby = rand`)-Si (have_posts()) :eco ""-mientras (have_posts()) : el cargo()-eco "".get_the_title()-eco the_post_thumbnail(formación(220,200))-eco ""-endwhile-eco ""-terminara si-wp_reset_query()-

Se puede ver los resultados de acabado, de nuevo en mi blog de desarrollo Guía de autosuficiencia, aunque podría haber movido las cosas por el momento de leer esto.

cómo crear widgets

Conclusión:

Vea lo fácil que es hacer de su propio widget personalizado que puede hacer exactamente lo que quiere? Incluso si usted no entiende el 90% del código que le he mostrado hoy, aún debe ser capaz de personalizar un tanto tan solo cambiando las variables de salida o diferente HTML. Escribimos un widget de toda la actualidad, pero se puede usar fácilmente sólo el nuevo código de consulta y el bucle en cualquiera de sus plantillas de página.

¿Problemas? Necesitar algo de ayuda diferente relacionado con WordPress? Estoy siempre a su disposición para ayudar en Respuestas MakeUseOf, por lo que la cabeza de más y fijar una nueva pregunta allí.

Artículos Relacionados