Así es, bueno en el post pasado hablamos de cómo extender Magic Fields (MF), en esta ocasión hablaremos de lo que es Magic Fields.

Magic Fields es un plugin para WordPress (WP) es el cual nos permite que hacer a WordPress un CMS o llegar a tener funcionalidades parecidas a un CMS.

MF nos permite crear Write Panels, los cuales podemos verlos como un serie de post/page con la misma estructura de Custom Fields. Para cada Write Panel podemos agregarle Customs Fields, MF tienen 15 tipos de campos que se pueden agregar, entre los campos que podemos agregar están: Textbox, Multi Textbox, checkbox, dropdown, image, audio, color picker entre otros. Para saber cuales son todos los tipos de custom fields visita la pagina del Wiki donde podrás leer una explicación y un ejemplo de cada campo.

MF también cuenta con la posibilidad de agregar grupos de campos, es decir podemos agregar un grupo y que este grupo contenga campos. Los grupos y campos tienen la característica que se pueden duplicar. Con estas características podemos hacer un sin fin de estructuras para nuestro sitio.

MF cuenta con funciones para poder mostrar el valor de los campos y grupos que tengamos para nuestro Write Panel, dichas funciones funcionan dentro de la estructura del tema de WP. Tenemos por ejemplo get(‘nombre_de_campo’), get_group(‘nombre_del_grupo’), get_image(‘nombre_del_campo’) entre otras, para saber todas las funciones que puedes usar en tu tema puedes visitar la pagina del Wiki dedicados a las funciones de front-end donde además encontraras unos pequeños ejemplos de cómo se usan.

Con ayuda de WP+MF puedes armar una gran diversidad de sitios, solo debes tener bien claro como estructurar tu sitio.

Las instrucciones para instalar MF las pueden leer aquí.

Un futuros post veremos más acerca de MF y de cómo usarlo.

byte

Este post mostrare como tener tener la funcionalidad de vídeo para nuestro sitio con ayuda de MF.

El sábado pasado me llego un email donde me decían si había forma de integrar un campo del tipo video a MF o si había forma de mostrar un video con MF.

En el equipo de desarrollo hemos hablado mucho acerca de este campo, lamentablemente es difícil agregarlo al core del MF, por que? Existe muchos formatos de vídeos y es difícil que algún player de vídeo soporte todos, esto aunado a que seguramente también se querrá que se pudiera mostrar vídeos enlazados de sitios como youtube, vimeo, etc. También tenemos la cuestión de que muchos servidores tienen un máximo de upload y la gran mayorías de los vídeos son pesado. Existe muchas variables a considerar. Por  un lado podríamos hacer un campo para vídeos que sean upload (solo para ciertos formatos) y otro campo donde coloquen la url del vídeo (youtube,vimeo, etc), pero aun así esto implicaría un muy buen análisis de players y lo menos que queremos es llenar el core de MF con muchos plugins externos y hacer más pesado el plugin. Tal vez ahora que ya hemos logrado muchas de nuestras metas a corto y mediano plazo en MF podemos analizar cual es la mejor forma de añadir un campo de vídeo.

Bueno en el email me comentaban que quería incluir el player flowplayer. La forma mas sencilla que encontré para hacer esto posible es usando MF para un upload del vídeo (campo tipo file), añadir flowplayer al tema del sitio y agregar unas cuantas funciones a nuestro functions.php del  tema.

Estos son los pasos a seguir para tener el player en nuestro sitio:

(ya que tenemos instalado correctamente MF en nuestro WP)
1.- Creamos un Write Panel del tipo post (yo lo llame videos)

2.-Al Write Panel videos le agregue un campos tipo file y lo llame video.

Tenemos ya la estructura para crear Post con el Write Panel Video, donde podremos subir un video.

3.- Dentro de la carpeta de nuestro tema (wp-content/themes/nombre_de_nuestro_tema) creamos una carpeta y la llamamos flowplayer, descargamos flowplayer, descomprimimos el archivo y colocamos los siguientes archivos en la carpeta que creamos:
* flowplayer-3.1.4.min.js
* flowplayer-3.1.5.swf
* flowplayer.controls-3.1.5.swf
estos archivos son los necesarios para poder mostrar el video.

4.- en el archivo funtions.php de nuestro tema agregamos el siguiente código:

Código en Gist

Primero tenemos el hook

este hook nos permite añadir al wp_head de nuestro tema el contenido de la funcion script_flow_player y dicha función lo que hace es cargar el archivo de javascript de flowplayer y además tiene una pequeña función de javascript, la cual para todos los elementos con las clase mf_video le añada la funcionalidad de flowplayer (colocar el player).

También tenemos una función llamada get_video, esta función es la que va armar la estructura correcta para el elemento de vídeo. Dentro de ella se pide la ruta del archivo (path del video) y también armamos un id único para cada uno de los elementos, esto por que a flowplayer le tenemos que dar el id del elemento y como sabemos no podemos tener dos elementos con el mismo id. Es por eso que se genera un id unico.
5.- para mostrar el vídeo en nuestro tema solo tenemos que colocar la siguiente línea de código:

y mostrara el video en un tamaño de 520×330.

La funcion get video tiene más parámetros

$fieldName => el nombre de nuestro campo
$groupIndex => índice de nuestro grupo (en caso de pertenecer a un grupo duplicado)
$fieldIndex => índice del campo (en caso de ser un campo duplicado)
$params => un arreglo los cuales nos permitirán cambiar el tamaño del player.

Si nosotros queremos cambiar el tamaño del player podríamos colocar los siguientes códigos:

o

flowplayer tiene muchas mas opciones de la que yo coloco de inicio (player en stop) si ustedes quieren añadir más opciones solo tendrían que agregarlos a la línea de javascript donde se agregar la funcionalidad de flowplayer.

bueno como verán es muy sencillo tener la funcionalidad de video con la base de MF. Espero que les sirva este pequeño tutorial.

Byte