Botones de redes sociales para wordpress

Hoy vamos a ver varias maneras de insertar los botones de  redes sociales para wordpress, para algunas de estas formas es necesario tener wordpress auto alojado y disponer de claves de acceso a FTP, pero también diré otras que son algo mas fáciles por medio de widgets.

• Flare. Es un plugin que permite colocar las barras de iconos sociales a la izquierda o derecha de los posts, los iconos son bastante customizables, muy fácil de usar e instalar y es gratis.

• Shareaholic. Es un plugin que permite colocar las barras de iconos sociales con distintos diseños, personalizaciones, distribución por el layout de la página y muestra cuántas veces se han compartido en las redes cosa que es muy útil a la hora de promocionar el artículo, por si fuera poco también te da estadísticas , funciona muy bien y creo que es de los mejores que existen.

• Mashsharer Es un pluggin bastante mas complicado de lo que parece a la hora de customizar, pero la gran variedad de redes que te permite mostrar ya vale la pena, aparte los botones grandes son preciosos y queda muy elegante nada cursi, a mí me encanta como muestra las veces que se ha compartido y lo que mas me gusta!!! puedes hacer un extracto manual de lo que quieres mostrar en las redes a la hora de compartir, o sea un spoiler de tu post!!.

• Existen mas pluggins, pero estos no presentan problemas, tened en cuenta que si tenéis que poner en algún momento una pasarela bancaria, el banco puede pediros la retirada de los Share This para concederla, porque no está bien visto ese tipo de enlaces salientes de la web, e incluso pueden entra en conflicto a la hora de obtener certificados de seguridad en el sitio, por tanto si el tema de WP no los tiene incorporados intentar buscar lo mas compatible posible.

La manera clásica de añadir botones de redes sociales para wordpress es mediante el widget de texto, simplemente es subir las imágenes a WP y mediante este código apareceran, lo bueno es que puedes poner redes sociales que no son las mas comunes por ejemplo Domestika y Behance.

Lo malo que se pueden poner en todas partes dónde vayan los widgets, pero si quieres ponerlo en otra parte tendrás que hacer un chid theme y realizar un overriding sobre el tema existente y modificar functions.php y crear otra hoja de estilo.css lo explico al final pero veréis que benditos widgets!!

<a href="https://la url de tu cuenta social/"><img SRC="la url de la imagen de boton que has subido" WIDTH="tamaño" HEIGHT="tamaño" /></a>

<a href="https://www.facebook.com/negocioscaninos?ref=bookmarks"><img SRC="la url de la imagen de boton que has subido" WIDTH="60" HEIGHT="60" /></a>

Imaginemos que que queréis colocar los botones de redes sociales para wordpress sobre la barra de búsqueda, primero tenéis que tener hecho el child theme y por favor todo con copia por si acaso no os gusta el resultado:

Creamos un archivo functions.php en el child theme y colocamos esto para crear otra barra lateral o contenedor para los iconos:

<?php
function gpe_widget_init() {
	register_sidebar( array(
		'name' => __( 'Header Sidebar', 'twentyeleven-child' ),
		'id' => 'header-sidebar',
		'before_widget' => '<div id="%1$s" class="widget %2$s">',
		'after_widget' => "</div>",
		'before_title' => '<h3 class="widget-title">',
		'after_title' => '</h3>',
	) );
}
add_action( 'widgets_init', 'gpe_widget_init' );

Ahora en el tema principal buscamos algo parecido a esto en el archivo header.php

<?php
	else :
?>
	<?php get_search_form(); ?>
<?php endif; ?>
<nav id="access" role="navigation">

y lo cambiamos por esto:

<?php
	else :
		if ( is_active_sidebar( 'header-sidebar' ) )
			dynamic_sidebar( 'header-sidebar' );
		 get_search_form(); ?>
	<?php endif; ?>
<nav id="access" role="navigation">

Ahora está creado el widget pero los iconos están hechos unos zorros así que en el child theme 
justo después de la linea principal de style.css

#branding #searchform {
	top: 6.5em!important;
}
#branding #searchform input {
	width:116px!important;
}
#branding .widget {
	display: inline-block!important;
	position:absolute;
	top: 2.5em;
	right: 6.5%;
}
#branding .widget h3{
	line-height:1.6em;
}
#branding .socialmedia-buttons img {
	display: inline;
	width: auto!important;
}

importante si no queréis que se salga de la barra de búsqueda medirla por ejemplo yo tengo 220px

#branding #s {
	width:116px;
}

Luego los parámetros los podéis cambiar como queráis

Aquí os dejo Iconos sociales para que los podáis descargar mas botones de redes sociales para wordpress.

Están en mi dropbox