JMiur [E]

Para terminar con los posts resumidos sólo faltaría una cosa, ver como colocar una imagen miniatura aunque primero voy a responder a una pregunta.

En el ejemplo anterior se muestra la forma de crear esos resúmenes del mismo modo que lo hace PeekABooPost; el home normal pero las páginas con listas de entradas resumidas. Ese no es el único modo de hacerlo y, en mi caso uso una condición diferente, el primero de cualquier pagina se muestra entero y el resto, resumido. Para eso, no hace falta cambair mucho, basta modificar la condición que antes era esta:
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:include data='post' name='ResumenPost'/>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
por esta otra:
<b:if cond='data:post.isFirstPost'>
<b:include data='post' name='post'/>
<b:else/>
<b:include data='post' name='ResumenPost'/>
</b:if>
Vamos entonces a la imagen. Primero, agregamos una celda más en la tabla que teníamos:
<b:includable id='ResumenPost' var='post'>
<table cellpadding='0' cellspacing='0' class='post-resumen'><tbody><tr>
<td class='celdaimg' rowspan='2'><div class='miniresumenpost' expr:id='&quot;thumb-&quot; + data:post.id'/></td>
.......
Tendrá una clase CSS llamada celdaimg y contendrá un DIV con una clase miniresumenpost y al que identificaremos individualmente con un ID: thumb-xxxxxxxxxx. El CSS para agregar será algo así:
.post-resumen td.celdaimg { /* el ancho de esa celda con la imagen */
width: 100px;
}

.miniresumenpost { /* la imagen será un fondo, centrado y del tamaño que uno quiera */
background: transparent url() no-repeat scroll 50% 50%;
height: 120px;
overflow: hidden;
width: 90px;
}
Esta sólo es una alternativa pensada para no redimensionar las imágenes ya que al forzarlas a tener un tamaño fijo se deforman. De este modo, se usa la imagen tal cual pero sólo se muestra una parte de ella; en este caso, la parte central y eso es lo que define la posición de background 50% y 50%.

Por último, el script que es el mismo que se utilizaba antes al que se le agrega el manejo de las miniaturas:
// RESUMEN POSTS
function resumenPost(idPOST) {

var divAuxiliar = "dummy-" + idPOST;
var contenido = document.getElementById(divAuxiliar);

// buscar una imagen y mostrarla
var listaImagenes = contenido.getElementsByTagName("img"); // leemos la lista de imágenes del post
var mostrarImagen = "http://img340.imageshack.us/img340/8063/imagennodisponible.png"; // la imagen por defecto
if(listaImagenes.length>0) { // si hay una imagen, usamos la primera que encontramos en el post
mostrarImagen = listaImagenes[0].src;
}
var spanThumb = "thumb-" + idPOST; // y la colocamos como fondo en el DIV
document.getElementById(spanThumb).style.backgroundImage =  "url("+ mostrarImagen + ")";

// crear un extracto de la entrada
contenido = document.getElementById(divAuxiliar).innerHTML;
resumen = contenido.replace(/<[^>]+>/g,'');
longitud = 150;
var auxiliar = resumen.split(" ");
var nueva ="";
for(var i=0; i<auxiliar.length; ++i) {
nueva = nueva.concat(auxiliar[i]) + " ";
if(nueva.length > longitud) {break}
}
resumen = nueva +"...";
var spanResumen = "resumen-" + idPOST;
document.getElementById(spanResumen).innerHTML = resumen;

}
Y allí se acaba el juego. El resultado puede verse online en este blog de pruebas y la plantilla se encuentra en este ZIP

135 comentarios:

Graciela  

te ha quedado 'pipí cucú' :)

Responder
Raul  

Esta muy bien, a quedado perfecto, sólo tengo una duda, es que resulta que cuando la imagen es muy grande sale de un tamaño y cuando es más pequeña sale de otro tamaño ¿hay algún modo de hacer que sean del mismo tamaño todas las imagenes? independientemente del tamaño que sean

Responder
Anahí  

A mí se me complica mucho hacer esto, tengo el calendario, tengo el peekaboo y tengo el contador de posts todos ahí metidos en el dataheader. Casi que tendría que partir de cero.
Saludos.

Responder
JMiur  

Graciela: 'pipí cucú' ??? :D

Raul: Todo es posible pero no me parece una buena solución ya que redimensionar las imágenes hace que se distorsionen. No es lo mismo una apaisada que otra que no lo es pero igual podría hacerse.

Anahí: Sin duda, lo mejor es empezar de cero en un blog auxiliar y luego ver las diferencias. No son muchas pero uno se confunde fácilmente.

Responder
Aminoeh  

Hola JMiur, que pasó con fileden?? me borraron todos los archivos de mi cuenta (gratuita)!!! yo pensé que nunca los borraban, estaba confundido o es así???
Bueno de antemano gracias por la respuesta!

Responder
JMiur  

Aparentemente, hay un problema con algunas cuentas, no con todas; en mi caso, afecta a una de ellas y el resto está bien.

Recién, acabo de leer esto que es la información oficial más reciente.

Responder
Graciela  

:D ahhhh es una forma cordobesa de decir genial, buenísimo...
"negro el 'tutú' -auto- te quedó 'pipí cucú'" el negro estaba tugneando el auto jajaja...
te dejo un chiste que escuché ayer:
La mujer le dice al marido:
-Cacho te tengo que confesar algo...algo que sucedió hace muchísimos años
-¿algo que sucedió hace muchos años???
-te tengo que confesar que el Cachito no es hijo tuyo!!!
-bueno Ramona tampoco es tuyo!!!
-pero cómo, si Cachito salió de mi vientre, lo llevé durante 9 meses en mi panza, sufrí en el parto!!!
-¿te acordás cuando me dijiste, Cacho cambiá al nene?
Bien, fui a la maternidad y lo cambié por otro!!!

Es del Negro Alvarez, ayer lo escuché jajaja y no te dejo por hoy, solo por hoy el de Ramona Cabrera o Ramera Cabrona...será en el próximo capítulo...buen día y adiosshhhhhhhhh

Hablando de shhhh estuvo ayer shhhhhh en la capi Cordobesa shhhhhhhh

Responder
Raul  

OK, creo que lo quedaré como está

Responder
JMiur  

Graciela: De DJ a contadora de cuentos :D ¿Qué seguirá? :D

Responder
Graciela  

jajaja soy una caja de sorpresas...pobres mis hijas con la madre que les ha tocado en suerte!!!

Responder
JMiur  

Usted es ... multifacética :D

Responder
LuzdeLuna  

jaja los comentarios de Graciela siempre son tan divertidos!! esas hijas deben pasarla muy bien con una mami tan alegre! :) sorry me meti donde no me llamaron! :$

