Descubre en este tutorial cómo obtener y mostrar todos los temas de una instalación remota de WordPress usando la API REST.
Es posible que en algunos casos te interese mostrar (u obtener) todos los temas de una instalación remota de WordPress, incluyendo la versión, el autor u otros datos.
Así que en este tutorial vas a aprender cómo puedes obtener un listado de todos los temas de una instalación de WordPress usando la API REST. Este sería el resultado:
Vamos a verlo:
Pasos para mostrar todos los temas de una instalación de WordPress usando la API REST
1. Crea una contraseña para la API REST
Lo primero que tienes que hacer es crear una nueva contraseña de aplicación.
Para ello ve (en la instalación de WordPress donde te quieres autenticar) a Usuarios > Perfil y haz scroll hasta el apartado de «Contraseñas de aplicación».
A continuación rellena el campo de nombre de nueva contraseña (puede ser cualquiera) y pulsa en «Añadir una nueva contraseña de aplicación».
Una vez hecho, se mostrará el nombre de la contraseña y la contraseña. Asegúrate de copiarla y guardarla a buen recaudo porque no volverán mostrarse.
2. Obtén los datos del endpoint y muéstralos mediante un shortcode
Una vez que tienes las credenciales para poder autenticarte con la API REST ya puedes hacer la llamada al endpoint para obtener la información sobre los temas.
Además, vas a encapsular estos datos dentro de un shortcode para poder mostrar el listado donde quieras.
Añade el siguiente snippet al fichero functions.php o a tu plugin de funcionalidades:
Para ver este código y los otros 2055 snippets de esta web,
identifícate o suscríbete aquí.
Con este código creas un shortcode que te permite mostrar un listado con todos los temas de una instalación remota de WordPress usando el shortcode [theme_list].
En la primera parte del snippet defines las variables:
$username= Nombre de usuario de WordPress$password= Contraseña de aplicación obtenida en el paso anterior$website_url= La URL de la web$request_url = La URL donde se hace la petición. En este caso es la concatenación:$website_url . '/wp-json/wp/v2/themes/'que accede al endpoint para temas de la API REST.
Acuérdate de cambiar el valor de las siguientes variables por las de tu caso.
A continuación usas la función wp_remote_request para obtener el endpoint para temas (con el método GET).
La parte de la autenticación se realiza en la cabecera (‘headers’) utilizando la función base64_encode para que cifre el usuario y contraseña.
Una vez que obtienes la información enviada por la API utilizas las funciones wp_remote_retrieve_body para extraer los datos del cuerpo y json_decode para decodificarla.
Y cuando ya tienes el array con los datos, usas un bucle (foreach) para extraer la información que te interesa.
En este caso, 3 detalles sobre la información del tema:
- Nombre del tema
[name->rendered]> con enlace al mismo[theme_uri->rendered] - Versión del tema
[version] - Nombre del autor
[author->rendered]> con enlace al mismo[author_uri->rendered]
Pero puedes eliminar o añadir más para personalizarlo a tu gusto. Estos son todos lo detalles que puedes mostrar:
[stylesheet][template][name][theme_uri][author][author_uri][description][version][tags][requires_wp][requires_php][textdomain][theme_supports][screenshot][status]
Tienes más información al respecto en página oficial para desarrolladores de WordPress.
Por ejemplo, para el tema de Twenty Twenty-Two devuelve algo así:
Array ( [0] => stdClass Object ( [href] => https://tuweb.com/index.php/wp-json/wp/v2/themes ) ) ) ) [3] => stdClass Object (
[stylesheet] => twentytwentytwo
[template] => twentytwentytwo
[requires_php] => 5.6
[requires_wp] => 5.9
[textdomain] => twentytwentytwo
[version] => 1.0
[screenshot] => https://tuweb.com/wp-content/themes/twentytwentytwo/screenshot.png
[author] => stdClass Object ( [raw] => the WordPress team [rendered] => the WordPress team )
[author_uri] => stdClass Object ( [raw] => https://wordpress.org/ [rendered] => https://wordpress.org/ )
[description] => stdClass Object ( [raw] => Built on a solidly designed foundation, Twenty Twenty-Two embraces the idea that everyone deserves a truly unique website. The theme’s subtle styles are inspired by the diversity and versatility of birds: its typography is lightweight yet strong, its color palette is drawn from nature, and its layout elements sit gently on the page. The true richness of Twenty Twenty-Two lies in its opportunity for customization. The theme is built to take advantage of the Full Site Editing features introduced in WordPress 5.9, which means that colors, typography, and the layout of every single page on your site can be customized to suit your vision. It also includes dozens of block patterns, opening the door to a wide range of professionally designed layouts in just a few clicks. Whether you’re building a single-page website, a blog, a business website, or a portfolio, Twenty Twenty-Two will help you create a site that is uniquely yours. [rendered] => Built on a solidly designed foundation, Twenty Twenty-Two embraces the idea that everyone deserves a truly unique website. The theme’s subtle styles are inspired by the diversity and versatility of birds: its typography is lightweight yet strong, its color palette is drawn from nature, and its layout elements sit gently on the page. The true richness of Twenty Twenty-Two lies in its opportunity for customization. The theme is built to take advantage of the Full Site Editing features introduced in WordPress 5.9, which means that colors, typography, and the layout of every single page on your site can be customized to suit your vision. It also includes dozens of block patterns, opening the door to a wide range of professionally designed layouts in just a few clicks. Whether you’re building a single-page website, a blog, a business website, or a portfolio, Twenty Twenty-Two will help you create a site that is uniquely yours. )
[name] => stdClass Object ( [raw] => Twenty Twenty-Two [rendered] => Twenty Twenty-Two )
[tags] => stdClass Object ( [raw] => Array ( [0] => one-column [1] => custom-colors [2] => custom-menu [3] => custom-logo [4] => editor-style [5] => featured-images [6] => full-site-editing [7] => block-patterns [8] => rtl-language-support [9] => sticky-post [10] => threaded-comments ) [rendered] => one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments )
[theme_uri] => stdClass Object ( [raw] => https://github.com/wordpress/twentytwentytwo/ [rendered] => https://github.com/wordpress/twentytwentytwo/ )
[status] => inactive
[_links] => stdClass Object ( [self] => Array ( [0] => stdClass Object ( [href] => https://tuweb.com/index.php/wp-json/wp/v2/themes/twentytwentytwo ) )
[collection] => Array ( [0] => stdClass Object ( [href] => https://tuweb.com/index.php/wp-json/wp/v2/themes ) ) ) ) )Así que puedes personalizar los detalles que prefieras que se muestren.
Si tienes alguna duda o sugerencia puedes dejarla en los comentarios.
Para poder ver el listado solo te queda un paso.
2. Introduce el shortcode donde quieras
La ventaja de los shortcodes es que puedes insertarlos en cualquier punto de la web.
Solo tendrás que escribir [theme_list] donde quieras que se visualice.
Importante:
- Si estás utilizando el editor clásico, utiliza la pestaña de HTML para introducir el shortcode.
- En caso de que ya estés usando el nuevo editor de bloques (Gutenberg) puedes añadirlo al bloque normal de párrafo, el de HTML o el de shortcode. Todos ellos renderizarán de forma correcta el contenido.
Este sería un ejemplo del listado que mostraría el shortcode:
Conclusiones
Ahora ya sabes cómo utilizar la API REST para obtener y mostrar todos los temas de una instalación remota de WordPress.
Si tienes alguna duda te leo en los comentarios. Y si quieres dejarme una sugerencia para futuros tutoriales, envíamela a través del formulario de contacto.
Todo ventajas de ser suscriptor. 😉
