Como creo botones de twiter y facebook personalizados para compartir una entrada?

Mugiwara · 2014-08-30T21:23:12-0500

Buenas noches, Alguien sabe como hacer para que cada vez que le den clic a estas imágenes se comparta mi entrada de blogger? en facebook y twiter.
Que código tengo que ponerle? ya he intentado con el que dan en facebook y twiter, pero no se como ponerlo con la imagen.
Estas imágenes las pondré dentro de la entrada.

Gracias.

kanikase · 2014-08-30T21:26:31-0500

Yo hice unos :welcoming:

css:

Insertar CODE, HTML o PHP:

.sprite-share{
	background: url(images/sprite.png);
	width:150px;
	height:40px;
	margin-left:10px;
	background-repeat:no-repeat;
	border-radius:3px;
	-moz-border-radius:3px;
	-ms-border-radius:3px;
	-webkit-border-radius:3px;
}
.fbshare{
	float:left;
	background-position:0px 0px
}.fbshare:hover{
	border:3px solid #FF3D00;
	margin:-3px 0 0 7px
}.ttshare{
	float:right;
	background-position:0px -42px
}.ttshare:hover{
	border:3px solid #FF3D00;
	margin:-3px -3px 0 0;}

JS:

Insertar CODE, HTML o PHP:

//Compartir en Facebook y Twitter
function sharetw() {
	var win=window.open('http://twitter.com/share?u='+document.URL,'facebook-share-dialog','width=626,height=336');
	return win
}
function sharefb() {
	var win=window.open('https://www.facebook.com/sharer/sharer.php?u='+document.URL,'facebook-share-dialog','width=626,height=436');
	return win
}

HTML:

<a href="javascript:sharefb()" title="Compartir en Facebook"><div class="sprite-share fbshare"></div></a>
<a href="javascript:sharetw()" title="Compartir en Twitter"><div class="sprite-share ttshare"></div></a>
<div style="clear:both"></div>

La imagen:

Mugiwara · 2014-08-31T19:06:59-0500

kanikase dijo:

Yo hice unos :welcoming:

css:

Insertar CODE, HTML o PHP:

.sprite-share{
	background: url(images/sprite.png);
	width:150px;
	height:40px;
	margin-left:10px;
	background-repeat:no-repeat;
	border-radius:3px;
	-moz-border-radius:3px;
	-ms-border-radius:3px;
	-webkit-border-radius:3px;
}
.fbshare{
	float:left;
	background-position:0px 0px
}.fbshare:hover{
	border:3px solid #FF3D00;
	margin:-3px 0 0 7px
}.ttshare{
	float:right;
	background-position:0px -42px
}.ttshare:hover{
	border:3px solid #FF3D00;
	margin:-3px -3px 0 0;}

JS:

Insertar CODE, HTML o PHP:

//Compartir en Facebook y Twitter
function sharetw() {
	var win=window.open('http://twitter.com/share?u='+document.URL,'facebook-share-dialog','width=626,height=336');
	return win
}
function sharefb() {
	var win=window.open('https://www.facebook.com/sharer/sharer.php?u='+document.URL,'facebook-share-dialog','width=626,height=436');
	return win
}

HTML:

<a href="javascript:sharefb()" title="Compartir en Facebook"><div class="sprite-share fbshare"></div></a>
<a href="javascript:sharetw()" title="Compartir en Twitter"><div class="sprite-share ttshare"></div></a>
<div style="clear:both"></div>

La imagen:

Ver el archivo adjunto 34075

Disculpa las molestias, pero donde los pego para que aparezcan después del titulo de todas las entradas ?
y muchas gracias por los codigos

Como creo botones de twiter y facebook personalizados para compartir una entrada?

Mugiwara Seguir

kanikase

Mugiwara