Bue, voy a lo mas prosaico. JMiur, me pasé la tarde tratando de poner todo el resumen de post, hasta que me venció blogger. Hice todos los pasos desde el 1 al 3, algo cambiaba pero no se abrían los resumenes con el [+/-] al final tbm perdí las imágenes chiquitas. Blogger no deja el código donde lo pongo, sino que lo baja a otro sitio de la plantilla, es decir, el include que en el 2º se agrega de la celda, luego de darle a guardar a la plantilla veo que está muy por debajo de otros códigos y no funciona.
Lo intentaré otro día, solo va mi comentario por si a alguien le ha ocurrido lo mismo y sepa porqué.
Un abrazo

Responder
JMiur  

LuzdeLuna:
Que el código se "reubique" no es problema, el orden en que estén carece de importancia. Desconozco el criterio con que Blogger los ordena pero no influye en nada.
Cuando quieras, colocalo en un blog de pruebas y me avisas así lo miro online.

Responder
Graciela  

yo te digo Luz de Luna no intentes asustarme con los espíritus jajaja...ahora que están apareciendo en las fotografías imagenes de personas fallecidas...así dicen por aquí...ohhh mi Deus todos los días tenemos una buena nueva!!! las hamacas que se mueven solas, las mujeres caminando sobre el agua con un vestido blanco...el enano de jardín que atraparon y lo tenían en una jaula...estamos fumando espirales!!! :O :o

y qué decirte de los OVNIS...mira que me preparo para verlos, espero que me lleven...pero ná!!!

Mis hijas se han ido 'adaptando poco a poco' han llegado a la conclusión que mejor una madre 'loca' que una amargada...haremos una tesis sobre eso pronto pronto!!!

Jmiur esto se está transformado en un Chat ;)...dile por favor a la pequeña Luz que Blogger anda como el mundo mundial, un día aprecias una cosa, al otro 'otra' valga la redundancia...así es Luz!!! :D

Responder
JMiur  

Me has dejado sin palabras :D

Responder
Graciela  

las mujeres somos así ;) me falta el dibujito de las pestañitas jajaja solemos dejar a los señores con bigotes paf jajaja

otro cuento, este es de gallegos pero lo hago a la cordobesa para no herir a nuestr@s amig@s

Llega el marido a la casa...siente llorar desconsoladamente al hijo

se acerca hacia la habitación, encuentra a la mujer en la cama...le recrimina

-No sientes que el niño llora sin parar!!!

se dirige hacia el hijo y le pregunta

-¿por qué lloras hijo!!!?

el nene le responde:

-el cuco papá, tengo miedo al cuco!!! señalando el placard de la habitación

el marido abre el placard y encuentra un hombre totalmente desnudo...le dice

-no te das cuenta idiota que el nene te tiene miedo, te rajas inmediatamente de aquí!!!

:)

Responder
JMiur  

Ohhhhhhhhh y este será un blog que incluirá un "número vivo", como los viejos cines :D

Esto hay que patentarlo :D

Responder
Graciela  

jajaja te lo imaginas...me muero sobre un escenario...intenté hace unos años cantar, me temblaba todo jajaja

grandes talentos...pero si una mira la TV dan unas ganitas de...cómo lo digo para no ser agresiva :X

Que tengas buenas noches, te voy dejando cuentos para que lo pases a tus amig@s y me vayas 'haciendo pata' en la Capital, buscando un teatro pequeño Jmiur, seamos humildes...¿te acordás de haceme la pata?...me está agarrando el viejazo...me había olvidado de eso, se lo tengo que contar a mis chicas jajaja...trata que no sea en la calle Corrientes ahí las 'chiruzas' me matan jajaja

Responder
JMiur  

Será Off-Corrientes y con transmisión en vivo. Habalremos con YouTube :D

Responder
Graciela  

jajaja ahí sí que mis hijas me desheredan del título de mamá jajaja

Crónica "una veterana hace de las suyas en la calle Corrientes, acompañada por su manager 'Don JMIUR'"...(si está Don Omar, puede Don Jmiur)

Papparazzi "Ventura asegura la tapa a la veterana"

Caras "la veterana en la Isla de Caras"

Pero si todo puede suceder en nuestro país, tenemos el futuro asegurado con este curro!!! jajaja

Responder
Bilosony2™  

Hola!! JMiur!! tengo una duda..como aria si no quisiera mostrar la primera entrada entera? quisiera mostrarla rusumida como todas las demas. E intentado y no puedo cambiarlo.. tienes alguna sugerencia??

Desde ya Gracias.
"muy buenas las ayudas que brindas desde tu blg"

Responder
JMiur  

Eliminando el condiconal que era algo así:

<b:if cond='data:post.isFirstPost'>
<b:include data='post' name='post'/>
<b:else/>
<b:include data='post' name='ResumenPost'/>
</b:if>

y dejando sólo esto;

<b:include data='post' name='ResumenPost'/>

Responder
Bilosony2™  

Gracias por el consejo..Pero ya lo avia intentado,:( el problema de esa opcion es que los post resumidos no se muestran expanidos cuando le haces clip al titulo, se mantinen resumidos hasta cuendo solo hay un post que mostrar. Pero igual gracias ya me estoy conformando tal como lo deje,la pregunta anterior me parece que la hice de mañoso jaja:D, porcierto me inspire en tu sistma de post resumidos para hacer el mio...;)


Suerte!!!!

Responder
Shark_Bloody  

Respecto a la parte del script que busca y muestra la imagen.
¿Como habría que modificarlo para que en vez de mostrar la primer imagen que encuentre, muestre la imagen solo si tiene cierta clase?

Por ejemplo:

Que muestre la imagen solo si tiene la clase .miniatura

Responder
JMiur  

Una idea general sería reemplazar esto:

if(listaImagenes.length>0) {
mostrarImagen = listaImagenes[0].src;
}

Y leer la lista de imágenes hasta encontrar una con esa clase:

for(var i=0; i<listaImagenes.length; ++i) {
if(listaImagenes[i].className!="miniatura") {
mostrarImagen = listaImagenes[i].src;
break;
}
}

Responder
Andres Fanatico  

JMiur como hago para colocar solo la imagen al lado del titulo sin los post resumidos. Pues me tocaria empezar desde cero y solo me interesa es cambiar la posicion de la imagen.
Gracias

Responder
JMiur  

No entiendo qué quieres hacer, Andrés; por lo que creo entrever, debería crearse un script distinto para eso y combinarlo con el que ya utilizas.

Responder
Andres Fanatico  

Pense que este script podria funcionar pero para no complicarme mejor dejarlo asi. de todas maneras muchas gracias por tu respuesta

