En este ejemplo cambiaremos un poco el de Entradas Populares de manera que se convierta en un menú gráfico con tooltips o mensajes emergentes que muestran el título del posts.
Actualmente podéis ver uno igual con pequeñas variaciones en la parte inferior de este blog y el resultado exacto en la demo que hace tiempo preparé para ilustrar una serie de modificaciones que propuse para la plantilla Blogger Store.
Sólo tenéis que copiar este cógigo en cualquier parte entre las etiquetas SKIN de vuestra plantilla y listo. Para los curiosos, una pequeña explicación después.
.popular-posts {margin-top:10px;}
.popular-posts ul {width: 500px; margin: 0 auto; text-align:center;}
.popular-posts .item-snippet{display: none;}
.popular-posts ul li {position:relative; float:left; list-style-type: none; padding: 0 0 0 5px ;}
.popular-posts ul li a {text-decoration:none; color: #000;}
.popular-posts li img {background: #666666; padding: 2px; filter:alpha(opacity=100); -moz-opacity:1; -webkit-opacity:1;-o-opacity:1;-ms-opacity:1; opacity:1;
transition: all .5s linear; -o-transition: all .5s linear; -moz-transition: all .5s linear; -webkit-transition: all .5s linear;}
.popular-posts li img:hover {filter:alpha(opacity=60); -moz-opacity:.6; -webkit-opacity:.6; -o-opacity:.6; -ms-opacity:.6; opacity:.6;}
.popular-posts li .item-title a {z-index:1; width: 150px; height: auto; line-height: 16px; padding: 5px; font-style: italic; font-size: 14px; text-decoration:none; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1); text-align: center; border: 2px solid #cc0000; background: #eeeeee; background: rgba(255,255,255,0.8); -moz-border-radius: 3px; -webkit-border-radius: 3px; -o-border-radius: 3px; -ms-border-radius: 3px; border-radius: 5px; pointer-events: none; position: absolute; left: 50%; margin-left: -75px; bottom:190px; box-shadow: 1px 1px 2px rgba(0,0,0,0.1);
filter:alpha(opacity=0); -moz-opacity:0; -webkit-opacity:0;-o-opacity:0;-ms-opacity:0; opacity:0;
-webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.popular-posts li:hover .item-title a {bottom:80px; filter:alpha(opacity=100); -moz-opacity:1; -webkit-opacity:1;-o-opacity:1;-ms-opacity:1; opacity:1;}
.popular-posts ul {width: 500px; margin: 0 auto; text-align:center;}
.popular-posts .item-snippet{display: none;}
.popular-posts ul li {position:relative; float:left; list-style-type: none; padding: 0 0 0 5px ;}
.popular-posts ul li a {text-decoration:none; color: #000;}
.popular-posts li img {background: #666666; padding: 2px; filter:alpha(opacity=100); -moz-opacity:1; -webkit-opacity:1;-o-opacity:1;-ms-opacity:1; opacity:1;
transition: all .5s linear; -o-transition: all .5s linear; -moz-transition: all .5s linear; -webkit-transition: all .5s linear;}
.popular-posts li img:hover {filter:alpha(opacity=60); -moz-opacity:.6; -webkit-opacity:.6; -o-opacity:.6; -ms-opacity:.6; opacity:.6;}
.popular-posts li .item-title a {z-index:1; width: 150px; height: auto; line-height: 16px; padding: 5px; font-style: italic; font-size: 14px; text-decoration:none; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1); text-align: center; border: 2px solid #cc0000; background: #eeeeee; background: rgba(255,255,255,0.8); -moz-border-radius: 3px; -webkit-border-radius: 3px; -o-border-radius: 3px; -ms-border-radius: 3px; border-radius: 5px; pointer-events: none; position: absolute; left: 50%; margin-left: -75px; bottom:190px; box-shadow: 1px 1px 2px rgba(0,0,0,0.1);
filter:alpha(opacity=0); -moz-opacity:0; -webkit-opacity:0;-o-opacity:0;-ms-opacity:0; opacity:0;
-webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
.popular-posts li:hover .item-title a {bottom:80px; filter:alpha(opacity=100); -moz-opacity:1; -webkit-opacity:1;-o-opacity:1;-ms-opacity:1; opacity:1;}
El gadget Entradas Populares lo que simplemente hace es montar una lista en la que muestra título del post, miniatura y un pequeño resumen de texto, estos dos últimos de manera opcional. Sabiendo esto y viendo el código que se genera, lo demás sólo consiste en reconocer qué parte controla qué:
<div class='widget PopularPosts' id='PopularPosts1'>
<h2>Los más demandados</h2>
<div class='widget-content popular-posts'>
<ul>
<li>
<div class='item-thumbnail-only'>
<div class='item-thumbnail'>
<a href='URL_POST' target='_blank'>
<img alt='' border='0' height='72' src='URL_MINIATURA' width='72'/>
</a>
</div>
<div class='item-title'><a href='URL_POST'>Título de la entrada</a></div>
<div class='item-snippet'>Resumen</div>
</div>
<div style='clear: both;'></div>
</li>
(sigue con el resto de elementos de la lista, cierre de UL y cierre del DIV principal)
<h2>Los más demandados</h2>
<div class='widget-content popular-posts'>
<ul>
<li>
<div class='item-thumbnail-only'>
<div class='item-thumbnail'>
<a href='URL_POST' target='_blank'>
<img alt='' border='0' height='72' src='URL_MINIATURA' width='72'/>
</a>
</div>
<div class='item-title'><a href='URL_POST'>Título de la entrada</a></div>
<div class='item-snippet'>Resumen</div>
</div>
<div style='clear: both;'></div>
</li>
(sigue con el resto de elementos de la lista, cierre de UL y cierre del DIV principal)
En un principio podríamos usar la ID PopularPost1 como contenedor general, pero si alguien añade un segundo gadget de este tipo, la ID terminará en 2, por eso preferí usar la clase anidada siguiente junto a widget-content, esto es, popular-posts.
Siguiendo el código...
.popular-posts ul se corresponde con el contenedor general
.popular-posts ul li con cada elemento de la lista o conjunto título-miniatura-resumen
.popular-posts ul a con los enlaces (título del post, imagen)
.popular-posts li img con la miniatura
Los efectos se hacen con los correspondientes hover añadiendo una opacidad total para un estado y trasparencia para el contrario. Lleva añadido una posición vertical distinta (bottom) en cada estado para conseguir la aparición del tooltip. Lo demás es el resultado de utilizar transition.
En esta entrada hay más información sobre este tipo de mensajes emergentes animados.
Con el mismo sistema y con la clase adecuada, se pueden hacer cosas parecidas con casi todos los gadgets, así que a practicar que yo me voy de fiesta. Esta semana me lo he ganado aunque no sea por mi actividad en el blog.
¿Vemos otro post al azar por si le encuentras utilidad o quizás prefieres ser más metódico y suscribirte a nuestras entradas por correo? También puedes imprimir este artículo y por supuesto compartirlo en redes sociales si fue de tu agrado.
Y muchos más artículos interesantes si nos sigues en...
¿Este efecto no se puede aplicar a las imágenes para que se vea cuando usemos el atributo title?
ResponderEliminarY si se puede hacer, cómo se haría.
Se puede hacer con imágenes de manera prácticamente igual a la de aquí (sigue el enlace casi al final del post "mensajes emergentes"), pero no lo puedes aplicar diretamente al title.
EliminarHola oloman puse el codigo de las marquesian
ResponderEliminarpero las imagenes se pasan muy juntas como hago para separarlas un poco???
este es mi blog
www.seduccionelite.blogspot.com
No sé qué código usaste y tampoco ayuda mucho que tengas deshabilitado el botón derecho :)
EliminarSi lo haces para que no se pueda ver el código fuente, debes saber que es lo mismo. La mayoría de navegadores incluyen herramientas para hacerlo sin usar ese botón.
De todas formas la cosa se puede solucionar incluyendo espacios en blanco entre las imágenes o
otra cosa por que no puedo poner el codgio ke tengo en mi blog??
ResponderEliminarasi lo veas bien?? (el codgio de las marquesinas)
Si escribes código en los comentarios, este se interpreta y por eso no es visible. Tienes que transformarlo primero en texto plano. Si buscas "HTML texto plano" encontrarás diversas herramientas para ello.
EliminarSi eso del boton derecho como lo solusiono, una vez puse ese codigo de tu pagina pero ahora no me acuerdo como se hace la saca la verdad
ResponderEliminarYY otra cosa se puede saber que plantilla usa otra pagina?? o de donde la saco mirando el codigo fuente??
ResponderEliminarNo sé cómo pusiste lo del botón derecho, pero tampoco es tan importante. Ya te comenté que hay maneras de saltarlo :)
EliminarY sobre las plantillas, en las de Blogger suele venir algo así al principio:
/*
=============================================
Oloblogger (http://www.oloblogger.com)
Plantilla creada por Oloman
Base: Minima Stretch de Blogger
Fecha: Enero 2012
============================================*/
Pero algunos lo borran y en otros casos son tan personalizadas como esta y no te ayudará mucho esa información.
Hola Oloman, te felicito por tu blog que siempre me ha ayudado mucho, aunque últimamente lo de que también es para torpes o novatos no lo veo claro (Sin ánimo de crítica)
ResponderEliminarReconozco que no tengo mucha idea de HTML y ninguna de CSS, y el nivel de tus publicaciones es cada vez más avanzado, así que muchas veces me quedo con las ganas de poder instalar los códigos en cuestión, acostumbrado a los típicos tutoriales de "busca esto, y detrás pégale aquello, borra tal, pon nosequé y listo"
No obstante, seguiré suscrito y leyendo cada uno de tus posts, donde siempre aprendo alguna cosa, me encantan siempre tus propuestas, así que ¡Gracias! y Saludos
Tomo nota del "toque de atención". En mi descargo diré que creo preferible explicar las cosas y no simplemente indicar "copia esto y pégalo aquí". Pienso que entendiendo lo que se hace es más fácil aprender a hacer las cosas por uno mismo. Al menos así fue conmigo.
EliminarAdemás, la segunda opción sería sin duda la más fácil para mí. Te aseguro que explicar e ilustrar con ejemplos es como 5 veces más laborioso.
Aunque no lo parezca, este post en concreto es de los que echas de menos, así que adelante ;)
hola amigo puse el codigo de markesinas en mi blog
ResponderEliminarwww.seduccionelite.blogspot.com
ahora la pregunta es como hago para que las imagenes se detengan al pasar el puntero sobre ellas??
vagabunda me dijo que tenia que crear un escrip pero no me dijo como
espero que vos me puedas ayudar
Tienes una marquesina simple hecha con HTML y por lo que dices quieres algo que se detenga a voluntad del usuario. Lo que Vagabundia quiso decir es que para eso necesitas código JavaScript.
EliminarYo sólo he publicado este modelo, pero en la Red podrás encontrar muchos más.
Hola Oloman,
ResponderEliminarhe colocado este tip en mi blog y me ha quedado de miedo, la verdad es que andaba buscando, está forma de colocar las entradas populares con thumbnails, porque lo vi en tu blog, y me encanto cómo quedaba, te felicito por tu gran blog y la ayuda que ofreces, eres un crack, gracias.
Mi blog: http://aizum.blogspot.com
Veo que no es lo único que tomaste de aquí ;)
EliminarYa lo se, que no es lo único qué tome de aquí, pero es que para mi eres una referencia, no te lo tomes a mal, si quieres sí hay algo que no te guste de mi blog o te moleste y te he copiado de tu blog y te sientes mal, lo quito sin problemas, dímelo y no hay ningún problema. Iván.
ResponderEliminarNo problemo. Fue sólo un comentario. Mi pensamiento es siempre que si algo te gusta tanto como para copiarlo, al menos adáptalo, personalízalo todo lo que puedas, que sólo sea copiada la idea o el concepto, pero no todo. Lo que vi en tu blog estaba modificado, pero supongo que entiendes que para mi es fácil reconocer ciertos elementos si yo los tengo ;)
Eliminaroloman con respecto a las marquesinas como hago para que ni bien pasen todas las imagenes vuelvan a comenzar otra vez?? por que em mi blog demoran un rato hasta que vuelven a salir
ResponderEliminarwww.seduccionelite.blogspot.com
Todas las características dependen del script que estés utilizando. Hay muchos y cada uno funciona de una manera distinta. No sabría decirte con el que tienes ahora, pero la solución es tan fácil como seguir buscando hasta encontrar uno que funcione exactamente cómo tú quieres.
EliminarHola amigos. Os quiero hacer una consulta.
ResponderEliminarEstoy buscando una clase de gadget para blogger que me permita visionar a través de él las entradas que se van colocando en la página 2 de mi blog, o que están catalogados en una determinada etiqueta. Sería una buena manera de que las entradas de que van pasando a segunda página pudieran seguir viéndose en portada y así darle un mayor rendimiento a los posts.
Entiendo que no debe ser difícil, pero no doy con la solución. ¿Tenéis algún dato?.
Muchas gracias y felicidades por vuestro blog.
Un abrazo
Una idea rápida.
EliminarAñade un gadget tipo feed y en la dirección escribe
http://DIRECCION_HOME/atom.xml?redirect=false&start-index=6&max-results=5
El start-index marca el primer post a mostrar (en el ejemplo el 6º) y max-results el número de posts totales que se verán. Creo que no te admitirá más de 5.
Para que sólo sean los de una etiqueta, la dirección sería:
http://DIRECCION_HOME/feeds/posts/default/-/NOMBRE_ETIQUETA
;)
Hola oloman.. Muchas gracias por todo esto que nos brindas, ayudas a que hayan blogs bien presentados.. :)
ResponderEliminarTengo una pregunta y es que parte del código se debe cambiar si lo quiero usar con "las entradas similares"??
yo estuve moviendo un poco el código allí y aca.. pero no logre mucho, remplazé la clase .popular-posts en el CSS por related-posts y otras cosas en el HTML pero me di por vencido.. no logré el efecto del hover =/ al pasar el mouse.. Es muy complicado?? ;)
Gracias
Depende de cómo tengas montado concretamente tus posts relacionados. Hay varios códigos circulando y no tengo acceso a tu perfil por lo que no puedo ver tu blog.
EliminarDe todas formas se trata de ponerle un opacity: .; a la clase de cada elemento (li) del artilugio y un opacity: 1; a la misma clase añadiéndole un :hover, sólo eso. O al revés si quieres que "aparezca" cuando se pone el puntero por encima.
Graias por responder.. he logrado algo, pero tengo problemas con el manejo del hover.. para que salga el titulo al poner el mouse. :P
EliminarAun asi, sigo moviendo un poco el código para ver que logro.
Te dejo el link del blog: http://elsolucionario.blogspot.com/
Este comentario ha sido eliminado por el autor.
EliminarDespués de mucho esfuerzo he logrado hacerlo. :P solo que no me ha quedado igual de bueno al de entradas populares.
EliminarMuchas gracias..
De nada. Tampoco tienen por qué ser idénticos los efectos. Incluso podrías cambiar también los colores del borde y/o fondo para evitar que se confundan.
EliminarHola una consulta, antes de todo soy nuevo en este mundo de los Blog pero me gusta y también el Blog está interesante y sirve de mucha ayuda para nosotros, yo tengo un problema h1, h2, bueno todos los h que existen, quisiera que me ayudes a ordenar esto en mi Blog, hice la grande cambiando en artilugios, los h3 por h1 y ahora no se como devolverlos, quisiera que me ayudes
ResponderEliminarPues hay que repasar toda la plantilla, pero la forma más sencilla sería haciendo todo justo al revés. Esto es, busca (CTRL+C) con plantillas de artilugios expandidas todos los h1 y los cambias provisionalmente, por ejemplo, con un hx. Luego, todos los h3 los cambias por h1 y por último, los hx los pones como h3. El paso intermedio del hx es para que no falles ni confundas ninguno.
ResponderEliminarDe todas formas, la pista definitiva por si lo anterior no te funciona totalmente, es que en las plantillas originales h1 es para el título del blog, h2 para fechas de entradas y títulos de gadgets y h3 para los títulos de las entradas.
Oloman estaba pensando como podría hacerlo vertical y si en vez de mostrar el titulo mostrar las etiquetas del post.
ResponderEliminarNo me compliques Stuka, que estoy intentando disfrutar unas medio vacaciones :)
EliminarBueno en serio, lo de ponerlo en vertical se podría hacer, aunque tendría que trabajarlo, pero con respecto a mostrar las etiquetas, eso es bastante más complicado. Tanto que no se me ocurre ni por dónde empezar :s
Bueno espero que descanses pero puedes ponerte a trabajar? ajajajj y aunque sea decirme como hacerlo vertical no?
EliminarComo cosa rápida prueba a poner un width en la primera línea del estilo:
Eliminar.popular-posts {WIDTH: 72PX; margin-top:10px;}
No no funciono pero toqueteando un poco el CSS quedo horizontal poniendo
Eliminar.popular-posts ul {width: 100px; margin: 0 auto; text-align:center;} (PARA QUE QUEDEN EN FILA DE 1)
.popular-posts ul {width: 200px; margin: 0 auto; text-align:center;} (PARA QUE QUEDEN EN FILA DE A 2)
Bueno, más o menos la idea es la misma, pero si esa fue la forma en que te funcionó, pues perfecto ;)
EliminarHola Oloman.
ResponderEliminarMe gustaría saber si es posible mostrar mas de 10 post y como hacerlo.
Saludos y gracias.
Con este gadget no. Habría que montar algo con JSON y JavaScript para que los leyera sin límite o mejor dicho, con un límite mayor. Desafortunadamente eso no lo he hecho ni visto nunca, así que no te podría explicar.
Eliminarbuenas noches! Queria que me resolvieras una duda que consiste en que las entradas populares no se ven de manera lineal una detras de otra, queria introducir 10 entradas populares y que queden de forma lineal pero cuando introduzco mas de cinco entradas las demas quedan debajo. en definitiva, lo que quiero es que se me vean todas en una sola fila. Espero su respuesta. gracias, un saludo.
ResponderEliminarmi blog: informarnos
Hoy veo 9 en la misma línea. Supongo que ya lo arreglaste ;)
Eliminarsi gracias
ResponderEliminarExcelente, y simple! Gracias!
ResponderEliminaroloman, me puedes ayudar, esque ami no me salen la vista en miniatura, ya lo tengo seleccionado y aun no salen
ResponderEliminarmi blog:
toxicosm.blogspot.com
No veo que tengas este gadget en tu barra, por lo que no puedo saber si te funciona o no.
EliminarHola como estas?
ResponderEliminarqueria ver si alguien me puede ayudar aplique este gatget a mi blog, y todo esta exelente, pero lo unico que me gustaria que todo se habra en la misma pagina que nosea en otra ventana y nose como se cambia eso muchas Gracias
Ya lo resolvi, gracias de todas formas
ResponderEliminarDe nada :)
EliminarOloman, excelente todo! Como puedo colocar el gadget dentro de una entrada, no en la sidebar? Saludos
ResponderEliminarQue yo sepa, en una entrada no se pueden incluir gadgets de este tipo y sólo funcionan como parte de la plantilla. Si acaso podrías incluirlo al final o al principio de un post, pero siempre incluyendo su código en la plantilla.
EliminarOloman, me puedes decir algun buen widget multitab (al- de 3 pestañas) en el que pueda meter entradas populares, ultimos comentarios, ... Lo he estado buscando en tu blog y en varios y me toy volviendo loco, porque tngo ya un multitab en mi blog pero al añadirle el codigo no se q pasa q no se ve casi nada.
ResponderEliminarNo he publicado casi sobre eso, pero aquí tienes una manera de construir cajas con pestañas.
Eliminargrax oloman, enseguida me pongo a hacerlo y te cuento como me ha ido.
EliminarHola :) supongo que este código se podrá adaptar para hacer lo mismo con el blogroll...lo supongo menos de lo que lo suponía antes de probar a hacerlo por mi misma y ver que el blogroll se queda tan pancho, exactamente igual que estaba. La idea me gusta mucho como tantas otras que te he copiado, antes y ahora :D Si es posible poner el blogroll de esta misma manera te agradecería mucho que me explicaras como...
ResponderEliminarSaludos
Hola. No recuerdo si ese otro gadget tenía la misma estructura que el los posts populares, pero posiblemente sea muy parecido. Como tardaría en vértelo con más detalle, en un principio prueba a cambiar en este CSS todos los .popular-posts por .BlogList
EliminarPuede que no vaya exactamente igual pero ya sólo sería cuestión de retocarlo a tu gusto.
No, eso no resulta. Al menos a mí no me resultó :( ya lo había probado. Gracias por responder :)
ResponderEliminarPues el caso es que lo probé tras decírtelo y si que iba. No salía muy limpio pero funcionaba. Vuelve a probar por favor.
EliminarPues no sé que hago mal, peo a mí me queda igual todo el tiempo, ni se inmuta, he probado cambiando .popular-posts por .BlogList, por blog-list, por blog-list 1 (aunque sólo tenog uno) y el resultado es siempre el mismo, osea ninguno...igual gracias, Oloman, seguiré probando. Un abrazo
ResponderEliminarMete al final de tu CSS (justo antes del cierre SKIN) este código:
ResponderEliminar.BlogList ul li {
float: left;
clear: none;
width: 200px;
height: 100px;
}
Te debe alinear todos los bloques de tu blogroll. Si funciona eso, de la misma manera debe funcionar lo otro.
Pues no, pero ahora ya sé por qué, hay algo que he cambiado en la configuración del css, no sé lo que es porque la plantilla está más tocada que el .... de la Bernarda, con perdón, pero eso es lo que hace que las modificaciones que quiero hacer algunas se apliquen y otras no. Tengo un blog de pruebas y las modificaciones las hago primero allí, si funcionan las exporto, lo que he hecho es devolver el blog de pruebas al estado original y probar y allí funciona todo, este código que me das ahora y también el otro. El caso es que en el widget de entradas populares el otro si que funcionaba, por eso me obcequé...ahora me pondré a investigar que es lo que falla, siento mucho haberte dado tanta tabarra. Muchísimas gracias Oloman, de verdad. Un abrazo grande
ResponderEliminarHola Oloblogger, tengo un problema con la implementación de estas entradas populares en la plantilla Blogger Store que me he descargado de ti. El problema es que no se visualiza. Aparece el título del gadget pero no se ven los recuadros ni nada. Tampoco tengo en HTML en código como lo expones en este post. A mi me aparece así:
ResponderEliminar-(código)-
alguna ayuda?
Mejor que el código es dejarte el blog, no sé en qué estaba pensando... :) http://biblioteca-delmundo2.blogspot.com.ar/
ResponderEliminarYo sí los veo. Supongo que era cuestión de esperar a que algunas entradas pasaran a ser "Populares" ;)
EliminarComo puedo hacer que el título de este Widget quede centrado?
ResponderEliminar.PopularPosts h2 {display:block; text-align:center;}
EliminarSaludos Oloman QmQ
ResponderEliminarEstoy intentando arreglar este no sé si llamarlo pequeño, o gran detalle. Tengo puesto este gadget de entradas populares, lo tengo puesto "Populares esta semana", pero, primero, las miniaturas de los artículos, se escoge al azar la imagen que le da la gana. Y segundo, algunos artículos tienen imágenes y sin embargo aparecen en blanco, no sacan Vista en miniatura >.<
Aparte, lo del fragmento texto, pues lo quiero dejar como está, pero si supiese configurarlo, mejor.
Solo querría poder configurar la miniatura de imagen que aparezca. No sabía como buscar esto en Google así que solo busqué .PopularPosts .item-thumbnail y me apareció tu Blog que ya he visitado mucho :3
Lo que pasa es que no estoy seguro, he imaginado que si modifico esos parámetros dinámicos, entonces no funcionará el gadget mostrando los más populares, pero la verdad yo solo sé HTML y CSS
He montado mi Blog gracias a ti, Vagabundia, CiudadBlogger y Diarios de la nube :D
Gracias Oloman, es solo un detalle, que como muchos, me hace calentar la cabeza.
Saludos.
No sé si será este el problema, pero en la mayoría de casos sí lo es, así que verifica que subes las imágenes a Blogger y no a otros servicios de hosting. En este último caso pasa lo que cuentas, que no salen las imágenes.
ResponderEliminarAaaaah, aja, eso era Oloman, ahora sí, muchas gracias.
ResponderEliminarLa verdad es que temo que me cierren tarde o temprano el Blog por algunas cosillas de Copyright, así que pongo las imágenes en otra cuenta en Google Drive y desde ahí las enlazo, y si llega el caso no tendré que resubir las imágenes solo importar la plantilla.
El caso es que ahora le he encontrado la utilidad. A la imagen que quiera que aparezca en la miniatura, la subiré desde el Blog y la colocaré en el artículo, y las demás, las subo al hosting :D
Ojalá fuese especialista en algo, sé HTML, CSS, editar imágenes, audio, vídeo, soy informático, y sé hacer muchas cosas en general... Pero me doy cuenta que aunque lo que más me gusta es editar vídeos, no soy especialista ni mejor que nadie en algo, no sé si considerar bueno ser multiusos, pero precisamente si fuese especialista creo que podría ganarme mejor la vida con esto, aunque mi mejor contenido original son los tutoriales... Los gamers son los que más llaman la atención :(
PD.: No sé porqué cuento eso aquí, lamento parecer deprimido XD
Y de nuevo:
¡Muchas gracias Oloman!
Yo te recomendaría que pusieras todas las imágenes en Blogger (Picasa) porque pienso que una cosa es que te cierren el blog y otra que te anulen todas las cuentas de Google, incluida la de Picasa. Y si estás decidido a subir unas a un lado y otras a otro, casi mejor las subes a Blogger y las vas duplicando en otro servicio. Eso último no va a fallar seguro :)
Eliminarde casualidad sabes como se puede modificar el numero del widget entradas populares para poner las que yo quiera y no solo 10 como maximo?
ResponderEliminarsaludos
No Efenix, no tengo ni idea, pero es que además sospecho que no se puede... o al menos que no tiene que ser nada fácil.
EliminarHola Oloman, sin saberlo me has ayudado muchas veces, pero esta vez necesito hacerte dos consultas sobre esto:
ResponderEliminar¿Existe alguna forma de que el widget se vea en otro lugar de la plantilla?
(me explico, quiero que se vea inmediatamente al final del texto del post, pero agregándolo desde diseño aparece al final de toda la sección del post, al final de los comentarios, que a veces pueden ser muchos, como te ocurre a ti siempre, y si lo cambio de sitio manualmente en la plantilla no me deja integrarlo dentro de la sección del post "The widget with id "Blog1" cannot contain element: "b:widget". A widget can only contain b:includable elements").
Y la segunda cuestión ¿se puede personalizar de alguna manera para que entre los resultados que devuelve no aparezca la misma entrada que estamos visitando en ese momento?
Gracias de antemano, y mi más sincero reconocimiento por tu ayuda a los demás.
La primera cuestión casi que la descubres tú, pues ya viste que Blogger no te deja ponerlo en la sección que quieras... y así es. Cada gadget funciona en una determinada zona de la plantilla y no lo puedes poner en cualquier otra. Dentro de la zona de las entradas, este no va, así que no te canses en buscar la manera.
ResponderEliminarY sobre la segunda, pues la respuesta es también negativa. Los gadgets "de serie" basados en el contenido de las entradas son controlados por Blogger desde su base de datos, así que lo que muestran no es modificable por nosotros.
Ahora bien, en ocasiones alguien inventa códigos que realizan la misma tarea que algunos gadgets y en ese caso claro que se pueden modificar. Lamentablemente no recuerdo ningún destino para enlazarte para simular uno con entradas populares (las más visitadas).
Bueno, al menos me quedo tranquilo de que lo he intentado todo. Muchas gracias, y buscaré algún código funcional, realizándole alguna modificación.
ResponderEliminarUn saludo
Gracias Oloman por el tutorial.
ResponderEliminarA priori no me salía así que probé directamente en el apartado de widget: .widget .popular-posts
Mi pregunta es si se puede modificar el número de caracteres del resumen que aparece en popular post.
Muchas gracias.
Saludos.
Si se puede sería con JavaScript, pues no hay ninguna forma nativa que yo conozca. Sería cuestión de capturar el texto y luego recortarlo. Ampliarlo no se podría.
EliminarHola. Esto me sirve genial para un proyecto que tengo, pero para otro.. tengo una duda. Si quisiera transformar un popular post en un gadget manual ¿como podría hacer? intenté modificando el código pero me cargo todo el gadget y queda inservible U_u
ResponderEliminarHola. Pienso que si lo que quieres es hacer algo parecido pero con ciertos posts seleccionados por tí de forma manual, lo mejor sería olvidarte del código del gadget y hacer un simple lista (ul-li) con la misma estructura.
EliminarEs posible obtener un gadget de entradas populares pero bajo una etiqueta o categoría específica ?? Espero sus respuestas. Gracias.
ResponderEliminarNo que yo sepa Angelitux. Los posts populares los muestra el gadget en función de visitas y esos datos no los tenemos a mano para manejarlos nosotros, así que tampoco podemos filtrar por etiquetas. Al menos no de una manera fácil
EliminarY bueno a esperar entonces que Blogger en un futuro nos permita tener mejores experiencias. Gracias por la respuesta.
EliminarHola Oloman!
ResponderEliminarMi pregunta es también lo que pregunta Angelitux.
¿Hay alguna manera de sustituir todos los .popular-posts por un código que me permita mostrar una etiqueta determinada?
Ya tengo en la plantilla del blog el diseño y posición de las entradas a mostrar y funciona, sólo me queda cambiar eso.
Te agradecería montones si me orientas al respecto.
Saludos y gracias! :)
Mi blog es http://inventoimaginario.blogspot.com/
No entiendo lo tuyo exactamente igual que lo de Angelitux. Él quiere filtrar los posts populares (más visitados) por una determinada etiqueta y lo que entiendo que tú quieres es un código para mostrar sólo los posts con una determinada etiqueta... ¿o también lo quieres teniendo en cuenta las visitas?
EliminarEn el segundo caso la respuesta es la misma que le di hace un momento a él, que no sabría como.
Sin embargo, si quieres sólo las entradas de una determinada etiqueta, con cualquier gadget basado en feed, podrías obtener esa lista con la dirección http://nombredelblog.blogspot.com/feeds/posts/default/-/nombredelaetiqueta
Hola, tengo una duda, para limitar la cantidad de post que aparecen, que codigo se utiliza?
ResponderEliminarPor ejemplo ahora me aparecen unos 10 post y no se el codigo para limitar a que me aparezcan 5
Ojalá puedan ayudarme, desde ya gracias :D
Hola. Eso no se controla desde el código, sino desde el propio gadget.
EliminarSólo tienes que ir a Diseño, editar el gadget de posts populares y desde allí seleccionar la cantidad que quieres.
Buenas, muchas gracias por el truco. Queda genial.
ResponderEliminarTenía una pregunta, Me gusta el efecto de que pasas el mouse arriba de la imagen y sale el titulo. Me gustaría saber si eso se puede hacer con las entradas.
Osea en mi web: www.familyrenders.com ... salen las entradas mostrando solo la imagen, yo quisiera que saliera el titulo al pasar el mouse por arriba como pasa con el gadget de populares. Lo intente con el .h3 pero no funciona D:.
Ojala puedas decirme si eso que pide se puede o no para dejar de hacer experimentos XD.
Saludos
Se puede, pero me resulta imposible individualizar las explicaciones a ese nivel cuando, como en este caso, son diversas modificaciones las que hay que realizar en la plantilla.
EliminarNo obstante en esta entrada se explica bastante como se consigue el efecto (posicion absoluta y cambio de coordenada con hover), así que si estudias el ejemplo un poco es posible que puedas acoplarlo a tu portada.
Gracias! Solo necesitaba saber eso, si era posible para no estar perdiendo el tiempo.
EliminarSaludos y gracias por la rápida respuesta <3
Gracias por tu apoyo y asesoría Mr. Oloman.
ResponderEliminarLo unico que desearia ya que todo lo he comprendido. y aun un poco mas .jejeje.
Quiero que con la transformación del gadget de posts populares. cuando le de clik en las imágenes me abra el detalle del articulo en la misma pagina.
Hola Jerry. Eso es algo más complicado de hacer, especialmente con este gadget que es de los predeterminados por Blogger. No obstante, quizás este otro artículo te sirva como inspiración: Mostrar datos adicionales
Eliminar