Iconos para los links like y share de vBSEO como en vBHispano

**Angel** · 22/02/2011 11:46

Esta es una pequeña modificación para ponerle iconos en los links Me gusta y Compartir de los mensajes.

1 - Primero editamos la plantilla vbseo_likeshare y buscamos por:

Código HTML:

<a href="#" onclick="return false" class="vbseo_like_link"><vb:if condition="$own_liked">{vb:phrase vbseo_unlike}<vb:else />{vb:phrase vbseo_like}</vb:if></a>

Reemplazar por:

Código HTML:

<a href="#" onclick="return false" class="vbseo_like_link<vb:if condition="$own_liked"> like-icon-del<vb:else /> like-icon</vb:if>"><vb:if condition="$own_liked">{vb:phrase vbseo_unlike}<vb:else />{vb:phrase vbseo_like}</vb:if></a>

2 - Editar la plantilla vbseo_buttons.css y ponemos el siguiente código al principio:

Código HTML:

.vbseo_links .like-icon, .vbseo_links .like-icon-del, .vbseo_links .vbseo_share > A  {
	height: 16px;
	padding-left: 19px;
	display: block;
}
.vbseo_links .like-icon {
	background: url("vbseo/resources/images/forum/vbseo_like_add.png") no-repeat left center transparent;
}
.vbseo_links .like-icon-del {
	background: url("vbseo/resources/images/forum/vbseo_like_del.png") no-repeat left center transparent;
}
.vbseo_links .vbseo_share > A {
	background: url("vbseo/resources/images/forum/vbseo_share.png") no-repeat left center transparent;
}

El código CSS bien podría ir en la plantilla additional.css, el ponerlo en la de vBSEO es preferencia mia.

4 - Descargar el archivo zip y subir las imagenes al directorio vbseo/resources/images/forum/

Screenshot:
likeiconssshoot.jpg

**hotcubano** · 22/02/2011 13:16

Instalado

Ed: No me sale el corazon. Y probe el paso 2 con las dos plantillas, y no se ve. Lo demas si esta bien. Que puede ser?

---------- Actualizado a las 20:16 ---------- Original a las 19:09 ----------

De la forma anteiror no me salia las imagen del corazon. Y lo hice de esta forma para el que le sirva.

Descargamos y subimos las imagenes donde explican mas arriba.

Entramos a adminCP> Idiomas y Frases> Buscar en fases> y buscamos la frase like en el producto vbseo. Depues editamos el que dice like solo, y en la traduccion al espanol ponemos esto

Código HTML:

<img src="vbseo/resources/images/forum/vbseo_like_add.png" /> Me Gusta

Y guardan.

Ahora para hacen los mismo de arriba, solo buscando la frase unlike
y utilizan este codigo

Código HTML:

<img src="vbseo/resources/images/forum/vbseo_like_del.png" /> Ya no me Gusta

Ahora para hacen los mismo de arriba, solo buscando la frase share
y utilizan este codigo

Código HTML:

<img src="vbseo/resources/images/forum/vbseo_share.png" /> Compartir

**Angel** · 22/02/2011 13:29

Era error con la clase, había puesto otra diferente en el código, ahí lo he corregido.

Saludos.

**~~Agustin~~** · 22/02/2011 13:36

Se parece a mi post thank you hack?
jajaja.
Buena Angel!!!!!
Salen Likes

**tetsenoske** · 22/02/2011 18:55

@hotcubano: de echo ... yo lo hice del mismo modo que tu men y si me funciono XD jejejejee
asi lo hice yo.. la forma mas sencilla

**hotcubano** · 23/02/2011 01:58

Iniciado por tetsenoske

@hotcubano: de echo ... yo lo hice del mismo modo que tu men y si me funciono XD jejejejee
asi lo hice yo.. la forma mas sencilla

Igualmente. Por eso lo deje, ya tenemos dos formas de hacerlo.

**Angel** · 23/02/2011 10:11