Responder
Admin  

jejejjej Muchas gracia amigo JMiur

ya pude terminarlo todo en mi blog , Nada mas me falta personalizarlo
Mire mi Blog Como ba quedando:
http://admin-parasubirfotoacv2company.blogspot.com/

Responder
Admin  

Hoye amigo Te tengo una pregunta
no hay una forma de poder hace lo siguiente:
Tengo una img de 200 x 200 Px y quiero que esta foto se convierta en una versión mas pequeña de ella por ejemplo 100x100 px pero que siga estando todo igual me entiendes que sea entera con una versión Minitua de Ella?
Es Posible, y como lo aria?

Responder
JMiur  

Depende del código que estés usando; puedes ponerle width y height como parámetros o como estilos:

<img width="100" height="100" src="laImagen" />

o

<img style="width:100px;height:100px;" src="laImagen" />

Responder
Carolina CameronTags  

JMIUR, muchisimas gracias por la ayuda con los post resumidos, me llevó un buen tiempo pero ya está en el blog, quedó super! Todo solucionado gracias a las modificaciones que me indicaste, y hasta le puse borde a las imágenes. Te dejo un gran saludo, que tengas un buen día! :D

Responder
JMiur  

Gracias, Carolina. Me alegro que todo se resolviera :-)

Responder
Admin  

JMiur mi pregunta es como mira tu sabe que aki para la img tu cojes un porcentaje para indicarle que es lo que tiene que ajustar, entonce quiero como poder aser un Minitua que se ve la img completa pero en version Minitua pero que esto solo se vea en el Post Resumido no en el Post Oculto
Entiendes?

Responder
JMiur  

No entendí.

Responder
HaCk CrAcK  

Hice todo, pero no se me ven las miniaturas, que errores frecuentes pueden haber?

Responder
JMiur  

Puede ser cualquier cosa. Debería ver el ejemplo funcionando para tratar de encontrar el error.

Responder
Bilosony2™  

Una pregunta e visto que le as agregado un boton para contraer los post ocultos cuando los expandes. Me dirias como los a echo?? :$



Saludos.. :D

Responder
JMiur  

Eso ha sido una idea de Maite. Fíjate en la conversación de esta entrada.

Lo puedes colocar ahi, en el footer mismo donde ahora ves la cantidad de comentarios ¿Esa parte logras identificarla? Bastaría colocar ese mismo enlace que te dije antes:

Bsta colcoar el mismo enlace que expande, pero, en el post-footer de las entradas. Algo así:

<a class='toggleresumenpost' exprnclick='&quot;toggleResumenPost(\&quot;&quot; + data:post.id + &quot;\&quot;)&quot;' href='javascript:void(0);'>
CONTRAER
</a>

Responder
AdeL  

Hola es posible me puedas ayudar a modificar la plantilla para descargar que dejas osea me gustaria poner que el primer post se vea como el los demas post (Resumidos) y a la imagen le podria poner un fondo? para ponerlo un poco elegante :P

Responder
JMiur  

En tanto detalle no puedo ayudarte, si vas probando y necesitas ayuda si, pero diseñar plantillas no es mi oficio.

Responder
kxrl0z  

disculpa yo tengo algunos problemas con las imagenes en miniaturas desde que active el ultimo editor actualizado
las imagenes no se ven en miniatura no si me podrias ayudar muchas gracias

Responder
JMiur  

Lo más probable es que en el código HTML de la etiqueta IMG de las entradas no hayas eliminado los atributos width y height y por lo tanto, el CSS no funcione.

Responder
kxrl0z  

entonces doctor que me recomiendas estube para no tener ese problema sin modificar el tamaño de las imagenes con el nuevo editor. Disculpa una pregunta tu usas el nuevo editor ?

Responder
JMiur  

No uso el nuevo editor pero en ambos, el tema medidas es similar.

Ahora bien ¿Cuál es el problema que notas? Pregunto porque he visto el blog y no veo ninguno. Explícame un poco más.

Responder
Bilosony2™  

Hola! JMiur.. como se le podria dar algun efecto deslizante al expandir y contraer los post??


Saludos!!

Responder
JMiur  

Dependerá de cada caso en aprticular, por ejemplo, cuál efecto queires usar o qué librerías tienes disponibles. pero, la respuesta genérica es si, es posible hacerlo.

Responder
Bilosony2™  

Que buenno :D Te cuento que el unico efecto que quisiera usar seria un efecto Slide.. y actualmento estoy usando Jquery.. me ayudarias a poder lograr ese efecto??


Saludos!!!

Responder
JMiur  

Con jQuery no te sabría decir con exactitud ya que no lo utilizo pero, podrías intentar cambiando el script con la function toggleResumenPost(cual) {}

Algo así:

function toggleResumenPost(cual) {
var elpost = "#dummy-" + cual;
$(elpost).slideToggle();
}

Responder
Bilosony2™  

Andubo de maravillas!!! gracias!!!! :D "Pero" siempre hay un pero :( y noce porque hace como un tick la pantalla cuando cierro los post desde abajo eso solo me sucede en Firefox, y en IE anda todo mas que bien :D
Si tienees una solucion para ese tick te lo agredeceria y muchos mas!!:D

Igualmente gracias por la ayuda!!:D


Saludos!!

Responder
JMiur  

Eso lo desconozco.

Responder
Inés  

He implementado el "Resumen de Post" y me va ¡fantástico!, pero ahora me gustaría un efecto deslizante en las entradas. La librería que utilizo es Prototype y Scriptaculous. ¿Cómo lo puedo aplicar? Millones gracias por tu ayuda.

Responder
JMiur  

Inés:

Habría que saber cuál efecto. Supongamos que es el más fácil que es el efecto Toggle para que permute de estado.

Primero, en el CSS, deberías eliminar display:none; de .post-oculto { } y colocar eso directamente en el DIV así:

<div class='post-oculto' expr:id='&quot;dummy-&quot; + data:post.id' style='display:none;'>

Hasta ahí no hay cambios.

Faltaría entonces, modificar el script que ahora dice:

/ PERMUTAR ESTADO
function toggleResumenPost(cual) {
var elpost = "dummy-" + cual;
var elElemento=document.getElementById(elpost);
if(elElemento.style.display == 'block') {
elElemento.style.display = 'none';
} else {
elElemento.style.display = 'block';
}
}

y yo pondría esto:

/ PERMUTAR ESTADO
function toggleResumenPost(cual) {
var elpost = "dummy-" + cual;
var elElemento=document.getElementById(elpost);
Effect.toggle(elElemento,'slide');
}

Espero que se comprenda la idea.

Responder
Inés  

Perfecto, idea comprendida, aplicada y perfecto funcionamiento.
Genial!! Mil gracias!!!

Responder
JMiur  

Me alegro mucho, Inés :-)

Responder
Felipe  

Creo que esta secuencia de los post resumidos es un gran regalo que nos has hecho, y por lo menos esta publicacion de las miniaturas, complementa muy bien la 'tendencia' de mostrar publicaciones con imagenes y fragmentos de texto que vemos en muchas páginas web, y que en lo personal es un gusto a nivel estético. :)

A propósito, si me permites, quiero hacerte 2 preguntas:
Resulta que en muchas publicaciones la primera imagen que he puesto es un emoticon. ¿Es posible adaptar el script para que filtre un par de imágenes por url a la hora de mostrar las miniaturas?

Y la segunda, a la hora de realizar sprites, uno puede lograr resultados así:

<style>
.sprite {background:url(imagen_sprite.png) no-repeat 0px 0px;}
</style>
.. y luego
<div class='sprite' style='background-position:0px -20px;width:20px;height:20px;display:block;' ></div>

..pero tambien asi:
<style>
.sprite1 {background:url(imagen_sprite.png) 0px -20px;width:20px;height:20px;display:block;}
</style>
..para luego solo poner
<div class='sprite1'></div>

-- Es decir, dando el estilo inline o desde el css de la plantilla.
Ahora, poniendo todo del 'segundo método' repetiria muchas veces la url de la imagen; en cambio, al estilo del primer método, solo la pondría una vez.
Del segundo método, ¿Influye eso algo en el tiempo de carga del blog, o con que se cargue una vez la imagen es suficiente?

Disculpa la extensión. :)
Saludos.

Responder
JMiur  

Se pueden filtrar imágenes si a esas imágenes se les coloca alguna clase CSS y luego, se cambia esta parte:

if(listaImagenes.length>0) {
mostrarImagen = listaImagenes[0].src;
}

por algoo así, donde se evita que una imagen con la clase OCULTAR sea usada como thumbnail:

for(var i=0; i<listaImagenes.length; ++i) {
if(listaImagenes[i].className!="OCULTAR") {
mostrarImagen = listaImagenes[i].src;
break;
}

Lo otro es discutible pero, la idea fundamental de un sprite es que la imagen se cargue sólo una vez por lo tanto, usarla inline no tiene sentido.

Si por ejemplo, se trata de un sprite que tiene una serie de iconos iguales, lo lógico es establecer todas las propiedades comunes en una clase:

.sprite {
background:transparent url(imagen_sprite.png) no-repeat 0 0;
display:block;
height:20px;
width:20px;
}

y luego, usarla inline:

<div class='sprite' style='background-position:0 -20px;' ></div>
<div class='sprite' style='background-position:0 -40px;' ></div>

o crear clases:

.sprite_1 { background-position: 0 -20px; }
.sprite_2 { background-position: 0 -40px; }

y poner ambas clases en el DIV:

<div class='sprite .sprite_1'></div>
<div class='sprite .sprite_2'></div>

Responder
Felipe  

Voy a ver si hago el filtro, aunque como mencionas, si sería necesario añadir alguna clase adicional, mas bien podría modificar esas entradas para que 'agarre' otras imagenes mas relevantes. ;)

Y sobre lo de los sprites, gracias porque se has sacado de la duda y porque de a poco le voy cogiendo 'la maña', y más si se hacen a mano y en Paint.. Jaja
Gracias.! :)

Responder
Joel  

Yo tengo el mismo problema de kxrl0z, me refiero a que no aparecen las miniaturas |O, verifique unas dos veces el código pero esta todo bien :-I, este es el blog →Clic Aqui

Responder
JMiur  

Todos los scripts los tienes includos dentro de la etqiyeta b:skin y eso es el CSS del blog; debes colocarlos entre etiquetas script tal como tienes debbajo donde están las funciones de los posts relacionados; debjao de:
<script type='text/javascript'>
//<![CDATA[

Responder
Joel  

Gracias por tu ayuda, todo aun mejor de lo que pensaba :P

Responder
JMiur  

Me alegro que funcionara :D

Responder
Bilosony2™  

Hola Jmiur.. estoy teniendo unos problemas con los titulos de los post resumidos, no logro poderlos modificar en aparienci niciquiera puedo ponerles un efecto hover... Todo anda de 10, pero a los titulos de los post resumidos no los puedo modificar... me podrias ayudar haber que sera???

Saludos!!!

Responder
JMiur  

No sé que regla de estilo utilizas. Las definiciones son:

.post-resumen h3 {}
.post-resumen h3 a {}
.post-resumen h3 a:hover {}

Responder
Bilosony2™  

Hola!! Jmiur!! Tenias razon me habia re equivocado jeje gracias ya lo solucione todo :D
Tengo una idea!! :O o mas bien dicho una pregunta jeje se podria podria tambien poner de enlace a la miniatura?? a si no solo el titulo sea el enlace a hacia el post.


Suerte!!!!

Responder
JMiur  

Todo es posible pero, en el caso de est e ejemplo, la imagen es un fondo del DIV así que debería modificarse toda esa parte.

Responder
D2U2  

Buenas, me has ayudado bastante, me gustaría saber si existe alguna manera de agregar esto pero que no aparezca el primer post en grande, quisiera que todos estén resumidos.

Lo quiero para este blog: http://elchacaldelaverdad.blogspot.com

Responder
JMiur  

En ese caso, deberías cambiar el codicional, en lugar de poner así:

<b:if cond='data:post.isFirstPost'>
<b:include data='post' name='post'/>
<b:else/>
<b:include data='post' name='ResumenPost'/>
</b:if>

deberias poner algo así donde, lo único que muestras completo serían las entradas individuales:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:include data='post' name='post'/>
<b:else/>
<b:include data='post' name='ResumenPost'/>
</b:if>

Responder
D2U2  

Quedo perfecto amigo!! muchísimas gracias :P

Ahora me gustaría agregarle efecto deslizante como en el escaparate de rosa o efecto fade, y me gusta muchísimo el botón q agregaste para volver a resumir las entradas expandidas en la parte inferior derecha de esta

Responder
JMiur  

Puede agregarse cualquier efecto. En el comentario 53 se dice algo de eso.

Tambien en el post anterior, en los cemntarios, hay un detalle de cómo poner el botón para volver a contraer lo expandifo que no es otra cosa que el mismo enlace que se usa para abrir.

Responder
D2U2  

Seguí los pasos del comentario 53 pero lamentablemente la entrada no habría :S así que restaure mi plantilla, si es posible una explicación mas profunda del tema o una ojeada a mi blog a ver si algún otro script causa problemas no se :$ de antemano muchas gracias

