Si su sitio web tiene una página de Facebook, entonces es una buena idea promocionar esto a sus lectores mostrando un cuadro similar a Facebook en la barra lateral del blog..
En este tutorial vamos a crear un widget de WordPress que muestra su cuadro de "Me gusta" de Facebook. Con este widget de WordPress tendrás la opción de mostrar el encabezado de la caja, mostrar tus últimos fans y tu última transmisión de Facebook.
Las páginas de Facebook han estado disponibles por un tiempo y se han convertido recientemente para usar la nueva función de línea de tiempo para mostrar aún más tus publicaciones anteriores en tu perfil..
Una página de Facebook es lo mismo que una página personal, pero usted no puede hacerse amigo de otras personas, esto se debe a que las Páginas de Facebook son para que las empresas se conecten con sus clientes.
Las páginas de Facebook le brindan una relación más dinámica con las figuras públicas y las organizaciones que le interesan..
Si tienes tu propio negocio, también puedes crear tu propia página de Facebook..
Un cuadro similar a Facebook es un complemento social que permite a los propietarios de páginas de Facebook mostrar un botón similar y una secuencia de estado en su propio sitio web.
El cuadro similar significa que los visitantes de su sitio pueden:
Aquí hay un ejemplo del cuadro de "me gusta" de Wptuts + en Facebook.
Para crear un Facebook Like Box para su página de Facebook, debe registrar una aplicación de Facebook para poder utilizar la API de gráfico abierto de Facebook..
Ahora ves lo que es el cuadro de Facebook, podemos entender cómo convertir esto en un widget de WordPress.
Antes de comenzar a codificar el widget, debemos entender qué es un widget de WordPress y cómo podemos utilizar la API de widgets de WordPress para crear fácilmente widgets de WordPress..
Un widget de WordPress es una pieza de código PHP que se ejecutará dentro de una barra lateral de WordPress.
Una barra lateral de WordPress es un área registrada en su tema donde puede agregar widgets de WordPress.
Los widgets de WordPress se pueden agregar fácilmente a las barras laterales al ir a la página de Widgets en el Tablero y navegar a Apariencia -> Widgets. Desde esta página de widgets, puedes arrastrar y soltar los widgets en una barra lateral de tu elección. El widget debe tener algún tipo de formulario de administrador para que pueda editar los datos mostrados por el widget.
WP_Widget
Para crear un widget de WordPress, todo lo que necesita hacer es heredar del estándar WP_Widget
Clase y uso algunas de sus funciones..
Hay tres funciones principales que se deben usar para que el widget funcione. formar()
, widget ()
y actualizar()
.
los WP_Widget
clase se encuentra en wp-includes / widgets.php.
A continuación se muestra la plantilla de un widget de WordPress. Cuando crees un nuevo widget, simplemente copia y pega el código a continuación como punto de partida para tu widget..
/ ** * Agrega el widget Foo_Widget. * / class Foo_Widget extiende WP_Widget / ** * Registrar widget con WordPress. * / public function __construct () parent :: __ construct ('foo_widget', // ID base 'Foo_Widget', // Nombre array ('description' => __ ('A Foo Widget', 'text_domain'),) / / Args); / ** * Pantalla frontal del widget. * * @ver WP_Widget :: widget () * * @param array $ args Argumentos del widget. * @param array $ instance Valores guardados de la base de datos. * / public function widget ($ args, $ instance) extract ($ args); $ title = apply_filters ('widget_title', $ instance ['title']); echo $ before_widget; if (! empty ($ title)) echo $ before_title. $ título. $ after_title; ?> Hola, Mundo!
Creación de Facebook Like Box Widget
Vamos a crear un widget de WordPress para permitirle agregar y cambiar fácilmente un cuadro similar a Facebook en su blog de WordPress.
El beneficio de usar un widget es la flexibilidad que le brindará. La opción que tiene en su casilla de "Me gusta" de Facebook le permite cambiar completamente la funcionalidad simplemente colocando diferentes atributos en la casilla de "Me gusta".
El cuadro Me gusta de Facebook tiene los siguientes atributos:
datos-href
- La URL de tu página de Facebook.ancho de datos
- El ancho de la caja como.caras de muestra de datos
- Un valor verdadero o falso que decide si mostrarás a las personas que gustan de tu página..flujo de datos
- Un valor verdadero o falso que decide si mostrarás tus últimas actualizaciones de estado.encabezado de datos
- Un valor verdadero o falso que decide si nos mostrará la barra de encontrarnos en Facebook..Estas son las opciones que necesitamos para asegurarnos de que el usuario pueda cambiar en la pantalla de administración del widget, para que puedan cambiar el aspecto del cuadro similar directamente en el panel de WordPress..
Ahora sabemos qué esperar del cuadro de "me gusta" de Facebook. Podemos comenzar a codificar..
Primero vamos a registrar el widget en el widget_init
acción.
/ * * Nombre del complemento: Paulund Facebook Like Box * URI del complemento: http://www.paulund.co.uk * Descripción: Un widget que a Facebook le gusta para su sitio web * Versión: 1.0 * Autor: Paul Underwood * Autor URI : http://www.paulund.co.uk * Licencia: GPL2 Copyright 2012 Paul Underwood Este programa es software libre; puede redistribuirlo y / o modificarlo según los términos de la Licencia Pública General de GNU, versión 2, tal como lo publica Free Software Foundation. Este programa se distribuye con la esperanza de que sea útil, pero SIN NINGUNA GARANTÍA; sin ni siquiera la garantía implícita de COMERCIABILIDAD o APTITUD PARA UN PROPÓSITO PARTICULAR. Vea la Licencia Pública General de GNU para más detalles. * / / ** * Registrar el Widget * / add_action ('widgets_init', create_function (", 'register_widget (" pu_facebook_widget ");'));
los register_widget
la función llamará al pu_facebook_widget
clase. En el constructor podemos crear el widget pasando argumentos a la WP_Widget
constructor.
/ ** * Crear la clase de widget y extender desde WP_Widget * / class pu_facebook_widget extiende WP_Widget / ** * Registrar widget con WordPress. * / función pública __construct () parent :: __ construct ('pu_facebook_widget', // ID base 'Facebook Like Box', // Nombre array ('classname' => 'pu_facebook_widget', 'description' => __ ('A widget que muestra un cuadro similar a Facebook desde tu página de facebook. ',' framework '))); // finalizar el constructor
Se llama a la función de widget para generar el widget en la barra lateral. Aquí es donde necesitamos recopilar la entrada de datos del usuario en el panel de control y mostrar el widget en el sitio web.
Utilice la siguiente función para mostrar su cuadro de "Me gusta" de Facebook.
/ ** * Front-end de visualización del widget. * * @ver WP_Widget :: widget () * * @param array $ args Argumentos del widget. * @param array $ instance Valores guardados de la base de datos. * / public function widget ($ args, $ instance) extract ($ args); / * Nuestras variables de la configuración del widget. * / $ this-> widget_title = apply_filters ('widget_title', $ instance ['title']); $ this-> facebook_id = $ instance ['app_id']; $ this-> facebook_username = $ instance ['page_name']; $ this-> facebook_width = $ instance ['width']; $ this-> facebook_show_faces = ($ instance ['show_faces'] == "1"? "true": "false"); $ this-> facebook_stream = ($ instance ['show_stream'] == "1"? "true": "false"); $ this-> facebook_header = ($ instance ['show_header'] == "1"? "true": "false"); add_action ('wp_footer', array (& $ this, 'add_js')); / * Muestra el título del widget si se ingresó uno (antes y después definido por temas). * / if ($ this-> widget_title) echo $ this-> widget_title; / * Me gusta la caja * /?>Es posible que hayas notado que agregamos una acción a la
wp_footer
para ejecutar la funciónadd_js
. Aquí es donde deberá agregar el JavaScript de Facebook para que el cuadro similar funcione correctamente../ ** * Agregar javascripts de Facebook * / public function add_js () echo ' ';Función de actualización
La función de actualización se usa para actualizar la base de datos de WordPress cuando se envía el formulario de administración del widget.
Aquí es donde deberá colocar cualquier validación necesaria en los valores del formulario. Esto requiere 2 parámetros, una matriz de valores enviados para guardarse y una matriz de valores que se almacenan actualmente. El retorno de esta función serán los nuevos valores almacenados en la base de datos..
/ ** * Sanitize los valores del formulario del widget a medida que se guardan. * * @ver WP_Widget :: update () * * @param array $ new_instance Valores recién enviados para guardar. * @param array $ old_instance Valores guardados previamente de la base de datos. * * @return array Se guardaron los valores seguros actualizados. * / update de funciones ($ new_instance, $ old_instance) $ instance = $ old_instance; / * Eliminar etiquetas para título y nombre para eliminar HTML (importante para entradas de texto). * / $ instance ['title'] = strip_tags ($ new_instance ['title']); $ instance ['app_id'] = strip_tags ($ new_instance ['app_id']); $ instance ['page_name'] = strip_tags ($ new_instance ['page_name']); $ instance ['width'] = strip_tags ($ new_instance ['width']); $ instance ['show_faces'] = (bool) $ new_instance ['show_faces']; $ instance ['show_stream'] = (bool) $ new_instance ['show_stream']; $ instance ['show_header'] = (bool) $ new_instance ['show_header']; return $ instance;Función de forma
La función de formulario se utiliza para crear el formulario en el panel de control de widgets. Esto deberá rellenarse previamente con los valores actuales en la base de datos y facilitar al usuario el cambio de los valores para cambiar el comportamiento del widget..
/ ** * Crear el formulario para el administrador de widgets * * @ver WP_Widget :: form () * * @param array $ instance Valores guardados previamente de la base de datos. * / function form ($ instance) / * Configura algunos ajustes de widget predeterminados. * / $ defaults = array ('title' => $ this-> widget_title, 'app_id' => $ this-> facebook_id, 'page_name' => $ this-> facebook_username, 'width' => $ this-> facebook_width , 'show_faces' => $ this-> facebook_show_faces, 'show_stream' => $ this-> facebook_stream, 'show_header' => $ this-> facebook_header); $ instance = wp_parse_args ((array) $ instance, $ defaults); ?>
/>
/>
/>
No es necesario agregar un botón de envío, ya que WordPress lo agregará automáticamente.
Descargar
Eso es todo lo que necesita para crear un complemento de WordPress que cree un widget para mostrar su página de Facebook. Todo lo que tiene que hacer ahora es instalar el complemento, activarlo, agregar el widget a una barra lateral y completar el formulario con los detalles de su página.
Puede descargar este complemento de WordPress.org: descargar Facebook Like Box Plugin