Cómo crear múltiples widgets en WordPress usando bucles for y foreach
Publicado: 2020-01-25
¿Está buscando una forma dinámica de crear múltiples widgets en WordPress sin escribir demasiado código? ¿O ha visto un tema de WordPress que le permite crear una barra lateral o múltiples widgets desde el tablero?
En un tutorial anterior, expliqué en detalle cómo agregar una barra lateral en WordPress . Hoy, en este breve tutorial, compartiré con ustedes una solución rápida para crear múltiples widgets en WordPress sobre la marcha. Esto no solo le ahorrará tiempo, sino que reutilizará el truco en múltiples proyectos, especialmente si es un desarrollador profesional de WordPress ocupado.
Bucle para crear varias barras laterales de WordPress
Idealmente, queremos usar una función que cree las múltiples barras laterales de WordPress usando algún tipo de bucle . Cuando cree este código para el primer tema o complemento, lo reutilizará en más desarrollos de temas y complementos.
Esta función también puede ser la base para crear un generador de barra lateral dinámica utilizado en un tema o un complemento de WordPress. Para que entienda completamente cómo funciona este código, debe estar familiarizado con el proceso de creación de una barra lateral de WordPress como expliqué detalladamente en esa publicación.
Creación de widgets de WordPress
Los widgets de WordPress juegan un papel crucial para ayudar a los usuarios a mostrar contenido nuevo en diferentes secciones de su sitio web. En este post sobre cómo crear áreas de widgets en WordPress ; Compartí consejos importantes y el código y también expliqué muy claramente en esta publicación cómo agregar una barra lateral en WordPress .
Cuando tiene la capacidad de agregar un widget en el tema de WordPress, es simplemente increíble, ya que puede agregar cualquier característica nueva en todas las secciones de su sitio.
Para una revisión rápida de cómo agregar la barra lateral o el área de widgets en WordPress, se debe agregar el siguiente código a functions.php para registrar una barra lateral como el primer paso al agregar un widget en su tema de WordPress:
/**
* Registrar área de widgets.
*/
función njengah_create_one_widget_tutorial() {
//Registrar la función de la barra lateral - https://developer.wordpress.org/reference/functions/register_sidebar/
registrarse_barra lateral(
formación(
'nombre' => __( 'Ejemplo de widget de Njengah', 'dominio de texto'),
'id' => 'barra lateral-1',
'descripción' => __( 'Agrega widgets aquí para que aparezcan en tu barra lateral', 'dominio de texto' ),
'before_widget' => '<sección id="%1$s" class="widget %2$s">',
'after_widget' => '</sección>',
'before_title' => '<h2 class="widget-title">',
'después_del_título' => '</h2>',
)
);
}
add_action('widgets_init', 'njengah_create_one_widget_tutorial');Esta es la función register_sidebar() que estamos usando para agregar un widget al sitio de WordPress y el widget ahora se puede mostrar en la plantilla de página respectiva usando la función dynamic_sidebar() de la siguiente manera:
<?php if (is_active_sidebar( 'sidebar-1' ) ) : ?>
<ul id="barra lateral">
<?php barra_lateral_dinámica('barra-lateral-1'); ?>
</ul>
<?php endif; ?>Creación de múltiples barras laterales de widgets en WordPress
Dado que el código para registrar la barra lateral usó la función register_sidebar() para crear más barras laterales, solo necesita repetir ese código varias veces como desee: Ahora podemos crear tres barras laterales repitiendo este código de la siguiente manera:
/**
* Registrar 3 áreas de widgets.
*/
función njengah_create_tres_widget_tutorial() {
//Registrar barra lateral #1
registrarse_barra lateral(
formación(
'nombre' => __( 'Barra lateral Njengah 1', 'dominio de texto'),
'id' => 'barra lateral-1',
'description' => __( 'Agregue widgets aquí para que aparezcan en su barra lateral 1.', 'textdomain' ),
'before_widget' => '<sección id="%1$s" class="widget %2$s">',
'after_widget' => '</sección>',
'before_title' => '<h2 class="widget-title">',
'después_del_título' => '</h2>',
)
);
//Registrar barra lateral #2
registrarse_barra lateral(
formación(
'nombre' => __( 'Barra lateral Njengah 2', 'dominio de texto' ),
'id' => 'barra lateral-2',
'description' => __( 'Agregue widgets aquí para que aparezcan en su barra lateral 2.', 'textdomain' ),
'before_widget' => '<sección id="%1$s" class="widget %2$s">',
'after_widget' => '</sección>',
'before_title' => '<h2 class="widget-title">',
'después_del_título' => '</h2>',
)
);
//Registrar barra lateral #3
registrarse_barra lateral(
formación(
'nombre' => __( 'Barra lateral Njengah 3', 'dominio de texto'),
'id' => 'barra lateral-3',
'description' => __( 'Agregue widgets aquí para que aparezcan en su barra lateral 3.', 'textdomain' ),
'before_widget' => '<sección id="%1$s" class="widget %2$s">',
'after_widget' => '</sección>',
'before_title' => '<h2 class="widget-title">',
'después_del_título' => '</h2>',
)
);
}
add_action('widgets_init', 'njengah_create_tres_widget_tutorial');Puede crear más y más áreas de widgets repitiendo este código que está usando para registrar los widgets y todo funciona y es genial.
¡Pero espera un minuto! ¿No ha oído hablar de una regla o programación fundamental: DRY (Don't Repeat Yourself)?
Este es un principio simple que significa que su código debe ser eficiente y debe evitar tales repeticiones para evitar la redundancia. Podemos reemplazar este código con algo mejor, por ejemplo, podemos pasar un argumento a la función register_sidebar() para hacerlo tres veces.
Crear múltiples widgets en WordPress con un argumento
Podemos lograr nuestro objetivo de crear múltiples widgets en WordPress alterando la función register_sidebar() pasando una serie de argumentos como segundo parámetro y el primer parámetro es la cantidad de widgets que queremos crear. En este caso, podemos modificar el código compartido anteriormente a esto:
función create_multiple_sidebar_widgets() {
$argumentos = matriz(
'nombre' => 'Barra lateral Njengah %d',
'id' => 'njengah-barra lateral',
'description' => 'Una de las barras laterales del tutorial de Njengah',
'clase' => '',
'before_widget' => '<li id="%1$s" class="widget %2$s">',
'después_widget' => '</li>',
'before_title' => '<h2 class="widgettitle">',
'después_del_título' => '</h2>'
);
register_sidebar(3, $argumentos);
}
add_action('widgets_init', 'create_multiple_sidebar_widgets');El valor del nombre tiene un marcador de posición %d que simplemente nos permite mostrar las barras laterales con los números 1,2 y 3.
Esta es una solución rápida para crear múltiples widgets en WordPress, pero aún así, no es la solución definitiva. Podemos seguir adelante y mejorarlo como lo demostraré en breve.
Crear barras laterales múltiples con matriz en WordPress
La solución anterior no es muy efectiva ya que el título y la descripción están limitados solo a los que asignas en la función register_sidebar ().
Para mejorar esta solución, podemos introducir una matriz con nombres, identificadores y descripciones, luego usamos un bucle foreach para registrar las barras laterales.
El siguiente es un ejemplo de creación de múltiples widgets utilizando una matriz y un bucle foreach:
función create_multiple_sidebar_widgets() {
$njengah_barras laterales = matriz(
formación(
'nombre' => 'Página de inicio del área de widgets',
'id' => 'widget-area-homepage',
'description' => 'Widgets mostrados en la página de inicio',
),
formación(
'nombre' => 'Encabezado del área del widget',
'id' => 'widget-area-encabezado',
'description' => 'Widgets mostrados en el encabezado',
),
formación(
'nombre' => 'Pie de página del área del widget',
'id' => 'widget-area-footer',
'description' => 'Widgets mostrados en el pie de página',
),
);
$valores predeterminados = matriz(
'nombre' => 'Barra lateral Njengah',
'id' => 'njengah-barra lateral',
'description' => 'La barra lateral predeterminada se muestra en el lado izquierdo de las páginas del blog en este tema',
'clase' => '',
'before_widget' => '<li id="%1$s" class="widget %2$s">',
'después_widget' => '</li>',
'before_title' => '<h2 class="widgettitle">',
'después_del_título' => '</h2>'
);
foreach ($ njengah_sidebars como $ barra lateral) {
$argumentos = wp_parse_args( $barra lateral, $predeterminados);
register_sidebar( $argumentos );
}
}
add_action('widgets_init', 'create_multiple_sidebar_widgets');Esta solución le brinda la capacidad de crear múltiples widgets en el futuro, ya que solo necesita agregar cada nuevo detalle de widget (nombre, id y descripción) a la matriz y el widget se crea sobre la marcha.
Cree múltiples widgets de pie de página similares en WordPress
En última instancia, este es el mejor enfoque para crear múltiples widgets en WordPress, aunque la segunda opción también puede ser útil cuando desea múltiples widgets similares.
Por ejemplo, cuando desee crear varios widgets de pie de página, puede ser más fácil usar el bucle for de la siguiente manera:
/**
* Registre el área del widget usando for loop
*
* @autor Joe Njenga
*/
función njengah_register_sidebars_dynamically() {
para ( $i = 1, $n = 5; $i <= $n; $i++ ) {
registrarse_barra lateral(
formación(
'nombre' => esc_html__( 'Área de pie de página #', 'dominio de texto' ) . $ yo,
'id' => 'pie de página-' . $ yo,
'descripción' => sprintf( esc_html__( 'La columna #%s en el área de pie de página', 'dominio de texto' ), $i ),
'before_widget' => '<aside id="%1$s" class="widget %2$s">',
'después_widget' => '</aparte>',
'before_title' => '<h3 class="widget-title">',
'después_del_título' => '</h3>',
)
);
}
}
}
add_action( 'widgets_init', 'njengah_register_sidebars_dynamically' );Creo que esta puede ser una de las soluciones más útiles para crear varios widgets en WordPress, ya que el ciclo for simplemente cuenta hasta 5 y crea 5 widgets. Puede cambiar el número a cualquier otra cantidad de widgets que desee y se generarán los múltiples widgets. dinámicamente sobre la marcha.
Terminando
Hemos cubierto las tres formas diferentes de crear múltiples widgets en WordPress y espero que esto sea solo un comienzo para darle el impulso para crear formas más innovadoras de crear múltiples barras laterales dinámicas o múltiples widgets en temas y complementos de WordPress. Finalmente, es importante que todos los desarrolladores de WordPress aprendan a utilizar el principio DRY, ya que no solo ahorra tiempo sino que mejora la eficiencia del código.