Modificar el panel admin desde un tema

Gracias a la sugerencia de un amigo de distribuir libre mi tema Minority (que lo voy a hacer, en cuanto le realice unos ajustes), y lo que estoy aprendiendo sobre la creación de plugins, he podido llegar a la redacción de este artículo, vasto en longitud y en contenido.

¿Tema con plugin? ¿Tema con widget? ¿Tema y plugin?

En un grupo de Facebook acerca de WordPress se realizó la pregunta sobre cómo se podía implementar un slider como template. En un principio respondí que había que hacerlo mediante un widget, a lo que se volvió a preguntar que cómo se podía hacer sin widget.

Bien, obviamente necesitas una manera de indicarle al slider qué debe mostrar, para luego ubicarlo en algún sitio para que se ejecute. No sabiendo qué responder, dejé el tema en el olvido.

 

Modificación del menú de administración desde un tema

En mi estudio del ‘Manual de plugins’ del Codex de WordPress, llegué al último artículo ‘8. Ajustes’ y pensé que quería modificar la forma en que se implementa la ‘home page’ en mi tema Minority.

En mi anterior entrada de la serie ‘Temas WP’ ya vimos cómo podíamos crear un ítem del menú del panel de administración mediante un plugin.

Si cogemos todo y lo ponemos en la coctelera y la sacudimos, llegamos a la pregunta única: ¿podemos coger un widget y transformarlo a un ítem del menú admin, y hacer todo esto no con un plugin, sino con un tema?

Vamos a verlo.

 

La home page de mi tema Minority

screenshot

La home page del tema Minority es muy ‘flipante’, lo reconozco, aunque adolece de diversos errores, más de concepto que técnicos (los cuales espero que sean enmendados por quienes así lo deseen cuando realice la distro libre).

Pero si hay algo que me molestaba sobremanera, era la gestión de la home page en el back-end que, sin ser excesivamente complicada, estaba poco clara.

Veamos el fichero home.php:

Básicamente, este código llama a una cabecera header-inicio.php y a un pie footer-inicio.php, que son específicos para esta página, y crea dos zonas libres de widgets, para integrar en la primera el widget inicio_widget y en la otra el widget que cada uno prefiera.

 

El widget chiripitifláutico

Veamos ahora, el código del widget:

En la función form del widget existen dos elementos: el select nos permite ver tanto los artículos y las páginas como las categorías existentes en la base de datos, incluyendo el ID de cada uno, para poder después introducirlos en el input, manualmente, separados por comas. De esta forma, indicamos al widget los enlaces que queremos visualizar en la zona principal de la home page.

Por otro lado, en la función widget del widget, extraemos el parámetro introducido en el back-end, y generamos el menú adaptativo, eliminando los eventos onmouseover y onmouseout en dispositivos móviles, mediante CSS. En pantalla grande, se dispondrán en función de la cantidad de ítems que tenga el menú (hasta 9) según el mismo CSS, y los eventos serán los que ejecutarán el código JavaScript que generará con CSV el canvas.

El apoyo de inicio.css e inicio.js necesarios en la home page se consiguen mediante un condicional en functions.php:

inicio.css:

inicio.js:

Se va del alcance de este artículo la explicación de todo este código. Me interesa más repasar el proceso para transformar el widget en un ítem del menú de administración de WordPress.

 

La modificación del menú de administración de WP

Cojamos primero el archivo stm-ancora.php que desarrollamos en el artículo ‘6. Nuestro primer plugin’ y seleccionemos todo el código a excepción de la cabecera. Nos vamos ahora al archivo functions.php y pegamos el código seleccionado, y probamos si funciona.

¡Bravo, funcionó! Esto quiere decir que con un tema podemos modificar el menú de administración (para mi no era tan obvio, soy un principiante en WP. Además, falta saber si el resto del código funcionará).

NOTA: Previamente, habremos desactivado el plugin (¡of course!).

 

Adaptación del widget al menú de administración

NOTA PREVIA: Aquí hay que coger el anterior artículo de la serie del Manual de Plugins, ‘8. Ajustes’, y vamos a repasarlo, ya que no es tan obvio a priori.

El proceso es el siguiente:

  • Añadimos el ítem del menú, que a su vez será la sección. Lo enganchamos al hook ‘admin_menu’.
  • Añadimos la sección, que la hacemos coincidir con el slug del ítem del menú.
  • Añadimos el campo de ajuste o selección, que lo incluimos en la sección.
  • Tanto el campo como la sección los enganchamos al hook ‘admin_init’.
  • La función ligada al ítem del menú nos genera (como vimos en ‘6. Nuestro primer plugin’) la página de ajustes.
  • Dentro de la función, creamos un formulario, donde seleccionamos los campos que componen la sección, mediante settings_fields( ‘stm_pagina-inicial’ );.
  • El campo <select> lo dejamos como estaba.
  • El campo donde indicamos los elementos que queremos en el menú pasa a ser así:

  •  

Quedando el código final así:

 

Bien, ahora sí puedo decir que se puede crear un slider, o cualquier otra cosa, dentro de un tema WP, pues se puede sustituir el widget por un elemento del menú.

Para visionarlo por pantalla, ahora sólo tenemos que ir al fichero home.php y sustituir las siguientes líneas:

Por la función widget del widget:

Simplemente, deberemos cambiar donde pone:

Por esto otro:

 

El resultado en el front-end es el mismo que ya teníamos, y en el back-end lo podéis ver aquí:

backend

 

Bien, hemos comprobado cómo podemos incluir un slider o cualquier otra cosa en un tema. En el siguiente artículo de la serie ‘Temas WordPress’ lanzaremos la distribución libre del tema Minority, para que todo el mundo pueda descargarla, probarla, mejorarla, criticarla o lo que le plazca hacer con ella.

Mientras tanto, por mi parte, seguiré con el estudio del Manual de Plugins del Codex de WordPress, que seguro que me ofrecerá más mejoras a realizar, tanto en plugins, como en mis temas.

 

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *