Tutorial: Botones y Sharebar de Compartir sin Plugins (Responsivo)

lordskorpius · 28 Ene 2015

pulga91 dijo:
Revisando un poco el primer post, me doy cuenta de un error que sorpresivamente no me deja corregir el foro

En el css para movil hay un error

Insertar CODE, HTML o PHP:

media screen and (max-width:550px){

Deberia ser

Insertar CODE, HTML o PHP:

@media screen and (max-width:550px){

Probablemente ese sea tu problema

Saludos

Si, tambien tuve ese problema pero pude fijarme y corregirlo, aunque olvidé pasar a aclararlo, por cierto sigo desde entonces con lo aplicado en este tutorial y tambien me puse el botón de whatsapp :encouragement:

raul25r · 30 Ene 2015

Alguien sabe por que me salen en vertical en vez de horizontal?

lordskorpius · 30 Ene 2015

raul25r dijo:
Alguien sabe por que me salen en vertical en vez de horizontal?
Ver el archivo adjunto 45073

¿Agregaste el css correctamente? Parece que no lo has puesto bien.

pulga91 · 30 Ene 2015

raul25r dijo:
Alguien sabe por que me salen en vertical en vez de horizontal?
Ver el archivo adjunto 45073

el css es incorrecto o bien no colocaste todos los divs, revisa tanto el css como los divs

raul25r · 31 Ene 2015

Me rindo... será por qué mi theme es responsive y tiene sus propios botones sociales y será más difícil de configurar. Puede que el css lo coja de otro lugar o este divido, no se... lo cierto no puedo con él. Solo quería estos botones por el botón de whatsapp. Me tendré que aguantar, de todas formas gracias por vuestra ayuda. Por cierto mi theme es sahifa.

Gerard2702 · 31 Ene 2015

Me gustaron mucho los botones, mas como se miran en el movil.
Gracias. :encouragement:

pulga91 · 31 Ene 2015

raul25r dijo:
Me rindo... será por qué mi theme es responsive y tiene sus propios botones sociales y será más difícil de configurar. Puede que el css lo coja de otro lugar o este divido, no se... lo cierto no puedo con él. Solo quería estos botones por el botón de whatsapp. Me tendré que aguantar, de todas formas gracias por vuestra ayuda. Por cierto mi theme es sahifa.

si el css y el html esta tal cual puesto... no tendria por que tomar el css de otro lado, si gustas pasar la direccion del sitio se podria revisar cual es el problema, mis themes tambien son responsive

saludos

lordskorpius · 31 Ene 2015

raul25r dijo:
Me rindo... será por qué mi theme es responsive y tiene sus propios botones sociales y será más difícil de configurar. Puede que el css lo coja de otro lugar o este divido, no se... lo cierto no puedo con él. Solo quería estos botones por el botón de whatsapp. Me tendré que aguantar, de todas formas gracias por vuestra ayuda. Por cierto mi theme es sahifa.

Fíjate que tu plantilla no tenga un css similar, puedes colocar inspeccionar elemento sobre los botones que te quedaron y ver que elementos puedes añadir o ir eliminando.

pulga91 · 6 Feb 2015

buenas... solo para comentarles que tengo la version con imagenes sprite...
la sharebar inferior quedo con los botones de fb,tw,g+,pinterest,tumblr y whatsapp
el de compartir dentro de los post con los botones, fb,tw,g+,pinterest,tumblr,whatsapp,flipboard,interesante y weheartit

si alguien esta interesado en ella mandeme un privado
saludos

gerry211 · 8 Feb 2015

Muchas gracias amigo

Bruno · 8 Feb 2015

se puede hacer que los botones solo compartan una url especifica?

pulga91 · 9 Feb 2015

Bruno dijo:
se puede hacer que los botones solo compartan una url especifica?

Insertar CODE, HTML o PHP:

<li><a href="https://www.facebook.com/sharer/sharer.php?u=<?php the_permalink(); ?>&t=<? echo urlencode(get_the_title()) ?>" target="_blank" rel="nofollow" title="Compartir en Facebook" onclick="window.open(this.href, 'mywin','left=20,top=20,width=500,height=500,scrollbars=1,toolbar=0,resizable=0'); return false;" ><img src="miurl.com/facebook.png"></a></li>

si, tendrias que editar el codigo, cambiando

Insertar CODE, HTML o PHP:

<?php the_permalink(); ?> y <? echo urlencode(get_the_title()) ?>

por el link y el titulo

saludos

Bruno · 9 Feb 2015

pulga91 dijo:

Insertar CODE, HTML o PHP:

<li><a rel="nofollow" href="https://www.facebook.com/sharer/sharer.php?u=<?php the_permalink(); ?>&t=<? echo urlencode(get_the_title()) ?>" target="_blank" rel="nofollow" title="Compartir en Facebook" onclick="window.open(this.href, 'mywin','left=20,top=20,width=500,height=500,scrollbars=1,toolbar=0,resizable=0'); return false;" ><img src="miurl.com/facebook.png"></a></li>

si, tendrias que editar el codigo, cambiando

Insertar CODE, HTML o PHP:

<?php the_permalink(); ?> y <? echo urlencode(get_the_title()) ?>

por el link y el titulo

saludos

muchas gracias, otro buen cambio seria que los botones solo se muestren cuando terminas de leer el post para asi aprovechar que al inicio el usuario pueda leer en pantalla completa... :encouragement:

edizzz · 10 Feb 2015

Al compartir en whatsapp me sale el codigo php asi:
<? echo urlencode(get_the_title())?>|<?php echo urlencode(get_permalink())?>
el div lo puse en content.php del tema hijo de fifteen

Zentraedi · 10 Feb 2015

Genial gracias por el aporte

"write once, run anywhere”

pulga91 · 12 Feb 2015

edizzz dijo:
Al compartir en whatsapp me sale el codigo php asi:
<? echo urlencode(get_the_title())?>|<?php echo urlencode(get_permalink())?>
el div lo puse en content.php del tema hijo de fifteen

si, es un error de wordpress en una de las ultimas actualizaciones dejo de funcionar correctamente...
no le busque solucion la verdad, me limite a dejar el boton visible tanto para desktop como para mobiles ya que personalmente en mis sitios registro visitas desde web.whatsapp.com

para dejarlo visible solo basta con remover la funcion php

cambiar

Insertar CODE, HTML o PHP:

<?php
if ( wp_is_mobile() ) {
echo '<li><a href="whatsapp://send?text=<? echo urlencode(get_the_title()) ?> | <?php echo urlencode(get_permalink()) ?>" data-action="share/whatsapp/share" rel="nofollow" title="Compartir en Whatsapp"><img src="miurl.com/whatsapp.png"></a></li>';
} else {
echo '';
}
?>

por

Insertar CODE, HTML o PHP:

<li><a href="whatsapp://send?text=<? echo urlencode(get_the_title()) ?> | <?php echo urlencode(get_permalink()) ?>" data-action="share/whatsapp/share" rel="nofollow" title="Compartir en Whatsapp"><img src="miurl.com/whatsapp.png"></a></li>

saludos

serviredactor · 14 Feb 2015

muchas gracias amigo, cuando tenga mi primeros trabajos personales haré estos cambios, muchas gracias

CristianL15 · 16 Feb 2015

a favoritos :encouragement:

tonex · 17 Feb 2015

Gracias por compartir 😉 !!

victor89 · 26 Mar 2015

justo lo que buscaba gracias :encouragement:

Tutorial: Botones y Sharebar de Compartir sin Plugins (Responsivo)

lordskorpius

raul25r

lordskorpius

pulga91

raul25r

Gerard2702

pulga91

lordskorpius

pulga91

gerry211

Bruno

pulga91

Bruno

edizzz

Zentraedi

pulga91

serviredactor

CristianL15

tonex

victor89

Temas similares