Responder
JMiur  

Pués no hay mucho que agregar a eso; debería ver el ejemplo que hayas colocado para ver cuál es el error.

Responder
D2U2  

Al fin lo logre el efecto slide en los post ocultos, gracias al comentario 49, de verdad muchas gracias, quien habría pensado que el jQuery me resolvería la vida :$

Responder
D2U2  

Estoy teniendo un pequeño problema, a una de las entradas no se le ve la flecha para expandir, te dejo una foto a ver si puedes ayudarme

http://img529.imageshack.us/img529/7436/blogerror.png

Responder
JMiur  

Eso ocurre porque el texto es uy largo, ahí hay una dirección URL larguísima y eso hace que el párrafo se extienda hacia la derecha para permitir que se vea. Con ese esquema de diseño, deberías dimensionar la columan con los resúmenes para evitar que los contenidos se salgan de allí:

.txt-resumen {
...........
width:UNVALORpx;
}

Responder
D2U2  

Resuelto, Gracias :) eres grande

Responder
ALKA!  

Hola JMiur, primero te tengo que felicitar por tu blog...es lo mejor!! y segundo te tengo una pregunta... las imagenes de las entradas resumidas se ven en blanco, como hago para solucionarlo... aqui te dejo el link:

http://alkachey.blogspot.com/

Gracias.

Responder
JMiur  

Lo que no veo en el código fuente, es la parte del script que agrega las imágenes y que es, justamente, el que se muestra en este post. Es una variación del anterior, me parece que te has olvidado de agregar esa parte. El resto, parece funcionar perfectamente.

Responder
ALKA!  

Muchas gracias ya resolví el problema de las imágenes :D, pero tengo otro problema....ya no quieren expandirse las entradas resumidas, antes funcionaban perfecto pero ahora nose que le pasa...espero que me ayudes JMiur...Gracias y disculpa.

P.D: mi plantilla esta muy modificada y tantos códigos me confunden jeje :P

Responder
JMiur  

Has colocado el código corregido pero, debajo, jas dejado el código viejo con etiquetas abiertas. limina toda esa parte.

Responder
ALKA!  

Disculpa JMiur, cual código viejo con etiquetas abiertas te refieres tu?... me podrias decir cual? o darme un ejemplo...Gracias. :P

Responder
JMiur  

En el código fuente se lee esto que es un error porque estas abriendo dos veces la etiqueta:

<script type='text/javascript'>
//<![CDATA[
<script type='text/javascript'>
//<![CDATA[
.............
aparentemente este es el código de la función resumenPost(idPOST) vieja, la que no tenía la aprte de imágenes y está repetida.

Responder
ALKA!  

Ya lo hice JMiur....ya se pueden expandir las entradas pero volví al mismo problema...las imágenes están otra vez en blanco...y nose que código falta o cual tengo que borrar...:S

Responder
JMiur  

En tu blog hay dos fuinciones resumenPost(idPOST) una de ellas es la nueva (arriba) la otra es la vieja (abajo): Sól odebías reemplazar la vieja por la nueva pero, has dejado ambas. Debes borrar la vieja.

Responder
ALKA!  

Ya lo borre, se ven las imágenes pero no se expanden las entradas...:S...debe haber algún código que esta fastidiando..se expanden las entradas o se ven en blanco...:S

Responder
JMiur  

También has borrado la función toggleresumenpost() que expande y contrae las entradas. Busca ese código en el post anterior y agrégalo.

Responder
ALKA!  

JMiur! GRACIAS ! por tener paciencia y ayudarme a modificar mi plantilla, eres lo mejor! Dios te bendiga hermano ! Te deseo exitos! cuando termine de completar mi blog voy a colocarte en agradecimientos! se me cuida y muchas gracias por ayudarme a mi y a todas las personas que necesitan de tu ayuda! :D

Responder
JMiur  

De nead ALKA. Si ya se solucionó, me alegró :-)

Responder
Jorge Verón Schenone  

¡ Hola JMiur !, hace tiempo que no realizaba un comentario; estuve entretenido aplicando la herramienta @media de CSS al blog (para redimensionar las páginas de acuerdo a la resolución de pantalla del usuario). Aún falta realizar algunas modificaciones, pero la tarea se encuentra bastante avanzada. Sobre el tema del artículo, quería hacerte un comentario, no se muestra el contenido de una página de resultados. El problema se puede apreciar en el blog de pruebas: "http://vpresumenposts2.blogspot.com/search?q=parámetros&x=0&y=0&max-results=50". Modificando los condicionales, se soluciona. Ahora la consulta: Con motivo de la utilización de @media, tuve que establecer un método de creación de imágenes para los post (una imagen de gran tamaño, que reduzco mediante CSS); por eso la implementación de una imagen como background no resulta práctica. Me podrías dar una idea de cómo modificar la rutina javascript para implementar, por ejemplo, <img src="'+ mostrarImagen +'" />. Si bien en el blog (Proyecto Web) actualmente estoy utilizando otra rutina, considero más práctica la tuya (en otras cosas porque no redirecciona al artículo que ya se encuentra oculto). Luego de varios intentos con getElementById, comprendí que mis conocimientos de Javascript no son tan profundos :). Gracias, desde ya, por tu ayuda. Un gran abrazo y que tengas un ¡ excelente año !. Jorge

Responder
JMiur  

No. En esa plantilla no están previstas páginas de listas de ninguna clase ya que sólo se trata de un demo. Por eso no tiene etiquetas ni Archivos ni buscador.

no estoy seguro si lo que quieres modificar es esta parte:

var spanThumb = "thumb-" + idPOST; // y la colocamos como fondo en el DIV
document.getElementById(spanThumb).style.backgroundImage = "url("+ mostrarImagen + ")";

Si es así, primero debe cambairse el HTML:
<div class='miniresumenpost' expr:id='"thumb-" + data:post.id'/>
por algo así:
<img class='miniresumenpost' expr:id='"thumb-" + data:post.id src='''/>

Hecho eso, el script sería algo así (uso las mismas variables):

var spanThumb = "thumb-" + idPOST; // y la colocamos como SRC de la etiqueta IMG
document.getElementById(spanThumb).src = mostrarImagen;

Responder
Ark  

Jmiur: Hay alguna forma de desmontar el script (el que das en el "resúmen los post 2") para que NO incluya el efecto toggler, el de abrir y contraer las entradas.

Consigo eliminarlo totalmente, pero al hacerlo dejan de funcionar las imágenes de miniaturas en los post. Además siento curiosidad por saber si sin el efecto activado no se carga el post completo reduciendo los tiempos de carga.