Se me había ocurrido hacer algo así, pero preferí tener la modificación en las plantillas y no en el lenguaje. De esa manera mantengo todo en el estilo y la traducción se queda solo como eso, frases traducidas y no parte de la presentación del foro :p

**XxArcangelxX** · 28/02/2011 19:36

¿Existe la traducción al español de este producto?

He intentado traducir, pero no llego a conseguirlo por el tema de las:

{1}">{2} (No llego a entender el funcionamiento).

Gracias, un saludo.

**Eduardo Leon** · 28/02/2011 21:47

{1}">{2} ??

Que yo sepa : {1} es una "traduccion" por ejemplo :

Sin traducir :

{1} liked this

lo traduces :

{1} le gusta esto.

entonces : {1} es como la variable de un usuario, como en el post anterior :

{1} le gusta esto :

en vbulletin (posts) :

X le gusta esto

Sabiendo que X es un usuario ..

Solo son variables que son necesarias en vbulletin ..

Saludos !

**lino** · 27/03/2011 13:45

de alguna manero esto se pudiera integrar a vbulletin???, esk esas planillas son de vbseo, y yo teng oes vbulletin, sera que se puede??

muchas gracias, no sabia k vbseo era un pligin, gracias ya estat

**el_kakO** · 26/04/2011 21:30

me sale muy junto Sin título.jpg

**el_kakO** · 01/05/2011 15:47

alguien sabe porque

**josekast** · 06/06/2011 13:23

Me gusta el resultado, una pregunta.
Como puedo hacer que aparezca el botón Me gusta | Compartir al pasar el mouse encima del mensaje tal como sucede en el foro?
Gracias!!

**josekast** · 10/06/2011 16:51

Me fijado en vuestro codigo fuente y apraece asi:

Código HTML:

<ul style="visibility: hidden;" class="v b s e o_links">

En el mio aparece asi:

Código HTML:

<ul class="v b s e o_links" style="visibility: visible;">

He modificado la plantilla, v b s e o_buttons.css
Le cambie el visibility: hidden pero entonces se oculta y no hace el efecto que al pasar encima del mensaje se muestre.

Alguna idea???

**uben** · 16/06/2011 22:03

disculpen pero esto es para 3.8.X O PARA VBULLETIN 4.X
y SI ES PARA LA VERSION CUATRO PUEDEN MODIFICAR EL CODIGO PARA LA VERSION 3.8.X PORFAVOR

Iconos para los links like y share de vBSEO como en vBHispano

LinkBack

Herramientas

Califica este tema

Visualizar

Temas similares

poner iconos redes sociales en cada respuesta como vbhispano Respuestas: 4

poner iconos redes sociales en cada respuesta como vbhispano Respuestas: 4

sacar iconos del linkback (Bookmark & Share) Respuestas: 1

iconos redes sociales de vbhispano? Respuestas: 1

como desactivo el Automatically retrieve titles from external links del vBSEO Respuestas: 2

Iconos para los links like y share de vBSEO como en vBHispano

Re: Iconos para los links like y share de vBSEO como en vBHispano

Re: Iconos para los links like y share de vBSEO como en vBHispano

Re: Iconos para los links like y share de vBSEO como en vBHispano

Re: Iconos para los links like y share de vBSEO como en vBHispano

Re: Iconos para los links like y share de vBSEO como en vBHispano

Re: Iconos para los links like y share de vBSEO como en vBHispano

Re: Iconos para los links like y share de vBSEO como en vBHispano

Re: Iconos para los links like y share de vBSEO como en vBHispano

Re: Iconos para los links like y share de vBSEO como en vBHispano

Re: Iconos para los links like y share de vBSEO como en vBHispano

Re: Iconos para los links like y share de vBSEO como en vBHispano

Re: Iconos para los links like y share de vBSEO como en vBHispano

Re: Iconos para los links like y share de vBSEO como en vBHispano

Re: Iconos para los links like y share de vBSEO como en vBHispano

Etiquetas para este tema

Sobre vBHispano

Links

Patrocinadores