Añade botones para compartir JsSocials a tu tema de WordPress

JsSocials es un plugin jquery que agrega botones para compartir tu contenido vía redes sociales. Esta es una pequeña guía para implementarlo en tu tema de WordPress.

Paso 1: descargar los archivos de JsSocial.

Facil, basta con ir a la pagina oficial de JsSocial y descargar el archivo zip. Ahórrate el tiempo con este enlace directo.

Descargar JsSocials

Ahora toca extraer los archivos del zip. al extraer obtendrás una carpeta llamada ‘jssocials-1.4.0’ o algo similar (según la versión actual). Es recomendable que renombres la carpeta a simplemente ‘jssocials’.

Paso 2: subir los archivos JsSocials a la carpeta de tu tema

Sube los archivos de JsSocials (con todo y carpeta) en la raíz de tu tema que por lo general es ‘wp-content/themes/nombre_del_tema’. La ruta de tu carpeta JsSocials sería ‘wp-content/themes/nombre_del_tema/jssocials’.

Paso 3: integrar JsSocials al funcionamiento de tu tema

La implementación de JsSocials requiere de editar, primero, el archivo functions.php.

Agrega este código a functions.php.

function jssocials_scripts() {

wp_enqueue_style( ‘mytheme-jssocials’, get_template_directory_uri() . ‘/jssocials/jssocials.css’ );

wp_enqueue_style( ‘mytheme-jssocials-flattheme’, get_template_directory_uri() . ‘/jssocials/jssocials-theme-flat.css’);

wp_enqueue_script(‘mytheme-jssocials-js’, get_template_directory_uri().’/jssocials/jssocials.min.js’, array(‘jquery’)

}

add_action( ‘wp_enqueue_scripts’, ‘jssocials_scripts’ );

Para variar entre los distintos temas que nos ofrece JsSocials, basta con editar en el código el texto ‘jssocials-theme-flat.css’ (del código anterior) por el nombre de cualquiera de los siguientes temas:

  • jssocials-theme-flat.css – flat theme
  • jssocials-theme-classic.css – classical theme with raised buttons
  • jssocials-theme-minima.css – minimalistic theme with logos instead of buttons
  • jssocials-theme-plain.css – monochromatic theme
botones para compartir JsSocials

Por último, para que aparezcan los botones de compartir en tus post de wordpress, es necesario editar el archivo content-single.php. Debes ubicar el código dónde quieras que aparezca, por ejemplo yo lo tengo ubicado antes del inicio de la etiqueta ‘<header>’

<div id="share"></div>
<script>
	jQuery( document ).ready( function( $ ) { 
        $("#share").jsSocials({
            shares: ["twitter", "facebook", "googleplus", "linkedin", "pinterest", "whatsapp"],
            showLabel: true,
			showCount: true,
			shareIn: "popup"
        });
	});
</script>

Eso es todo. Si algo no te sale, no dudes en preguntar a través de los comentarios.

Deja una respuesta

Mira más contenido relacionado

¿Cómo agregar una imagen de perfil a Zoom en Windows y Android?

por Tecneófito, agosto 17, 2021

Agregar una imagen de perfil a Zoom no es una tarea complicada, pero primero veamos...

Cómo utilizar el análisis de la competencia para mejorar su SEO

por Tecneófito, agosto 9, 2021

El análisis de la competencia no es una estrategia nueva. La historia nos ha mostrado...

¿Por qué la música de Spotify se pausa sola y como solucionarlo?

por Tecneófito, mayo 4, 2020

Spotify se ha visto afectado por una serie de problemas que hacen que las canciones...

¿Cómo abrir archivos RTF en PC usando Google Chrome?

por Tecneófito, mayo 3, 2020

Probablemente esté aquí porque no puede abrir el archivo con la extensión ".rtf" o...

Cómo mover mi blog de Wix a WordPress

por Tecneófito, abril 28, 2020

Wix es un impresionante creador de sitios web que parece perfectamente adaptado a...

Cómo proteger su perfil de Netflix usando un código PIN

por Tecneófito, abril 20, 2020

Netflix es una de las principales plataformas de streaming para ver películas y...