Responder
Jorge Verón Schenone  

Hola JMiur, ¡ cómo estás ! Si bien hace tiempo te había agradecido la respuesta por e-mail, deseaba hacerlo ahora desde aquí. El script ya está funcionando correctamente en mi blog principal (Proyecto Web). Sólo pude notar una diferencia con el código editado (seguramente ocasionada por el propio editor de blogger). El caracter especial reservado " (comilla doble) debe ser escrito como código. Además en "src=''/>" se había filtrado un apóstrofe (o comilla simple) de más. Un gran abrazo y ¡ muchas gracias !
Jorge

Responder
JMiur  

Eso sólo es un enlace, si sacas el enlace es suficiente:

<a class='toggleresumenpost' expr:onclick='&quot;toggleResumenPost(\&quot;&quot; + data:post.id + &quot;\&quot;)&quot;' href='javascript:void(0);'>[+/-]</a>

Responder
Ark  

A lot of thanks. Ya es muy tarde aquí y he desmontado todo el invento de las entradas resumidas para empezar mañana mas tranquilo.

A ver si te paso un enlace con los resultados, creo que estoy consiguiendo resultados interesantes.

Responder
STBAN  

Gracias Jmiur muy buen complemento para nuestros blogs

Responder
La tahona  

Hola, bueno he conseguido llegar hasta aquí, sin tener ni puta idea jejee Ahora me quedan dos defectillos, no me muestra los comentarios ni las etiquetas en el post expandido.
Y la fecha se me amontona un poquillo.
A ver si me puedes echar una manilla, creo que soy el más torpe de la clase. Muchas gracias por adelantado, perdón por la ignorancia un saludo.

Responder
JMiur  

Lo de la separación es fácil de resolver; podrías agregar un margen a las tablas de este modo:

.post-resumen {margin:10px 0;}

Se le puede agregar todo el footer de los posts; para esom, debes buscar esa parte en tu plantilla, copiarla y pegarla en esa parte donde está el post oculto, dentro del includable llamado ResumenPost; aquí:


<div class='post-oculto' expr:id='&quot;dummy-&quot; + data:post.id'>
<div class='post-body'>
<p><data:post.body/></p>
<div style='clear: both;'/>
</div>

AQUI SE PEGARÍA EL FOOTER

</div>

No puedo darte más detalles porquen o sé que díce tu footer. Los comentarios no se muestran porque eso, sólo es visible en las páginas individuales.

Responder
La tahona  

Bueno ya vamos consiguiendo casi todo jejeje!!! Ahora ya me veo embarcado en otra embajada... ¿Sería posible añadir el efecto deslizante mediante Motools? He conseguido que jQery que jQuery y Motools se lleven bien con jQuery.noConflict(). Pero es algo que no se si se puede hacer con Prototype y Scriptaculous, me parece que no.

Prototype y Scriptaculous lo he conseguido pero sabía que algunos elementos no iban a funcionar y así pasó. Conseguí el efecto pero perdí el menu y hacer de nuevo todo el menu... para alguien como yo es un curro de la ostia. ya he visto el tuyo http://vagabundia.blogspot.com/2009/09/menu-desplegable-con-scriptaculous.html y creo que la solución pasaría por ahí. Pero bueno por si acaso me ahorras cambiar el menu que utiliza Motools te pregunto.

Perdona, no se si entenderás lo que digo... seguro que si. Y gracias por el consejo anterior iba de lujo.XDD

Responder
JMiur  

Aunque se consiga compatibilizar las librerías, lo razonable es no mescalarlas; son pesadas y por lo tanto, afectan los tiempos de carga y siempre es posible que alguna cosa no funcione. Con MooTools no tengo idea.

Responder
La tahona  

¿Y con jQuery.noConflict() se podría conseguir este efecto?

Responder
JMiur  

jQuery también dispone de efectos similares al toggle así que deberás probar cómo funciona. Estos son los efectos básicos.

Responder
La tahona  

ya he estado trasteando con lo que explicas en ese post pero me supera no se muy bien cual es el nombre de los elementos, ni lo que tengo que añadir... pero bueno,no está mal llegar hasta aquí jejejejej muchas gracias. Un placer atender a tus explicaciones.

Responder
La tahona  

¡¡¡¡CONSEGUIDO!!!! Me he vuelto loco pero al final en el último momento lo he conseguido, muchísimas gracias, voy a ver si me meto en otro lío de estos tuyos jejejjeje me encanta.
El problema era que al utilizar jQuery.noConflict() estaba poniendo una vocal q por una Q al sustituir $, si es que cuando uno nace tonto....XDDD Un saludo.

Responder
Svalin  

Saludos JMiur

Enhorabuena por el blog, es una referencia ya clásica para buscar e implementar trucos en Blogger

Al respecto de esta guía en 3 pasos, tengo una duda. He conseguido implementarlo absolutamente todo, sin problema ninguno. He modificado un montón de cosas en los CSS y demás sitios para que se vea todo tal y como yo quiero, y hasta el momento sin problemas

Pero hay una cosa que no soy capaz de cambiar..
La barra (border-bottom) de debajo del título principal de la primera entrada del blog. Toqueteo en todos los CSS, y si bajo el título, se baja la barra. Si subo la barra, se sube el título, etc.. osea que ambos elementos, barra y título para estar encadenados. Mi intención es simplemente la de bajar un poquito el título porque tal y como está ahora está muy subido

Te paso el blog que tengo de pruebas para que le eches un vistazo, a ver si sabes exactamente dónde debo tocar: http://avisodellegada.blogspot.com/


En otro orden de cosas, y sólo si tienes tiempo, me gustaría saber cómo cambiar la imagen de [+/-] por otra, que lo he leído en los comentarios pero no consigo aclararme. Y lo de poner un recuadro a las imágenes en miniatura, para que no queden tan sosas así puestas, si sabes cómo pues genial

Un saludo

Responder
Svalin  

Perdón por el doble posteo

Lo de cambiar el [+/-] por una imagen ya lo he conseguido. Me he leído absolutamente todos los comentarios, varias veces, de las 3 entradas de 'Resumen posts', y estoy algo saturado pero lo he conseguido. Al final esto será como Matrix y acabé viendo 1s y 0s por todas partes

Me he encontrado con varios problemas o cosas a solventar, te comento:

-Lo que te decía en el post anterior de poner un 'marco' o un 'recuadro' a las imágenes en miniatura, que así sueltas quedan un poquito feas la verdad

-Ignoro por qué, pero al expandir una entrada el tipo de letra sigue siendo Verdana, pero atención, ¡me ensancha la letra! Ô.o ¿hola? Ni idea de por qué..

