Los campos adaptados en WordPress

Los campos adaptados en WordPress

0 471

Una de las funcionalidades de WordPress que cuando descubres y te acostumbras a utilizar te termina resultando imprescindible son los campos adaptados o custom fields. En este artículo repasaremos qué son y de qué manera podemos sacarle el mejor partido en nuestra web.

¿Qué son los campos personalizados?

Como su nombre indica, son campos de entrada de contenido personalizados, que podemos añadir al editor de nuestras páginas o entradas para poder introducir información de forma diferenciada.

WordPress por defecto ya soporta los campos personalizados. Seguro que los has visto en tus páginas o bien entradas:

ACF-campos-personalizados
Muchas veces, el tema o plantilla que empleamos trae estos campos predefinidos para precisar variables de estilo o bien funcionalidad.

El inconveniente es que la usabilidad de estos campos de WordPress es verdaderamente mala y trabajar con ellos puede llegar a ser muy incómodo y difícil. Por eso en este artículo vamos a usar un plugin gratis que nos va a facilitar mucho esta tarea: Advanced Custom Files.

ACF-AdvancedCustomFields

ACF nos deja crear y editar campos personalizados para nuestra página web de una forma muy visual e intuitiva.

¿Por qué deseamos utilizar campos personalizados?

Imagínate que quieres incorporar en tu web un directorio de empresas, de libros, cursos, profesionales, un portfolio, una lista de colaboradores, etc. Lo que sea se parezca a un listado de entradas que tengan un diseño homogéneo, con unos campos comunes en cada uno de ellos.

Está claro que podemos emplear una página estándar y también ir poniendo un factor debajo de otro, intentando que queden todas y cada una iguales. Pero conforme vayas añadiendo, la página será cada vez más y más extensa, poco práctica de visualizar. El usuario no podrá realizar búsquedas por campos concretos, no podrás ordenarlos de manera automática ni filtrarlos.

También podemos hacerlo con entradas, una para cada elemento, añadiéndolas todas a una categoría específica y así pudiendo filtrarlas y mostrarlas en una página distinguida del resto. Podrás emplear el editor visual para maquetarlo, procurando que queden todas y cada una lo más iguales posibles, pero tampoco podrás filtrar por los campos internos que precises ni realizar búsquedas avanzadas.

Si eres desarrollador y preparas una web para un cliente, todavía se acentuará más el inconveniente. ¿Cómo explicarle de qué forma debe hacer para introducir un nuevo elemento y que quede igual que el resto?

Los campos adaptados resuelven este inconveniente pudiendo crear la estructura de los posts o entradas que necesitas creando un campo para cada uno de ellos de esos datos que serán comunes en todos los elementos y que querremos recuperar para buscas o filtros.

Por ejemplo, en el caso de un directorio de cursos, necesitaremos campos para:

  • Título del curso
  • Descripción
  • Academia o formador del curso
  • Fechas
  • Tipo de curso (on-line / presencial)
  • Precio
  • Enlace para más información
  • etc.

¿Por qué razón no usar un tema que ya traiga esos campos adaptados?

Existen muchos temas o bien plantillas de WordPress concretos para un género de web que ya vienen con géneros de blog post predefinidos para, por ejemplo, portfolio, cartera de servicios, testimonios, etc. Aunque visualmente son muy atractivos y pueden parecer la mejor opción, no es lo más recomendado.

Los temas deberían limitarse a añadir diseño a nuestro WordPress, estilos como tipografía, colores, maquetación de posts, de layouts de páginas, sidebars, etcétera y deben dejar las funcionalidades para plugins, de forma que sea independiente una cosa de la otra, por el hecho de que en el caso contrario nos veremos atados a ese tema, y si en algún instante lo decidimos cambiar, perderemos toda la información que hayamos añadido en esos géneros de blog post y campos del tema.

¿Cómo crear campos adaptados?

Una vez instalado el plugin Advanced Custom Fields, vamos a tener en el menú la opción para crear los campos adaptados sencillamente.

Lo primero va a ser crear un grupo de campos personalizados. Podemos tener los grupos que queramos y detallar en que tipo de posts los desearemos usar. De esta forma podemos usar diferentes tipos de campos personalizados separados y agrupados para diferentes categorías o etiquetas.

ACF-FieldGroups

Podremos apuntar que ese conjunto de campos se aplique a un género de post, a una categoría, a páginas, a una categoría de página concretamente, asociarlo a una etiqueta, etc.

