Algo admirado por muchos bloggers son las típicas estrellas de valoración que un gran número de sitios web poseen al final de sus artículos, vídeos o imágenes.
Es sin duda un artilugio muy atractivo que permite a los lectores de un espacio dar su opinión sobre el contenido publicado.
Hace tiempo publiqué una entrada en la que introducía un script proporcionado por el servicio Outbrain y con el que conseguíamos esto mismo. Desafortunadamente, las estrellitas tardaban algo en cargar e incluso mostraban publicidad ajena al blog.
Por ello he decidido hacer uso de JS Kit, un script cuya creación está en inglés y por tanto poco reconocido en los blogs de lengua latina o castellana. Además, pensé que mostrar el widget en inglés sería una desventaja para muchos por lo que traduje enteramente el script y obtuve un resultado como el que te muestro a continuación:
Busca la etiqueta <data:post.body/> en tu plantilla y justo debajo añade lo siguiente:
<div style='float:left; margin-right:3px;'/>
<div class='js-kit-rating' expr:path='data:post.url' expr:permalink='data:post.url' expr:title='data:post.title'>
</div>
De esta forma, las estrellas aparecerán en todo momento al pie de tus artículos.
Si prefieres mostrar las estrellas justo debajo del título de tus posts, añade el código bajo esta otra línea:
<div class='post-header-line-1'/>
Para hacer que únicamente se vean al abrir una entrada individualmente utiliza este otro código (en lugar del primero):
<b:if cond='data:blog.pageType == "item"'>
<div style='float:left; margin-right:3px;'/>
<div class='js-kit-rating' expr:path='data:post.url' expr:permalink='data:post.url' expr:title='data:post.title'>
</div>
</b:if>
Ahora encuentra la etiqueta </body> y encima agrega este bloque:
<div id='blEstrellasartic' style='padding-right: 6px;text-align: right;'><a href='http://goo.gl/VHSIZ'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhonStQPagkJnbUSfN-Tvusf32cJSD6VRHUVvCmWWEX1PDAso3CA8fhD8gJAQs5IOobXUdE5x_5MHeIXCLpLQhrte7J3p6s5shv25bh5hbB7StoUiFGSWdBoEC4kcZooSmycSNh8ojgXOZQ/s320/blestrellas.png'/><script src='https://sites.google.com/site/scriptsbalcon/b/blestrellas%282%29.js'/></a></div>
Guarda la plantilla para terminar.
Buenas,puse todo bien pero nose porque no me resulta.
ahí dice "Ahora encuentra la etiqueta body y encima agrega este bloque" ¿a que te refieres con encima? ANTES O DESPUES DE body ?
MCarlito, me refiero a incluir el código antes de dicha etiqueta.
Es un buen truco muchisimas gracias por traducirlo ya que lo necesitábamos en español.
Como siempre, el mejor.
Hola Jaime, tu aplicación me vino que ni pintada. EStá genial y es muy fácil ponerlo aunque utilicé lo de que solo aparezca en las paginas de entradas ya que así carga más rápido. Gracias Gracias Gracias.
Espectacularr!!Jaime!hacia tiempo que intentaba poner las famosas estrellas y ninguna me convencia,pero estas estan genial sobre todo por ser un diseño tan simple,muchas gracias!
besotes!!
Marcos, siempre es agradable para un lector el entender los artilugios. Este widget, por ejemplo, supone una ventaja para los que desconozcan la lengua inglesa.
Una buena elección, Laurale. Notarás el cambio pues si en la portada muestras varios gadgets, no conviene mantener las estrellas más que en las páginas de entradas individuales.
¡Quedaron muy bien, Cocofansclub! A mi me gustan más que las ofrecidas por el servicio Outbrain, sobre todo por su sencilla instalación y la elegante apariencia.
Gracias, me encanta tu blog
como puedo hacer para poner un texto anadido, por ejemplo: "Valora el reportaje"
Gracias
KxK, sería necesario editar el script y es realmente una tarea complicada. En realidad, la frase que aparece es: Votar con un... Por lo que si antes del primer código escribes una frase cualquiera (Valora el reportaje, por ejemplo) actuará como título.
Hola jaime ,dejame decirte que eres un genio tio muy bien explicado y muy bien detallado como para novatos en el tema de HTML ,como yo ejeje ,estoy tratando de renovar mi blog que tengo sobre videojuegos y me gustaria que me ayudes con algunas ideas puedes ?? te dejo el enlace de mi blog y haber si contactamos por privado via email ok un saludo y Feliz fiestas a ti y a todos tus bloggeros bye :)
http://carlangas24game.blogspot.com/
¡Bienvenido Carlangas24! Soy yo el que debe felicitarte, tienes un blog magnífico. Lo mejor de todo es que, además de una bonita plantilla, posees un foro muy bien organizado.
Por el momento se me ocurre que quizás te sería de interés mostrar una galería de imágenes en la portada (algo que atraerá a muchos lectores).
¡Saludos y Feliz Navidad!
no encuentro la etiqueta . ¿hay alguna forma de búsqueda rápida? ¿o alguna pista de en que parte la puedo encontrar?
gracias y saludos!
Josep
Hola gracias por el aporte ya habia buscado esto en otros Blog y no lo habia podido agregar al mio hasta hoy que lo vi en tuyo magnifo blog. Gracias.
Esdras, conjunta de maravilla con el texto de tus artículos. Muchas gracias por tu comentario.
Por supuesto Josep, utilizando el buscador de tu navegador te resultará todo más sencillo. Puedes abrirlo presionando las teclas Ctrl y F simultáneamente.
porque razon dejaron de funcionar las entrellas?
En el blog de pruebas funciona sin problemas, MCarlitooH2, y se trata del mismo script. Tal vez hayas incluido otro truco o modificado el código de tu plantilla de tal forma que han dejado de mostrarse. Prueba a instalarlo de nuevo.
Oye como se haria para alojar el script en la plantilla?? me gustaria hacerlo de esa forma, me podrias explicar? gracias.
Juanjo, si lo que estás buscando es alojar el script en un servicio propio, aconsejo Google Sites pues funciona de maravilla.
Perfecto si funciona es mejor que otros trucos que hay en la web :D
Este es mi blog y ya aplique el truco
<a href="http://blogwarezdescarga.blogspot.com/</a>
En mi plantilla no sale la etiqueta
¿Hay alguna forma de hacerlo a pesar de ello?
Felicidades por tu blog. En clase de la filosofía hemos empezado a trabajar con blogs y éste me está sirviendo de gran ayuda.
Saludos.
Mi blog
Mateo, prueba a utilizar el buscador de tu navegador (presiona las teclas Ctrl y F para abrirlo) e incluye el término post.body en lugar de dicha etiqueta.
Debe aparecer pues, a pesar de tratarse de una de las nuevas plantillas del Diseñador de blogger, la etiqueta es fundamental.
Gracias por tu agradable comentario, es un honor que mi blog te resulte de ayuda.
¡Qué maravilla! Eres un genio! Yo me doy de cabezazos contra el ordenador muchas veces. ¡Gracias por tu amabilidad y el servicio que prestas! Decirte que a mí me pasa lo mismo que a Mateo y he hecho lo que le indica pero no resultó. Me pone literalmente que no se encontró la frase. Sólo me aparece body, en concreto esto No sé si podrás indicarme qué sucede. ¡Gracias!
¡Bienvenida Rous! En tu caso y dado que la plantilla utilizada pertenece a las que ofrece blogger en su Diseñador, haz lo siguiente:
Diseño>Edición de HTML>expandimos artilugios
Localiza esta otra línea en lugar de <data:post.body/>...
<span class="post-author vcard">
Añade el código justo antes.
Realizando esto debería funcionar. Avísame en caso de no producirse cambio alguno. Muchas gracias por tus bellas palabras.