-Lo de que al extender las entradas se muestre si tiene comentarios, el footer, o las Categorías (Etiquetas, yo las llamo Categorías) lo he leído en comentarios, a mucha gente le sale, pero no soy capaz de hacerlo. He buscado ese (o parecido) que se menciona, pero ni idea de qué tengo que poner dónde. No doy para más con este tema, necesita un guía burros pero para burros de verdad xD


Y creo que nada más. Sigo investigando, sigo trasteando, y sigo releyendo los comentarios de los usuarios y tuyos en respuesta a ver si saco algo en claro

He adaptado ya todos los cambios al blog 'oficial', no al de pruebas. El enlace lo tienes aquí: http://toma-7.blogspot.com/

Un saludo, y muchas gracias por todo

Responder
Svalin  

Yarg, triple posteo, perdón de nuevo >_<

-Lo del efecto slide con el script Scryptoupolus
He leído que el usuario Neko lo ha conseguido, pero lamentablemente no ha puesto cómo. La idea la sacó de aquí: http://elescaparatederosa.blogspot.com/2009/04/efecto-deslizante-slide-para-entradas.html y su comentario es el número 25 de aquí: http://vagabundia.blogspot.com/2009/10/resumen-posts-2-extractos-del-texto.html

He probado a poner los scripts antes de (que no me deja escribirlo), he cambiado la frase que menciona Rosa en su escaparate, pero se me estropea el expandir/contraer y deja de funcionar. ¿Alguna idea?

Y prometo no postear más hasta tu respuesta xP

Responder
JMiur  

A ver si entiendo :D

Subir el título. Como se trata de una tabla, por defectom la alineación vertical es centrada así que, lo más simple sería agregar esa propiedad así:

/* la dejamos centrada en la imagen */
.post-resumen td.celdaimg { vertical-align: middle; }
/* la alineamos arriba en el texto */
.post-resumen td {vertical-align: top;}

con eso, puedes controlar la posición del título, estabelciendo sus márgene en .post-resumen h3 {}

Para poner un recuadro a las imágenes en miniatura, agreagrlo acá: .miniresumenpost { }

La fuente de texto es la misma tanto en uno com oen otro caso ya que en ninguna parte haces un cambio; puede ser que lo que veas sea sólo un efecto producido porque esl espacio es menor y el texto no está justificado que es lo que hace que en als entradas expandidas, parezca que las letras están mas separadas.

Sobre mostrar el footer de los post no puedo agregar mucho más porque depende de cada plantilla y de que elementos se quieran mostar.

Para expandir y contraer con ese método, debes agregar las librerías y yo no sé si tiene sentido hacerlo para usar sólo ese tipo de efecto; toda librería es pesada y la lógica es usarla para varias cosas; si ese es el caso, entonces, primero debes agregarlas antes de </head>

<script src='http://ajax.googleapis.com/ajax/libs/prototype/1/prototype.js'/>
<script src='http://ajax.googleapis.com/ajax/libs/scriptaculous/1/scriptaculous.js'/>

Responder
Svalin  

Saludos de nuevo


-No, lo del título me refiero al título de la primera entrada del blog, osea la no expandida, en este caso la de 'Origen (Inception)'. Si te fijas, ese mismo título está como 'muy arriba', a la altura del 12 (la fecha), y lo que quería era bajarlo un poco (pongamos que a la altura del mes (abr). Lo he conseguido, sí, pero si bajo el título se baja también, como si estuviera encadenado a él, la barra (border-bottom) negra que cruza de lado a lado que está encima de las Categorías y debajo de la fecha y el título

Si muevo el título, se mueve la barra. Si muevo la barra, se mueve el título. Y claro, si pongo: 'Origen (Inception)' más abajo, la barra se baja y acaba por tacharme el 'Publicado por Svalin' y las Categorías xP


-Lo del borde en las imágenes, correcto, tal y como tú has dicho =)
Para los que lean los comentarios (como yo) buscando soluciones, comentaré que se pone donde dijo JMiur (.miniresumenpost), y que se puede añadir al CSS algo tipo: border: 1px solid #562a27; (para darle borde, del tamaño que queramos, de la forma que queramos, y del color que queramos respectivamente). Aparte de eso añadí otra línea que busqué en Internet para crear sombra muy fácilmente, esta: box-shadow: 5px 5px 3px #000;

Este apartado solucionado, muchas gracias


-Creo que te comprendo sobre lo de las letras ensanchadas en el post al expandir entradas. En ese caso, ¿habría alguna manera de justificar el texto únicamente para las entradas expandidas? Supongo que sí, incluso intuyo (aunque lo mismo me equivoco) que parece algo relativamente sencillo, pero no sé qué cógido poner ni dónde (supongo que un texto de justificar texto y en alguna parte del CSS que sea para los resúmenes del post)


-Lo de mostrar el footer, los comentarios y las Categorías en las entradas resumidas al extenderlas, te paso una copia de la plantilla que utilizo para que puedas echarla un vistazo, a ver cómo iría el asunto: http://www.megaupload.com/?d=8TCZQTRT


-Lo de expandir con efecto Slide, pongo ese cógido que comentas pero no sale nada. De todas maneras es cierto que he leído que dices muchas veces que cargar librerías no es bueno. Y la verdad, prefiero hacerte caso a ti. Veo que tú tienes ese efecto Slide en este blog, así que preferiría hacerlo a tu estilo en lugar de poner todos esos códigos, si me dijeras cómo hacerlo


Si crees que todo esto que te estoy comentando es demasiado lioso, puedo darte acceso como Administrador al blog para que sea todo más fácil, luego me dices qué cambiar y listos. Por si acaso te subí una copia de la plantilla a ver si te vale de algo

De nuevo gracias por todo =)

Responder
jαvιєя.ɢm  

Hola JMiur,

Creo que estoy en la entrada correcta, pues quiero hacer que los posts se vean como en tu página principal..

Sin embargo, se me presentaron un par de problemas..
Primero, el título de la entrada que se ve, se desconfiguró completamente; y segundo, no aparecen las fechas en ninguna parte..

Sabes cómo puedo solucionarlo?

De antemano, gracias

PS: En este blog estoy haciendo las pruebas: http://templatest1234.blogspot.com/

Responder
JMiur  

Supongo que te refieres al título de la primera entrada. En este tipo de ejemplo , tanto ese título como la fecha y otros datos, están dentro de un div llamado encabezado o algo similar que tiene agregada la propiedad position:relative que es la que permite que luego, el título y la fecha, se puedan posicionar con position absolute.

La fecha no se ve porque no has configurado su formato que, en este momento, sólo indica la hora y no el día. Mira de nuevo la entrada correspondiente a esos dos temas.

