Añadir botones para compartir en redes sociales en tema Boss Pro de Genesis

En este tutorial vamos a ver cómo añadir fácilmente botones para compartir contenido en redes sociales al tema Boss Pro, un child theme de Genesis.

Boss Pro theme

Boss Pro es una plantilla premium para WordPress de diseño minimalista, cuidado y  elegante. Se trata además de un child theme de Genesis que comparte muchas funcionalidades con otros temas creados a partir de este framework.

Por esta razón vamos a usarlo como ejemplo para añadir botones para compartir contenido en redes sociales. Lo que vamos a ver nos servirá para esta plantilla y para otras, siempre que estén creadas con Genesis.

Por si no lo sabéis, el tema Boss Pro forma parte del curso de puesta a punto de themes donde aprenderéis a instalar y configurar desde cero 10 temas creados con Genesis. Si os interesa, también tenéis a vuestra disposición la segunda parte, el curso para dejar themes de WordPress como en el demo, con 10 temas más :).

Y dicho esto, veamos algunas de las características destacadas de Boss Pro para que podáis conocerlo mejor:

• Encabezado personalizable: Posibilidad de cargar nuestro propio logotipo o bien usar directamente el texto que coincida con nuestra marca, lo que prefiramos.
• Facilidad personalización: Desde el personalizador, permite elegir colores, botones, imágenes de fondo, etc.
• Widget Areas: Cuenta con un total de 7 widget areas propias en la página de inicio, donde podremos mostrar cualquiera de los widgets disponibles.
• Plantillas para páginas: Ofrece dos tipos de plantillas extras, landing y de ancho completo.
• Testimonios: Sección de testimonios donde poder mostrar de forma atractiva las opiniones de nuestros clientes.
• Newsletter: Permite una fácil integración de las listas de correo en nuestro sitio.
• eCommerce: Compatible con WooCommerce.

Además se trata de un theme responsive optimizado para visualizarse correctamente en distintas resoluciones, ya sea en móviles, tablets o cualquier dispositivo, y está preparado para accesibilidad.

Pues bien, ahora que lo conocemos un poquito más, vamos a ver cómo añadir los botones de compartir a nuestro tema.

Instalar plugin

Aunque los botones para compartir en redes sociales no están integrados por defecto en Genesis, añadirlos es muy fácil gracias al plugin gratuito Genesis Simple Share, el cual podemos encontrar en el repositorio de WordPress.

Como supondréis, este plugin sirve sólo para themes creados con Genesis, no es compatible con otros temas, sin embargo sí que se recomienda en muchos de los child themes de Genesis, así que una vez sepáis usarlo podréis replicar el procedimiento en otras plantillas.

Lo primero que haremos, como siempre, será instalarlo. Para ello nos vamos al escritorio de WordPress, "Plugins/Añadir nuevo", escribimos su nombre en el buscador, y una vez lo encontramos, lo instalamos y activamos. De inmediato aparecerá una nueva opción en el menú “Genesis/Simple Share”.

Desde aquí podremos configurar el aspecto y situación de los botones que vamos a añadir, veamos las opciones disponibles:

• Tamaño de icono: Tres tamaños disponibles, "Barra pequeña", que sería el botón de compartir de cada red social en tamaño pequeño y en horizontal, "Barra media", el mismo botón pero un poco más grande, y "Caja", los botones en formato cuadrado.
• Aspecto del icono: Donde podremos elegir entre dos opciones, "Delineado", que corresponde a los iconos en color, y "Rellenado", para añadirlos en color negro.
• Posición a mostrar del icono: Aquí podemos elegir dónde mostrar los iconos. "Antes del contenido", mostraría los iconos en la cabecera, "Después del contenido", añadiría los botones justo al final del contenido, y "Antes y después del contenido", los presentaría tanto en el header como en el footer del contenido.
• Ocultar contador: Por defecto el diseño de los botones para compartir nuestros posts y páginas, aparecerá con un pequeño contador que como habréis visto seguro en algunas ocasiones, va contabilizando las veces que se comparte cada contenido. Puede habilitarse u ocultarse según prefiramos.
• Activar en: En esta sección tenemos un listado con checkbox en el cual podemos seleccionar los tipos de contenido donde queremos que se muestren los botones sociales. Las opciones disponibles son "Post", "Page", que como su nombre indica sería para activar los botones en entradas y páginas respectivamente, "Attachment", para incluirlos en archivos adjuntos, "Testimonial", si queremos permitir compartir los testimonios, "Product", para que aparezcan en las páginas del producto individual, y por último "Mostrar en páginas de archivo", para mostrarlos en la página del blog por ejemplo.

Hasta aquí la primera parte de los ajustes de configuración del plugin. Como veis es todo bastante intuitivo, exceptuando quizá el aspecto que a priori puede que tengáis que probarlo para ver el estilo con el que os quedáis. Pues bien, además de todo esto tenemos una segunda parte de ajustes:

Esta sección nos permite reordenar las posiciones de los botones simplemente arrastrando las cajas, además de elegir los que queremos que se añadan para lo que tenemos que hacer clic en "¿Utilizar este botón?".

Los tres primeros que aparecen por defecto son: "Google+", "Facebook" y "Twitter". Para este último podríamos agregar el nombre de usuario que se añadiría al texto del tweet que se compartiera a través del botón.

También tenemos la opción de incluir el botón de "Pinterest". En este caso, podríamos insertar la URL de una imagen predeterminada que se compartiría en esta red si el contenido elegido no tiene ninguna imagen. Por último tenemos también la posibilidad de incluir botones a "Linkedin" y "StumbleUpon".

Configurar plugin

Pues bien, vistas las opciones posibles, vamos a proceder a realizar la configuración. En este caso queremos mostrar los botones de compartir en Facebook, Twitter y Pinterest al final de los posts.

El tamaño elegido será el pequeño (barra pequeña), y en aspecto elegiremos "Rellenado" para que aparezcan en negrita y concuerden con el estilo del sitio.

Esto podríamos ajustarlo como quisiéramos según lo que cada proyecto necesite, incluso podríamos modificar el estilo mostrado.

Y ya está, de esta sencilla forma tendríamos los botones sociales listos para compartir el contenido de nuestra web, ¿tenéis ya los vuestros? ;).

Resumen y conclusión

Como hemos visto, para añadir los botones de compartir en redes sociales en el tema Boss Pro o en cualquier otro child theme de Genesis tenemos que instalar y activar el plugin "Genesis Share Social" y realizar algunos ajustes.

¡Y hasta aquí el tutorial! Esperamos que os haya sido útil. Si os ha gustado os recomendamos el curso de puesta a punto de themes y el curso para dejar themes de WordPress como en la demo.

Si os suscribís tendréis acceso a los mismos, además de a la plantilla Boss Pro y a muchas otras que se explican en esos cursos, así como a los más de 5718 vídeos disponibles en boluda.com :)