WordPress: ACF en front sin escribir código

Published on : 3 marzo, 2017
4 comments

Hace unos días estuve en las instalaciones que SiteGround España nos brinda al grupo de Meetup de WordPress Madrid explicando cómo mostrar los contenidos de los campos personalizados que habíamos creado con ACF, sin escribir código. Como vimos que era un truco muy útil, lo explico a continuación:

Para este ejercicio necesitaremos:

Bien, lo primero que hacemos es crear con el plugin ACF Post Types un contenedor para los campos personalizados que crearemos a continuación:

 

 

 

Creamos un tipo llamado Libro:

 

Y lo vemos en el menú lateral del backend de WordPress:

A continuación, creamos los campos asociados al tipo Libro:

Bien, ya tenemos una ficha rudimentaria de un libro en backend. Ahora vamos a darle contenido a esta ficha. Para ello creamos 3 libros:

 

 

 

 

 

 

 

 

 

 

 

Y ahora viene el momento de volcarlos al front. Para ello utilizaremos el plugin Custom Content Shortcode, que nos permitirá hacer por ejemplo un bucle y sacar un listado de los libros en una página estática. Si queréis consultar los shortcodes de este plugin, los teneis aquí:

 

 

 

 

 

 

 

 

Entraremos en los ajustes de Custom Content Shortcodes para activar los shortcodes para ACF como veis en la figura que teneis a continuación:

 

 

 

Bien, creamos una página en la que tendremos el listado de las obras que hemos insertado y ponemos los siguientes shortcodes:

 

 

 

 

 

 

 

Podéis observar que para mostrar la fecha he definido un formato de salida. Ahora publicamos la página y vemos el resultado:

4 comments

  1. Silvia Suria Torres

    Hola gracias por la información, sabes alguna manera de mostrar el enlace de un campo de ACF en el cual se utilizó una taxonomía personalizada.


    1. Silvia Suria Torres

      Seguro que en la web de ACF te lo explican, la documentación del plugin es muy completa, y si tienes la licencia PRO, su desarrollador te responde sin problema a cualquier pregunta que le plantees.


XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.