Responder
PuroJuego  

Hola JMiur, utilizo LazyLoad y he comprobado que no funciona en los Post Resumidos pero si sin estos. ¿Podrias ayudarme con algun codigo para lograrlo?
Aqui dejo el blog de Prueba
Gracias.

JMiur  

No sabría decirte porque no sé cómo funciona ese script. Sí lo que veo es que el navegador marca un error en:
recentpostthumbspy-min.js
y otro acá:
$('#rp_list a').tipsy({gravity: 's'});
pero, desconozco si eso influye o no.

Responder
Rodrigo Acuña Bravo  

Me quedó perfecta toda la secuencia para llegar a los resumenes, sin embargo me gustaria que en vez de mostrar un fragmento, la miniaturamostrara la imagen entera (redimesionada) quiero probar aun a riesgo de que como señalas se distorsionen algunas.

Gracias !

Rodrigo

JMiur  

Eso lo controlas con el CSS de esa parte.

Rodrigo Acuña Bravo  

Si, eso lo sabía, lo que no atino es a como modificarlo.

Saludos

JMiur  

Amplio más porque no sólo es CSS.

Primero que nada, por lo que veo, deberías modificar el script ya que allí, las imágenes se muestran cono fondo así que, en lugar en hacer eso, habría que agregar una etiqueta IMG con la imagen.

Domde dice:

document.getElementById(spanThumb).style.backgroundImage = "url("+ mostrarImagen + ")";

debería ponerse algo así:

document.getElementById(spanThumb).innerHTML = "<img src='"+ mostrarImagen + "' />";

Eso, colocará la imagen con su tamaño original.

Luego sí, se establece el CSS, eliminando esto:

.miniresumenpost { /* la imagen será un fondo, centrado y del tamaño que uno quiera */
background:transparent url() no-repeat left top;
height: 120px;
overflow: hidden;
width: 150px;
}

y estableciendo el tamaño de la imagen como quieras:

.miniresumenpost img {width: 200px;}
esto la pondrá de 200 de ancho y su altura será variable

.miniresumenpost img {height: 200px;width: 200px;}
esto la pondrá de 200x200

Rodrigo Acuña Bravo  

Te pasaste ! ahora quedó como quería, me gusta así, aun cuando deforma un poco las imágenes verticales y las panorámicas ni hablar...vamos a ver si me conformo si no lo cambio no más

Abrazos desde Chile !

JMiur  

La deformación ya es algo subjetivo así que ahí no opino; el resto: perfecto :D

Roudy Capella  

Estaba a punto de preguntar lo mismo que Rodrigo Acuña, pero leyendo los comentarios para ver si alguien había preguntado lo mismo, veo tu respuesta del comentario 116, lo apliqué y me gusta el resultado. Ya que se ve la imagen completa. Yo deje el tamaño en
.miniresumenpost img {height: 100px;width: 100px;}
Se ve mejor de lo que esperaba. Gracias.

Responder
sephi  

:S enlace zip roto

JMiur  

No veo que haya problema alguno con el enlace.

Responder
PuroJuego  

Hola JMiur estuve probando el truco “Scroll Infinito” el cual me funciona y me carga todas las entradas, el problema es que después de las 10 primeras no muestra imagen ni mini-texto en los post-resumidos podrías ayudarme, ya que según el autor esto depende de los trucos implementados para resumir entradas.
Aquí dejo la fuente y el código para que veas:
http://blog.manki.in/2012/04/how-to-add-infinite-scrolling-to.html
https://code.google.com/p/manki-scripts/source/browse/blogger-infinite-scrolling.js
Gracias y saludos.

JMiur  

Lo siento pero no conozco ese script mi lo he probado. Tendrás que consultar con los desarrolladores.

Responder
Yurika-Chan  

JMiur de nuevo yo, estoy tratando de hacer algo como lo de este blog pude organizar todo los elementos pero el problema fue la imagen, leí los comentarios y vi la solución del comentario 116, me funciono pero no quiero que la imagen se deforme, ya intente poniéndole a la celda un ancho y alto definido y que oculte el resto pero no funciono, no se que estoy haciendo mal

JMiur  

Si la imagen tiene un ancho y un alto definidos, siempre se deformará cuando n ose corresponda con la proporción de la origina. Si sólo se define uno de esos datos, no se deformará.

Si se usa Picasa. se puede solicitar la versión cuadrada s128-c por ejemplo.

Para más detalles, debo ver el ejemplo concreto ya que lo que muestras como referencia, sólo es una imagen.

Yurika-Chan  

Es algo que vi en este blog, lo único que no me funciona es la imagen

JMiur  

No sé que enlace es ese ni en dónde está tu ejemplo.

Angelicsan  

Lo que me refiero es que quiero lograr que las entradas resubidas se vean como el blog que pongo de referencia, ya logre ubicar todos los elementos como en el ejemplo, pero no logro que la imagen quede de ese tamaño sin desconfigurarse

JMiur  

Y sigo repitiendo lo mismo: no sé cuál es el blog donde estás probando y los enlaces que has dejado,son una imagen y un error.

Yurika-Chan  

Este es el blog de referencia http://www.animegatari.com/

No lo he probado en ningún blog por que revertí los cambios al ver que no me funcionaba como esperaba

JMiur  

Las imágenes de ese sitio no se deforman por una razón muy sencilla, el tamaño es exactamente ese, tal como se ven: 695x250 y la que se ve e los posts es otra, una miniatura de 186x186.

Yurika-Chan  

No me había fijado, pero hay alguna forma de hacerlo????

JMiur  

Coloca siempre imágenes de un mismo tamaño; no entiendo a que te refieres.

Responder
Yurika-Chan  

Me refiero a que las imagenes que pongo algunas no se podrán poner del mismo tamaño como lo hace el blog de referencia que te puse, mi idea es que quede asi, sin deformarse, o sea que se vean así de grandes y muestren una sola parte como lo hace el código actual, pero al intentar cambiar el tamaño sin hacer el truco del comentario 116, simplemente no se agrandan :(

JMiur  

Y es imposible responderte sin ver tu ejemplo concreto.

Responder

¿Quiere dejar un comentario?

recuerde que los comentarios están siendo moderados y serán publicados a la brevedad ...

Todos los archivos y demos alojados en Fileden han sido redireccionados y deberían estar funcionando correctamente.
De todos modos, también puede accederse a ellos a través de SkyDrive

Nota: sólo los miembros de este blog pueden publicar comentarios.

Si le gusta ir a lo seguro utilice este botón para abrir los comentarios en una ventana modal en esta misma pagina.

Si añora tiempos idos, use este enlace para agregar un comentario al viejo estilo ...

 
CERRAR