Las otras opciones que tenemos para el conjunto de campos es:

  • Orden: si tenemos múltiples grupos podemos elegir en que orden deben aparecer.
  • Posición: Si queremos que aparezcan tras el título, tras el editor visual o bien en la barra lateral.
  • Estilo: Si se mostrará los campos de este conjunto agrupados en una metabox (la típica caja del editor de WordPress que muestra campos dentro de ella y se puede disminuir al mínimo o desplegar) o no.
  • Ocultar: Qué campos de los que vienen por defecto con WordPress queremos que no se muestren en ese género de blog post o entradas.

Una vez establecidas las características genéricas del grupo, podemos iniciar a agregar cada entre los campos que contendrá

ACF nos pedirá los datos para cada uno de ellos de ellos: etiqueta, título, el género de campo, si es obligatorio o no, las instrucciones para rellenarlo, etcétera Dependiendo del género de campo que escojamos nos solicitará una información o bien otra.

ACF-campos

Además de los modelos más comunes, como texto, numérico, checkbox, e-mail o password, también podemos elegir algunos más avanzados, para anexar ficheros o bien imágenes, editor visual (wysiwyg), selector de data o de color. Otros tipos de campo singulares serían los de estructura, para agrupar campos en pestañitas o incluso de relación, para vincular el campo con otro artículo, una taxonomía, un enlace de página o un usuario.

Otra de las opciones que nos deja es mostrar el campo condicionalmente, esto es, que se muestre o no en función del valor de otro campo.

ACF-condicional

Por ejemplo, en el caso del directorio de cursos que veíamos, ¿qué tipo campos podríamos crear?

  • Título del curso -> podríamos utilizar de forma directa el título del artículo o bien crear uno personalizado de texto.
  • Descripción -> campo wysiwyg para poder darle algo de formato a la descripción.
  • Academia o bien formador del curso : podríamos crear un checkbox para distinguir si es una academia o bien un formador y otro campo de texto para el nombre.
  • Fechas : 2 campos de selector de data, uno para la inicial y otro para la fecha de finalización
  • Tipo de curso (en línea / presencial): en un caso así podríamos crear un select con opciones múltiples, por si acaso el curso se da tanto presencial como online
  • Precio : campo numérico
  • Enlace para más información: campo de url

Podríamos ademas añadir un campo condicional para en caso de que el curso fuera presencial nos mostrara un campo adicional para la dirección del centro donde se da, un campo de imagen para añadir el logo del centro, o bien un banner del curso, etc.

Determinando separadamente cada uno de estos campos nos dejará en la web, con algo de programación a la medida, crear filtros a fin de que el usuario pueda buscar el género de curso que más le resulta interesante.

Como podéis ver, las posibilidades para crear un gestor avanzado de contenidos son enormes merced a todas las opciones que tenemos al crear los campos adaptados.

¿De qué manera mostrar los campos adaptados en nuestra web?

Una vez creados los campos, lo interesante es poder introducirlos en nuestra página de manera que podamos darles un estilo determinado y que siempre y en todo momento se muestren de la misma manera.

La forma más fácil, mas asimismo menos práctica, es hacerlo a través de shortcodes dentro del editor visual de la entrada. Introduciendo el código [acf field=”nombre_campo”] se mostrará en nuestra página web el valor de ese campo concretamente.

ACF-shortcode

Pero si lo que buscamos con estos campos es poder maquetar y entregar un estilo concreto para mostrarlos, la opción de los shortcodes no nos servirá.

La segunda forma, es modificar el tema correspondiente introduciendo los campos y el html que queramos para poder personalizarlo. Para esto, deberemos editar el archivo de página (generalmente page.php, pero va a depender de tu tema) o de entradas (single.php o content.php, también en función del tema) y incorporar donde deseemos que se muestre el valor del campo el código correspondiente:

Es bien difícil generalizar, en tanto que cada theme o bien plantilla puede tener ficheros propios y especiales, con lo que deberemos buscar aquel fichero donde se muestre el contenido del post o bien consultar con sus desarrolladores a fin de que nos señalen cómo hacerlo.

Otra opción, muy recomendada, es combinar los campos adaptados con Custom Artículo Types, géneros de artículo personalizados donde podremos reunir todos esos campos que hemos creado.

Conclusión

Ya sea porque eres desarrollador y deseas facilitar la entrada de datos a tus clientes o pues estás desarrollando tu web y deseas ir un paso más allá en lo que se refiere a la organización de los datos y su forma de mostrarlos, los campos adaptados te pueden ser realmente útiles, y el complemento Advanced Custom Files te puede facilitar mucho el trabajo para llevar tu WordPress un paso más allá, personalizando cualquier plantilla que emplees, sin necesidad de que incorpore los modelos de entradas o bien campos que necesitas.

SIMILAR ARTICLES

NO COMMENTS

Leave a Reply