Echad un vistazo a vuestra plantilla de Diseño de Página: si vais a añadir un nuevo Elemento, fijaos en que, arriba del todo, hay dos utilidades nuevas: "Google News" y "Video-Bar"... caray... como se está automatizando ésto...

[+/-] |
Por si nadie se ha dado cuenta... |

[+/-] |
Siguen cambios |
he dejado los "Artículos" de la sidebar en expandir-contraer... porque cada vez ocupan más espacio (normal: si sigo escribiendo, tendré que mudarme de nuevo, je). Lo tengo explicado en Ayuda&Kaos, con la etiqueta "Peek-A-Boo", y con el título "Esconder/mostrar".
.- He puesto los títulos de la sidebar en negrita (nada más fácil:
<h2>pero se lee mejor así</h2>
pero se lee mejor así
.- He quitado los bordes a todas las imágenes: la definición "post3" de mi plantilla estaba repleta de "borders"; así que, donde daba a una "image" un border 1px, le he quitado el "1" y le he puesto un "0". Listos.
.- Y me he puesto una florecita de icono... al lado de mi nik en el pie de la entrada, je (en Ayuda&Kaos, donde expliqué cómo se hace-mirar etiqueta "Autor"-, tengo un muñeco mascando chicle

Nada más, por el momento...

[+/-] |
Comentarios Peek-A-Boo (Plantilla Clásica) |
Me ha costado bastante insertarlo en Pruebas Clásica, la verdad... porque no estoy tan familiarizada con este "lenguaje" como con el de las nuevas plantillas..
Pero... ahí está: lo conseguí, je . Guiándome por las instrucciones de Ayuda de Blogger:
1º.- Insertad en el CSS de comentarios de la plantilla lo siguiente (están antes de terminar la tag /style):
.commenthidden {display:none}
.commentshown {display:inline}
2º.- Insertad el siguiente script antes del cierre de la tag /head:
<script type="text/Javascript">
function togglecomments (postid) {
var whichpost = document.getElementById(postid);
if (whichpost.className=="commentshown") {
whichpost.className="commenthidden";
}
else {
whichpost.className="commentshown";
}
}
</script>
3º.- Bajad la plantilla hasta encontrar la apertura del MainorArchivePage que enlaza con los comentarios (¡OJO!: NO CONFUNDIR CON LA DEL ARCHIVO DEL BLOG), y que contiene el linkk de los comentarios, encerrado en un código similar a éste:
<MainOrArchivePage>
<BlogItemCommentsEnabled>
<a href="<$BlogItemPermalinkURL$>#comments">
<$BlogItemCommentCount$> comments</a>
</BlogItemCommentsEnabled>
</MainOrArchivePage>
Lo primero que hay que hacer aquí, es eliminar la apertura y el cierre del MainorArchivePage, para que podamos desplegar nuestros comentarios en cualquier página del blog: no sólo en la principal.
Ahora, debemos sustituir el "permalinkUrl" de enlace de los comentarios, por éste otro:
<a href="javascript:togglecomments('c<$BlogItemNumber$>')">
De manera que esa pieza de código nos va a quedar algo parecido a ésto (ej., en mi plantilla):
<BlogItemCommentsEnabled>
<a href="javascript:togglecomments('c<$BlogItemNumber$>')">
<$BlogItemCommentCount$> comentarios</a></BlogItemCommentsEnabled>
4º.- Bajad un poco más la plantilla, hasta dar con un "ItemPage", dentro del que se encierran muchas piezas de código sobre comentarios, hasta su cierre.
Eliminad el <ItemPage>
y colocad en su lugar lo siguiente:
<span class="commenthidden" id="c<$BlogItemNumber$>">
Para que se desplieguen los comentarios al picar en ellos.
Bajad hasta el cierre de </ItemPage> y sustituidlo por el cierre del span: </span>
Ahora ya podéis guardar (si en Vista Previa ha ido todo como debiera) y ya tenéis desplegados vuestros comentarios, con sólo picar en el número de comentarios del pie de la entrada.
Es complicado... pero merece la pena


[+/-] |
Etiquetas bajo el título de la entrada |
Como las véis en este blog. Y es muy fácil:
Sólo tenéis que trasladar el "span" de las "labels" al cuerpo de la entrada "post-body":
Aquí está la tag post.body:
<div class='post-header-line-1'/>
<div class='post-body'>
Y éste es el "span" de las labels que se ha de cambiar de su lugar al cuerpo de la entrada:
<span class='post-labels'>
<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
<b:if cond='data:label.isLast != "true"'>,</b:if>
</b:loop>
</b:if>
</span>
De forma que el cuerpo de la entrada nos quedaría sí, tras el "traslado":
<div class='post-header-line-1'/>
<div class='post-body'>
<span class='post-labels'>
<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
<b:if cond='data:label.isLast != "true"'>,</b:if>
</b:loop>
</b:if>
</span>
Ya está...


[+/-] |
Uf... |
Ahora que Singpolyma ha recuperado sus scripts y podemos volver a funcionar con cosas como la imagen del autor del comentario (podéis ver que el blog la ha recuperado... así que he quitado la imagen que había insertado yo en su lugar)... me percaté, de paso, de que había adaptado su hack sobre Peek-A-Boo de comentarios... en el sentido de acotar el número de comentarios a desplegar.
Y pensé:
.- "Bueno... no tengo mucho que "limitar", pero... por probar el hack..."
En buena hora se me ocurrió... porque llevo una hora dándole vueltas al blog en todos los sentidos ... hasta que he decidido dar la vuelta y dejar los comentarios tal y como estaban (eso de sustituir la tag "dl" del bloque de comentarios por un "div"... como que no me presagiaba nada bueno, jaaajajajja).
En fín: que yo he preferido no tener doscientos cincuenta errores en la página, ni alterado el formato de fecha de página y ausente el "DIJO:" en las "item"... que es lo que me ha sucedido al ejecutar el hack.
Pero, para quien quiera probarlo, está en esta dirección de Singpolyma

[+/-] |
Donde dije "Digo"... |
Digo "Diego"...
Hablo demasiado rápido, jajajajaja... porque he decidido tener en wordpress mis dos blogs "Cuentos e Historias" y "El Club de los ex-Cónyuges": como dos páginas dentro de la página principal, que he llamado Kasbah (por aquéllo de que es un revoltijo de temas, je).
He insertado en esa plantilla de wordpress los "widgets" que véis: Entradas recientes, COmentarios Recientes, blogroll, calendario, Meta... etc. y ha sido bastante fácil, una vez que entendí cómo funcionaba.
Si a alguien le interesa saber cómo inserté los widgets y cómo puse dos subpáginas dentro de una principal... me preguntáis y os respondo en cuanto tenga un minutín

[+/-] |
Se acabaron los "experimentos" |
Por ahora... que me conozco, je .
Y es que... llevo más de veinticuatro horas "luchando" por encontrar una forma de acceder a las "tripas" de una plantilla de Wordpress... e intentando que el "Administrador" del blog me deje ver un poquito de CSS, de HTML... de algo...
Y no. Porque... para personalizar la plantilla de Wordpress a tu gusto, hay que pagar. Así de claro.
Lo mismo me da y ni pienso si es poco o mucho. Es que me niego a pagar por ver una plantilla que yo voy a "rellenar" con contenidos y que va a publicitar al organismo editor.
Tu-ru-rú.
Así que, después de "resignarme" a no poder tocar nada, como no sea la cabecera (y no en todas las plantillas) y aguantarme con el resto del diseño de "fábrica"... me he puesto a buscar plantillas (porque no me gustan las de "serie" de Wordpress... y he encontrado una guapísima, estilo "diario" (Newspaper). Pero claro... todita en inglés: y me ví escribiendo en una plantilla donde son todo "tags", "posts", "comments", "archives", "Edit", etc.... y... como que no...que se me subió la "idiosincrasia" a la cabeza.
Así que, con la moral por los suelos (Jjajajjajaaaa ) me vuelvo a Blogger: será más difícil diseñarlo que las plantillas de Wordpress, que lo dan todo hecho, pero... no me gusta que me den tanto... por no permitirme hacer las cosas a mi manera.
Y, de paso, he "recordado",, que tengo la Página Principal ("Main") hecha un desastre (sin actualizar). Y que quiero unir dos de mis blogs, para poder contar con el espacio de uno de ellos... y suprimir de una vez aquéllos blogs en las que ya no entro... y que tengo la "novela" absolutamente abandonada, así como mi blog de "protestas"... y que "debo" no sé cuantos correos (glups )
No me apetece un pimiento "limpiar la casa", pero... no voy a dejar la blogoesfera repleta de blogs sin usar. Así que... toca pasar la escoba.
Sin contar con que tengo multifunción nueva , que he instalado yo solita esta tarde... y tengo que probar cómo me sale el escaneado de fotos, para luego imprimirlas
Uf... qué rollo... pero hay que hacerlo (y todo ésto para decir (je), que conforme vaya terminando con esas cosas, ´tengo que contar cómo poner lista de etiquetas y de cmentarios recientes en la plantilla clásica de Blogger... o cómo poner un "Escrito por X hace X días"... o como sustituir los meses del archivo de la clásica (en lugar de "marzo 2007", algo como "Primavera... que la sangre altera") o... emoticones y trackback para la clásica (si no se ponen en el lugar adecuado... se dan de tortas). Y a ver si por fín, comento dónde hay que insertar el span de las etiquetas, para verlas bajo el título de la entrada... o colocar una imagen o icono donde a uno le de la gana de la Edición de plantilla, para presidir los comentarios o para presidir las categorías de la sidebar o... lo que se quiera....
Madre mía... ya estoy cansada de sólo pensar en que me quedan tropecientas cosas por explicar...

[+/-] |
Bloggers versus Piratas |
.- Ahora media blogoesfera usa las "dropcap" de "Mandarín Design", popularizadas por Beautiful Beta y traídas desde su web por mí...
.- He visto blogs que no usaban la fecha en bloque de The Last Word hasta que traje el hack a mis blogs, porque... no conocían el hack o no sabían implementarlo, supongo.
.- He visto blogs que usan mi "truqui"- explicado e insertado en "Ayuda&Kaos", hace eones- sobre colocar un monigote o una imagen, al lado o en sustitución del nombre del autor de la entrada (afortunadamente, las entradas tienen fechas).
Y... casi que lo dejo...
Porque los propietarios de esos blogs no mencionan para nada, en sus explicaciones, ni a Mandarín, ni a Last Word, ni a Beautiful beta... menos aún a mí, je.
Porque no sson Bloggers: son PIRATAS.
Los Bloggers inventan, recrean, piensan, dan vueltas, diseñan, retuercen, acomodan, explican.... sus propios hallazgos y/o los de otros. DANDO SIEMPRE AL AUTOR DEL HACK LA MENCION DEL MISMO.
Es así como distingo, al menos yo, a los auténticos Bloggers de los mercenarios de la red. Así es como veo yo actuar a los verdaderos bloggers.
Y es que los hacks se explican, precisamente, para ayudar a la gente a insertarlos en sus blogs. Pero si se tiene un blog de explicación de hacks, lo que resulta fuera de toda ética es explicar el hack como si fuera propio y dejar al margen a su autor.
Estas actuaciones me indican una cosa muy clara: quien no es honrado en la red, no lo es en su vida personal... no se es de una manera aquí y de otra "ahí fuera".
Me he hartado de leer a bloggers DE VERDAD, quejándose de cuantos se les llevan los hacks para explicarlos como si los hubieran "inventado" ellos. Ahora entiendo que llevan razón en su queja: porque no fastidia el hecho, sino el tipo de persona que "anda suelta" cometiendo estos "latrocinios" para..... ¿PARA QUÉ?: pienso si podrá ser para ganar dinero con los "ofertones" de Google... o para adquirir notoriedad del tipo:
.- "Mira qué buen blogger y qué list@ soy, que codifico mis propios hacks" (casi que lo descarto: porque me parece de una inmadurez y estupidez supinas)
... o porque no se piensan lo suficientemente inteligentes (de todas formas, estos hechos ya demuestran escasa inteligencia: porque la red es grande... pero no tanto. Y siempre se les "descubre") como para merecer la aprobación de los visitantes con sus propios medios... por eso han de atribuirse los de otros.
En resumidas cuentas: después de ver mi hack de la carita (caray: para cuatro cosas que me he sacado de la chistera yo solita...), pomposamente lucido en un blog, supuestamente de hacks, que no menciona para nada mi autoría... definitivamente me tomo un descanso.
A ver si en un par de días, algún que otro pirata consigue algo de "seso" o, por lo menos, de ética... que también en la red hace falta.
A ver si, de paso que se me pasa el mosqueo, adelanto algo de mi novela "El Oculto", que la tengo abandonadita. Claro que... es@s "list@s" son capaces de copietearla y atribuirse la autoría, jjajajajajaaaa
Parece mentira: vengo de Grupos de MSN donde hay gente que no tiene "problemas" en copiar un texto y ponerse su nombre debajo... y aquí pasa lo mismo.
Está visto que no es la red: es que hay personas... y personas...
Por eso, me parece magnífica la idea de Alex4 y su Comunidad de Ayuda : al menos allí, la gente tiene la oportunidad de ver juntos todos los hacks y.... de descubrir quién se los lleva para explicarlos como propios.
Hum: en cuanto se me pase este mosqueo a causa del blog que he visto me ha "mangado" uno de mis hacks para apuntárselo como suyo..., creo que me apunto... y es que me gusta mucho la idea de esa Comunidad...

[+/-] |
Más cambios |
he colocado las etiquetas a las que he asignado cada entrada bajo el título de estas. Así no tengo que bajar toda la entrada para verlas.
.- He asignado iconos para cada función del blog (comentarios, etiquetas y elementos de la sidebar)
.- He insertado una imagen junto al nombre del autor del comentario-la misma sea quien sea quien comente-que aparece cuando se despliegan los comentarios a la entrada.
.- He insertado, en la sidebar, una relación de artículos de "Aire(bis)", de manera que me resulte más cómodo a la hora de buscar alguno en particular.
.- He añadido al "hover" de los vínculos una línea "dotted" punteada.
De momento, eso es todo... salvo explicar cómo he hecho para insertar en mi plantilla estos cambios (a menos que a alguien particular le interese saberlo, no lo voy a explicar, de momento... la primavera me tiene desganada )

[+/-] |
Tiempo estimado de lectura de la entrada |
Con este artículo comienzo a comentar algunos trucos válidos EXCLUSIVAMENTE para la plantilla clásica de Blogger.
En este caso, podemos visualizar, al lado del título de cada entrada, p.e., una estimación del tiempo que nos llevará leer esa entrada. Podéis ver cómo funciona en Pruebas. Y las instrucciones para conseguirlo las encontraréis en Caso Patológico, muy fáciles de seguir:
1º.- Abrid vuestra plantilla e insertad, antes del cierre / de la tag "head", lo siguiente:
<script type="text/javascript">
//<![CDATA[
function tlectura(idpost,idtlectura) {
// ult. version en http://adivina.blogspot.com
// nuevo codigo cortesia de http://displaynone.blogspot.com
var txt = document.getElementById(idpost).innerHTML;
var ppmin = 250;
if (txt){
// Borro todo aquello que esté contenido entre < y >
txt = txt.replace(/<(\/|\w|\s|\.|\{|\}|\(|\)|=|"|:|;|-|\?|\%|\n)*>/g, " ");
// Almaceno las coincidencias con palabras
var palabras = txt.match(/(\w|á|é|í|ó|ú|ü|ñ|Ñ|Á|É|Í|Ó|Ú)+[\s\n\r\t,\.;:"'\(\)\{\}\[\]$]*/g);
var palabrapost = 0;
if (palabras) {palabrapost = palabras.length;}
if (palabrapost <= 8) {
document.getElementById(idtlectura).innerHTML='<sp'+'an class="help" title="'+palabrapost+' palabras aprox.">'+"Tiempo lectura: Menos de 2 segundos"+'<'+'/sp'+'an>';
} else {
xminutos = parseInt(palabrapost/ppmin);
xsegundos = Math.round(60 * (palabrapost/ppmin - xminutos));
document.getElementById(idtlectura).innerHTML='<sp'+'an class="help" title="'+palabrapost+' palabras aprox.">'+"Tiempo lectura: "+((xminutos>0)?xminutos:"")+((xminutos>0)?((xminutos == 1)?" minuto ":" minutos "):"")+((xsegundos>0)?xsegundos:"")+((xsegundos>0)?((xsegundos == 1)?" segundo":" segundos"):"")+' <'+'/sp'+'an>';
}
}
}
//]]>
</script>
<style type="text/css">
.tlectura{float:right;font-size:90%;cursor:help;}
</style>
2º.- Insertad el siguiente código en la parte de la plantilla donde deseais ver el rtexto "tiempo estimado de lectura...", generalmente cerca del título de la entrada, en cuyo caso, debeis colocarlo inmediatamente detrás de la tag </BlogItemTitle> :
<span class="tlectura" id="elposttlec<$BlogItemNumber$>"></span>
3º.- Buscad el texto <$BlogItemBody$> y sustituidlo por:
<div id="j<$BlogItemNumber$>"><$BlogItemBody$></div>
4º.- Copiar este código, antes de la etiqueta </Blogger> :
<script type="text/javascript">tlectura("j<$BlogItemNumber$>","elposttlec<$BlogItemNumber$>");</script>
Guardad y listos.
Se puede cambiar el texto "Tiempo de lectura aprox..."; también el CSS del mismo, así como el "var ppm=250" al número que tú veas de palabras por minuto.
Creo que se puede conseguir también en las nuevas plantillas, pero... para eso tengo que probarlo primero. Ya veré...

[+/-] |
Desplegar los "backlinks" a las entradas |
primero una aclaración:
"Backlink" significa, en español, "vínculo de retroceso". Es decir: eso que conocemos por "blogs que nos linkean"... o algo así, je.
Podéis ver el hack en marcha en la sidebar: entre los "Comentarios Haloscan" y los "Links-Hacks" (lo he marcado con un icono de interrogación, antes de su título: "Links a "Aire(bis)).
Y es faciñisimo de colocar en la plantilla, siguiendo las instrucciones de "Recursive backlinks" que nos muestra Freshblog:
1º.- Abrid vuestra plantilla e insertad, antes del cierre / de la tag "head", lo siguiente:
<ItemPage><script type="text/javascript" src="http://ghill.customer.netspace.net.au/backlinker/backlinker.js">
</script></ItemPage>
Guardad la plantilla.
2º.- Añadid un Elemento de página HTML-Java- o incluid directamente en la sidebar en la plantilla-... (o añadid al final de "Entradas del Blog" de vuestra plantilla, para que se desplieguen los links bajo cada entrada... eso sí: NO SE VERA EN LA PAGINA PRINCIPAL ni de ARCHIVO... sólo en las "item") la siguiente pieza:
<ItemPage><h2 class="sidebar-title">Posts That Link Here</h2>
<div id="backlinks">
No backlinks found.
</div>
<script type="text/javascript">
backlinker();
</script></ItemPage>
Listos. Ya tenéis desplegados los links a vuestras entradas, donde queráis verlos.
Como yo he hecho, podéis cambiar el "lenguaje" del script.
También podéis cambiar la apariencia... colocando otros iconos "clickables", en lugar de la rayita ondulada que abre las entradas que nos han linkaeado, al picar en ella. Si queréis modificar el hack, picad
AQUI y "guardar como"- Es el contenido del script.

[+/-] |
Drop-Traductor (Google) |
esto es otra cosa ... ya no traduce tan al "swahili". Podéis probarlo en la cima de la sidebar, picando en el idioma al que queréis traducir la página.
Este es el código:
1º.- Id a Diseño de Plantilla y Añadid un Elemento de Página HTML-jAVA, con este contenido:
<FORM NAME="nav" width="100%">
<DIV>
<SELECT NAME="SelectURL"onChange="document.location.
href=document.nav.SelectURL.options
[document.nav.SelectURL.selectedIndex].value">
<OPTION VALUE="http://google.com/translate?langpair=en%7Cen&u=websiteurl"
SELECTED>Translate this website
<OPTION VALUE="http://google.com/translate?langpair=en%7Ces&u=websiteurl">
Spanish
<OPTION VALUE="http://google.com/translate?langpair=en%7Cit&u=websiteurl">
Italian
<OPTION VALUE="http://google.com/translate?langpair=en%7Cfr&u=websiteurl">
French
<OPTION VALUE="http://google.com/translate?langpair=en%7Cpt&u=websiteurl">
Portuguese
<OPTION VALUE="http://google.com/translate?langpair=en%7Car&u=websiteurl">
Arabic
<OPTION VALUE="http://google.com/translate?langpair=en%7Cja&u=websiteurl">
Japanese
<OPTION VALUE="http://google.com/translate?langpair=en%7Cko&u=websiteurl">
Korean
</SELECT>
<DIV>
</FORM>
Tenéis que cambiar la referencia src=WEBSITEURL", por la URL de vuestra página. Y cambiad el idioma de origen, para que el traductor lo tenga en cuenta a la hora de pasar a otro idioma la página; para ello, debéis cambiar el "LANGPAIR= ", de manera que si la página está escrita en español, la primera parte del "par", será "es".
Por ejemplo, así es como he modificado yo el código, para que me traduzca la página del español a otros idiomas:
<form width="100%" name="nav">
<div>
<select onchange="document.location.
href=document.nav.SelectURL.options
[document.nav.SelectURL.selectedIndex].value" name="SelectURL">
<option
selected value="http://google.com/translate?langpair=en%7Cen&u=http://masairebis.blogspot.com"/>Traducir este sitio:
<option value="http://google.com/translate?langpair=es%7Cen&u=http://masairebis.blogspot.com"/>
English
<option value="http://google.com/translate?langpair=en%7Cit&u=http://masairebis.blogspot.com"/>
Italian
<option value="http://google.com/translate?langpair=en%7Cfr&u=http://masairebis.blogspot.com"/>
French
<option value="http://google.com/translate?langpair=en%7Cpt&u=http://masairebis.blogspot.com"/>
Portuguese
<option value="http://google.com/translate?langpair=en%7Car&u=http://masairebis.blogspot.com"/>
Arabic
<option value="http://google.com/translate?langpair=en%7Cja&u=http://masairebis.blogspot.com"/>
Japanese
<option value="http://google.com/translate?langpair=en%7Cko&u=http://masairebis.blogspot.com"/>
Korean
</select>
<div>
</div></div></form>
Como podéis notar, hay traducción del español al inglés en la primera línea. El resto de las líneas traducen del inglés a otros idiomas (italiano, francés, etc...). En fín... no sale mal... aunque no sea directamente del español. Menos da una piedra...

Podéis mirar cómo configurar los "pares" en: e-Buletine

[+/-] |
Sobre los Comentarios de Blogger |
lo siento en el alma por quien no guste de ver el número de comentarios sobre el título de la entrada. Pero... a mí no sólo me gusta, sino que me sirve de referencia, mucho más que teniendo que bajar toda la entrada para verlos. De forma que... vuelvo a mi idea
Eso sí: para los más clásicos , dejo también la cuenta de comentarios en el pie de la entrada. Así, todo el mundo contento

[+/-] |
Aclaración a Comentarios Haloscan |
se me olvidaba aclarar que ahora hay en el blog dos posibilidades para comentar: la de Haloscan-trackback y la de toda la vida de Blogger. Usad la que os parezca más cómoda (si es vais a usar alguna, jajjajajaaa!! ). En la mayoría de los blogs que tienen insertado el trackback de comentarios, han sustituído por éste el de blogger... con la desventaja de tener que hacerlos "visibles-fuera de la ventana de Haloscan- a mano... y para mí... como que es mucho trabajo... y a lo tonto. Así que he preferido conservar, junto al Haloscan, los comentarios de blogger.

[+/-] |
Asynchronous Peek-A-Boo Comments |
de Singpolyma... que he conseguido hacer funcionar en mi vetusto navegador IE. De esta manera:
1º.- Id a Edición de plantilla y expandidla:
Insertad, antes del cierre /head, el siguiente script:
<script type="text/javascript">
//<![CDATA[
var comment_form_template = '<div class="commentelem"><div class="comment-poster">[[AUTHOR]]</div>\n'
+ '<div class="comment-body"><div class="innerCmntBody">[[BODY]]</div></div>\n'
+ '<div class="comment-timestamp"><a href="[[PERMALINK]]" title="comment permalink">[[DATE]]</a></div></div>\n';
if(typeof(thisblog_showCommentPhotos) == 'undefined')
thisblog_showCommentPhotos = false;
//]]>
</script>
<script src='http://jscripts.ning.com/get.php?xn_auth=no&amp;id=2941927' type='text/javascript'></script>
2º.- Bajad la plantilla hasta la tag <b:includable id='comments' var='post'>
<div class='comments' id='comments'>
y sustituid esta última línea (div) or lo siguiente:
<div class='comments' expr:id='"comments" + data:post.id'>
<b:if cond='data:blog.pageType != "item"'>
<div expr:id='"commentsul" + data:post.id'> </div>
<script type='text/javascript'>
document.getElementById('comments<data:post.id/>').style.display = 'none';
</script>
</b:if>
3º.- Encontrad esta sección: <b:includable id='main' var='top'>
<!-- posts -->
y, dentro de ella, localizad algo parecido a ésto:
<b:if cond='data:blog.pageType == "item"'>
<b:if cond='data:post.allowComments'>
<b:include data='post' name='comments'/>
</b:if></b:if>
Reemplazad toda esta condicional (de b:if a /b:if) por esta otra:
<b:if cond='data:post.allowComments'>
<b:include data='post' name='comments'/>
</b:if>
4º.- La sección de las entradas de la plantilla, comienza con algo así: <b:includable id='post' var='post'>
Encontrad, dentro de esta tag, la siguiente condicional:
<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
</b:if>
Y reemplazadla entera (de apertura b:if a cierre /b_if), por la siguiente:
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:post.allowComments'>
<b:loop values='data:post.feedLinks' var='f'>
<a class="comments" rel="comments" expr:href='data:post.url + "#comments"' expr:onclick='"peekaboo_comments_display(&quot;" + data:f.url + "&quot;,&quot;commentsul" + data:post.id + "&quot;,thisblog_showCommentPhotos);toggleitem(&quot;comments" + data:post.id + "&quot;);return false;"'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
</b:loop>
</b:if>
<b:else/>
<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.url + "#comments"' expr:onclick='"toggleitem(&quot;comments" + data:post.id + "&quot;);return false;"'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
</b:if>
</b:if>
Ya está... si queréis, cambiad la parte de los códigos que necesitéis para acomodar el plural y singular de los comentarios (mirad en Ayuda&Kaos) y ¡OJO!: antes de realizar este hack, casi mejor que dejáis una copia de vuestra plantilla a buen recaudo... por si las moscas

----------------------
Pd: se me olvidaba recordaros que, con este "sistema", se despliegan los comentarios haciendo "click" en el número de comentarios, bajo la entrada. No hace falta subir para picar en el título (aunque también se puede, claro... pero eso... es de lo más habitual


[+/-] |
Trackback y Comentarios Haloscan (fórmula más sencilla) |
con este sistema, se despliegan los comentarios Haloscan en su CORRESPONDIENTE ENTRADA, y no en todas, como venía haciendo en "Aire". Y la fórmula para insertar el hack es más qe sencilla:
1º.- Para variar, insertar, antes del cierre /Head de la plantilla-extendida- el script de llamada a Haloscan: <script src='http://www.haloscan.com/load/TUNOMBREDEUSUARIO/' type='text/javascript'/>
2º.- Estas piezas de código, van juntas: el trackback-autodiscovery-ping automático y los comentarios-contador Haloscan:
<script src='http://www.haloscan.com/load/TUNOMBREDEUSUARIO' type='text/javascript'> </script>
<a expr:href='"javascript:HaloScan(" + "\"" + data:post.id + "\"" + ");"' target='_self'>
<script type='text/javascript'>postCount('<data:post.id/>');</script>
</a>
<a alt='Trackback' class='trackback-link' href='http://www.haloscan.com/tb/TUNOMBREDEUSUARIO/data:post.id' onclick='HaloScanTB("data:post.id/"); return false;' target='_self'><script type='text/javascript'>postCountTB('data:post.id/'); </script><noscript>|Trackback|</noscript></a>
<!-- Trackback Auto-discovery RDF Code
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/">
<rdf:Description
rdf:about="data:post.url"
dc:identifier="data:post.url"
dc:title="b:if cond='data:post.title'"
trackback:ping="http://haloscan.com/tb/TUNOMBREDEUSUARIO/<data:post.id/>" />
</rdf:RDF>
-->
Y ésto es todo...

Bueno: queda por saber dónde insertar estas piezas: pues muy fácil... allí donde se despliegan los comentarios, en vuestra plantilla. Es decir:
a).- detrás de
<a name='comments'/>
<b:if cond='data:post.allowComments'>
</b:if>
<h4>
b)Detrás de
<span class='post-comment-link'>
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:post.allowComments'>
<b:loop values='data:post.feedLinks' var='f'>
Son las tags de la entrada donde se despliegan vuestros comentarios: aquéllas donde ordenáis y configuráis el resultado de los comentarios: "0", "1" "plural"... "comentarios", tras el "allow comments".
¡OJO!: Si alguien va a insertar o tiene ya insertado el PeeK-A-Boo de Comentarios de Singpolyma, tenéis que poner estos códigos (EN ESTA ULTIMA TAG DEL SPAN DE COMENTARIOS), DETRAS DEL PRIMER CIERRE B:LOOP. En otro caso, no sólo no funcionará, sino que también os dará un error en vuestra página.
Y, para conseguir este hack, han entrado en juego las normas generales sobre el trackback de "A Consuming Experience" (tenéis la URL en mi entrada de "Trackback Conseguido!!! (me da pereza poner tantas url



[+/-] |
Feed Comentarios Haloscan |
si queréis un RSS para vuestros comentarios Haloscan, encontrad en vuestra plantilla extendida la siguinte tag: <p class='comment-footer'>
Un poco más abajo, encontraréis la referencia a los Feed:
<b:includable id='feedLinksBody' var='links'>
<div class='feed-links'>
Subscribe to:
<b:loop values='data:links' var='f'>
Inmediatamente detrás de esta última línea, pegad ésto:
<a class='feed-link' expr:href='data:f.url' expr:type='data:f.mimeType' target='_blank'><data:f.name/> (<data:f.feedType/>)</a>
(Y/O):
<a class='feed-link' href='http://www.haloscan.com/members/rss.php?user=TUINOMBREDEUSUARIO' target='_blank'>Comentarios Haloscan: Feed (RSS)</a>
Y ya está: guardad los cambios y mirad el final de vuesrtas entradas, tras los comentarios.

[+/-] |
Trackback CONSEGUIDO ("New Blogger") |
anda que no me ha costado trabajo... "interpretar la plantilla clásica y pasarla a la nueva.Uf... Ha sido lo más complicado que he hecho en mi vida de "blogger".
Y es que, para ahorrarme trabajos y problemas, probé el widget del que luego hablo y... un desastre. No vale para lo que se pretende del trackback. Y encima da un error como un campano en la plantilla.
Para empezar, la información de primera mano: Imprescindible la Tabla de Conversión de Blogger clásico a Nuevo Blogger, de Singpolyma; y el hack básico y clásico que hay que adaptar a la plantilla del nuevo Blogger, de A Consuming Experience.
Vamos al hack:
1º.- Lo primero es hacerse una cuenta en Haloscan. Sin eso, no hay trackback que valga. Procurad no olvidar vuestro nombre de usuario,porque lo vais a tener que utilizar como mil veces para diseñar el hack.
Una vez que tengáis la cuenta, se os mostrará un escritorio que podéis "arreglar" a vuestro gusto, donde se os mostrarán los comentarios que se vayan haciendo vía trackback en vuestro blog. Además, tenéis-a la derecha de la página-la posibilidad de usar un "widget" para mostrar los comentarios en la sidebar del blog: copiais el código que se muestra en un Elemento de Página HTML-Java, y ya está.
Una cosa: Que los acentos del español... como que no los entiende Haloscan, je... por cada acento pondrá un cuadradito y el texto parecerá swahili: así que tendremos "licencia" para cometer faltas de ortografía

2º.- En el escritorio de Haloscan tenéis la opción de "instalar": si picáis, os llevará a una página en la que se ofrecen todas las plataformas posibles: escogeis Nuevo Blogger y picáis en el cuadradito de "·mostrar código". Y aquí empiezan los problemas: porque, después de copiar vuestra plantilla y subirla a Haloscan para que inserte dentro el widget de comentarios... vuestro blog, probablemente, no leerá los cambios... y no guardará porque dará error.
Si tenéis la santa paciencia que yo tuve para revisar mi plantilla modificada por Haloscan e insertar a mano en la "original" los cambios... olvidadlo: porque sigue dando errores a la hora de ver el blog, entre otras pegas. Pero quien quiera probar... ahí lo tiene.
Así que, a la vista de lo visto, al final hice lo siguiente:
Adapar al Nuevo Blogger las instrucciones que "A consuming Experience" ofrece para la plantilla clásica:
1º.- Id a Edición de Plantilla y expandedla. Añadid el siguiente script antes del cierre /head:
<script src='http://www.haloscan.com/load/TUNOMBREDEUSUARIO/' type='text/javascript'/>
2º.- Bajad la plantilla hasta el widget "Entradas del Blog" y, bajo la tag <b:if cond='data:post.allowComments'> de la sección <b:includable id='comments' var='post'>
<div id='comments'>
<a name='comments'/> insertad lo siguiente:
<a alt='Trackback' class='trackback-link' href='http://www.haloscan.com/tb/TUNOMBREDEUSUARIO/data:post.id' onclick='HaloScanTB("data:post.id/"); return false;' target='_self'><script type='text/javascript'>postCountTB('data:post.id/'); </script><noscript>Trackback</noscript></a>
<!-- Trackback Auto-discovery RDF Code
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/">
<rdf:Description
rdf:about="data:post.url"
dc:identifier="data:post.url"
dc:title="b:if cond='data:post.title'"
trackback:ping="http://haloscan.com/tb/TUNOMBREDEUSUARIO/<data:post.id/>" />
</rdf:RDF>
-->
Esto permite los comentarios en Haloscan y el que se abra la ventanita correspondiente con el comentario... si lo hay, claro.
Y es que, desde ya, hay que decir una cosa: NO SE PUEDEN DESPLEGAR LOS COMENTARIOS DE HALOSCAN EN LA ENTRADA, como sucede en Blogger. Si los veis en alguna página, en la entrada, es porque se han copiado a mano, desde los comentarios Haloscan de la sidebar o desde la ventanita, como explican en "A Consuming Experience".
La segunda parte de ese código, es el "autodiscovery trackback", que puede ayudar a quien linkea vuestra entrada a hacer sobre ella "ping automático" (como no "suelo" tener links... pues me temo que me quedaré sin saber cómo cuernos funciona

¡OJO!: ESTE CÓDIGO HA DE INSERTARSE TAMBIÉN EN LA SECCIÓN DE COMENTARIOS QUE HAY MÁS ABAJO DE LA PLANTILLA. Exactamente aquí:
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
Así que, todo el código del paso primero lo dejé insertado, también, sobre esta pieza.
2º.- Insertar bajo la tag <b:loop values='data:posts' var='post'>
<b:if cond='data:post.allowComments'> lo siguiente:
<a alt='Comentarios' href='http://www.haloscan.com/comments/data:post.id//' onclick='HaloScan("data:post.id/"); return false;' target='_self'>*Comentar<script type='text/javascript'>postCount('data:post.id/');</script><noscript>Haloscan </noscript></a>
Esto es para ensamblar cada comentario con su entrada. Es decir: para que al abrir la ventana del comentario, sólo aparezca el que se haya hecho... no todos los del blog de todas las entradas.
3º.- Si queréis que los comentarios salgan en singular, plural y algún eufemismo para el "0", podéis insertar ésto
<a alt='Comentarios' href='http://www.haloscan.com/comments/TUNOMBREDEUSUARIO/data:post.id/' onclick='HaloScan("data:post.id/"); return false;' target='_self'> <script type='text/javascript'>postCount('data:post.id/');</script> Haloscan<noscript/></a>
antes de:
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'> |Pon aquí tu comentario</a>
<b:if cond='data:post.numComments == 0'>
sin comentarios
<b:else/>
<b:if cond='data:post.numComments == 1'>
1 comentario
<b:else/>
<data:post.numComments/> comentarios
</b:if>
</b:if>
................
4º.- "Forret Link Trackback": Hará que se desplieguen bajo vuestras entradas, los links que se les hagan, así:
<a href='http://www.forret.com/tools/trackback.asp?title=data:post.title/blog_name=data:blog.title/url=data:post.url/'>Enviar Link</a>
Yo lo he colocado encima de la clase <span class='post-icons'>
<!-- email post links -->
Y ya está... se puede hacer alguna cosa más, como "esconder" los links: que sólo sean visibles para el editor del blog... pero yo ya no me meto en más berenjenales...
Como siempre, si hay alguna cosa, lo mejor es ir a la fuente. Y revisar la conversión de las tags clásicas al nuevo blogger.
Es el hack más difícil que he hecho en... jamás...

[+/-] |
Comentarios en la cabecera de la entrada |
e
s el "arreglo"· que acabo de hacer... no por "rizar el rizo", sino porque, muchas veces, me pregunto dónde y cuál será aquélla entrada en la que tengo algún comentario (como sólo me escribo yo y alguna persona maja
Así que, andando. El número de comentarios arriba.
Lo único que he hecho (ya sé que podría hacer más: como insertar ahí también el link para desplegar el comentario, pero... ciertas cosas no funcionan en mi navegador

<b:includable id='main' var='top'>
<!-- posts -->
<div class='blog-posts'>
<b:include data='top' name='status-message'/>
<b:loop values='data:posts' var='post'>
<b:include data='post' name='breadcrumbs'/>
<b:if cond='data:post.dateHeader'>
<div id='post-date'> <script>date_replace('<data:post.dateHeader/>');</script> </div>
</b:if>
<span class='post-labels'>
<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
<b:if cond='data:label.isLast != "true"'>,</b:if>
</b:loop>
</b:if>
</span>
<span class='post-comment-link'>
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'> |Pon aquí tu comentario</a>
<b:if cond='data:post.numComments == 0'>
sin comentarios
<b:else/>
<b:if cond='data:post.numComments == 1'>
1 comentario
<b:else/>
<data:post.numComments/> comentarios
</b:if>
</b:if>
</b:if>
</b:if>
</span>
Es decir;: he sacado el "span-link" de su localización original en el "postl-line-footer-1" y lo he trasladado tras el "date header" de mi plantilla.
Y ¡OJO!: el ejemplo de lo que he hecho en mi plantilla es sólo eso: MI ejemplo. Porque yo tengo-como se ve- insertadas las "breadcrumbs" y la etiquetas en la cabecera. Así que no se despiste nadie y vaya a copiar este código... y acabe cponiendo las etiquetas donde no quiere, p.e. Si lo hace, que tenga en cuenta ésto que comento, please.

[+/-] |
"PopMarks" |
ya hablé de ello en Ayuda&Kaos-dentro de la etiqueta "Marcadores"- pero, en esa ocasión no dije nada del código que utilicé para insertarlo (a saber por qué ).
Voy a remediarlo. Pero antes, recordar que el Pop Mark es un botoncito que contiene todos los marcadores sociales habidos y por haber: para quien quiera tenerlos todos, pero no le apetezca alargar dos kilómetros el pie de sus entradas con tanto icono y tanta historia. Con este sistema, tiene todos los marcadores en un sólo botón; es decir: no se ocupa nada de espacio.
Es ese botoncito azul que tengo tras los "Hotlinks" del pie de mis entradas. Basta con que piquéis en él y esperad unos segundos: al cabo se despliega una tabla con... yo qué sé cuantísimos marcadores, con sus respectivos iconos y sus tooltips (así se sabe qué marcador estamos picando).
Y, en su día, yo lo hice así (y no he cambiado ahora los códigos que utilicé entonces):
1º.- Id a Edición de plantilla y añadid, antes del cierre /head, el siguiente script:
<script type='text/javascript'>
// set PopMarks parameters
popAnchor = 'popmarks+set3';
</script>
<script src=' http://ghill.customer.netspace.net.au/popmarks/popmarks-v02.js' type='text/javascript'>
</script>
2º.- Insertad al final de la sección del pie de vuestras entradas, donde tengáis los restantes marcadores, generalmente al final de la entrada (por lo general, aquí: <p class='post-footer-line post-footer-line-2'>)la llamada al script anterior:
<script type='text/javascript'>
makeMark('', '', '', '');
</script>
Comprobad el resultado en "Vista Previa" y guardad.
Si queréis cambiar el tipo de botón o el color... entonces no tenéis otra que acudir a la página de Social Bookmark Button y complicaros la existencia


[+/-] |
Noticias (Ajax-Google) |
lo prometido es deuda. Así que voy a explicar cómo se hace para tener noticias o cualquier resultado de búsqueda del tema que se desee (ciencia, libros, películas, vídeos, blogs, medicina, arte, etc...).
Primero he de decir que probé el hack "Adding Google TextSearch Utility with custonm tab results" de Hoctro`s Place... y no salió del todo bien: porque no se visualizaban los iconos de los resultados. Sólo los textos. Y, claro, a mi juicio el hack pierde mucho sin ellos.
De manera que volví, para variar, a lo ya conocido: al hack que ya tenía probado en otros blogs y me había resultado estupendamente: "Ajax Hack: "Hello" Google`s Ajax API Search!", también de Hoctro´s
Es muy sencillo de insertar:
1º.- Tenéis que conseguir una clave "key" API de Google. Para eso tenéis que tener una cuenta de Google, lo primero. Si no la tenéis, hay que hacerla. De todas formas, en la página donde podéis conseguir la API-Key ya os pedirán vuestra dirección y contraseña u os requerirán para que hagáis la cuenta.
2º.- Id a Diseño de Plantilla, "Añadir un Elemento de Página HTML-Java", donde queráis ver el hack (en todo caso, siempre es fácil cambiarlo de sitio, si no nos gusta el que hemos elegido en principio). Colocad un título con el que tema que deseáis, p.e. "Noticias", el que yo he colocado. Incluid algo de contenido (sobre lo que va a versar vuestra búsqueda, vuestro tema) p.e. "Diario El Mundo", en mi caso.
Ya está: guardad el nuevo elemento.
3º.- Id a Edición de plantilla y expandidla.
Insertad antes del cierre /head lo siguiente:
<link href='http://www.google.com/uds/css/gsearch.css' rel='stylesheet' type='text/css'/>
4º.- Bajad la plantilla y buscad el widget que creasteis con el nombre "Noticias" o el que tengáis puesto. Y reemplazarlo por ésto, CUIDANDO DE CAMBIAR LA "KEY-API" QUE APARECEN EL CÓDIGO POR LA VUESTRA:
<b:widget id='HTML1' locked='false' title='New York, NY' type='HTML'>
<b:includable id='main'>
<div id='searchcontrol'>Loading .....</div>
<script src='http://www.google.com/uds/api?file=uds.js&v=1.0&key=ABQIAAAA3JLs6Hnniw7MynpQ' type='text/javascript'/>
<script type='text/javascript'>
var local="<data:title/>";
var initSearch="<data:content/>";
// Create a search control
var searchControl = new GSearchControl();
// Add in a full set of searchers
var localSearch = new GlocalSearch();
searchControl.addSearcher(localSearch);
searchControl.addSearcher(new GwebSearch());
searchControl.addSearcher(new GvideoSearch());
searchControl.addSearcher(new GblogSearch());
searchControl.addSearcher(new GnewsSearch());
// Set the Local Search center point
localSearch.setCenterPoint(local);
// tell the searcher to draw itself and tell it where to attach
searchControl.draw(document.getElementById("searchcontrol"));
// execute an inital search
searchControl.execute(initSearch);
</script>
</b:includable>
</b:widget>
(Y, claro... el "title" será el vuestro, no el del hack de Hoctro's

Guardad los cambios y listos: ya tenéis vuestras noticias... o lo que sea.)
¡OJO!: que al mirar en "Vista Previa" el resultado, no veréis ni torta, porque no saldrá el hack del "loading". Y, además se abrirá esa ventana de !"Vista Previa" con un "error en la página" y un aviso de que "no es válida la API".
Ni caso: si habéis reemplazado las API del hack por las vuestras, no hay problema, por mucho que os salga el aviso, que SIEMPRE sale desde esa ventana y, a veces, en Diseño de Plantilla. En una lata, pero el hack funciona bien, y en la página se ve estupendamente y sin ningún tipo de error.
Para cambiar el tema de la búsqueda y que os quede en el blog hasta que volváis a cambiarlo, modificadlo en el Elemento de Página, no en la edición de plantilla.
Si sólo queréis buscar cosas sin que "permanezcan" en la pantalla del blog, vale con la búsqueda directa en la barra-search de Google.
Da gusto poder estar informado en línea...


[+/-] |
Noticias |
usando el "mapa" y la barra de búsqueda de Google. Es el último elemento añadido a la sidebar izquierda.
Y mañana lo cuento...porque he tenido que darle doscientas vueltas al hack original... que no salía. Ahora, sí.
Lo dicho: mañana lo explico.

[+/-] |
¡Fondos "a gogó"! |
si no corto ahora mismo... hoy no duermo, jajajajaa.
Y es que he encontrado-y mirado, admirado, probado y cambiado mil veces-dos páginas de fondos: una de ellas más, si se quiere, "ingénua" y otra más "seria":
La primera es Background City y tiene unos fondos de panelado de madera muy guapos... y hasta fondos para páginas infantiles.
La segunda es Absolute background textures Archive y tiene ¡miles! de fondos, que se pueden elegir por color, textura, borde... (en la sidebar de la página) o... podéis probar a diseñar vuestro propio fondo.
En cuanto a la primera página, sólo tenéis que elegir un tema de los que se os muestran y picar en el tema que os guste... click con el botón derecho del ratón y "guardar como".
Respecto a la segunda página, picáis en un color, p.e., y se os muestran cientos de fondos en los que predomina ese color (también hay una miscelánea... preciosísima). Picáis en el fondo que os gusta, y os lleva a una página en la que aparece(a la izquierda... no hagáis caso de lo demás)vuestro fondo y un botón encima que pregunta si añadís el fondo: pulsad y el bótón cambiará a "Añadido". Entonces, clickad con el botón derecho del ratón sobre la imagen y en "guardar como".
Luego... no tenéis más que ir a Edición de entrada, insertar imagen, examinar y escoger el fondo que habéis guardado, subirlo a vuestra entrada y copiar la URL (src=http://... gif.) e insertarla en la parte de vuestra plantilla que deseéis mostrar con ese fondo.
Por regla general, no suelo usar un backgroun "completo": suelo usarlos para iluminar una sidebar, o la widebar el "main"... pero no todo a la vez, generalmente.
Si queréis insertar el fondo en todo el blog, añadir la URL a la definción body, así:
body {
background:url(http://... gif);
-------
-------
No olvidéis el punto y coma detrás del paréntesis o no se verá en absoluto el fondo.
Y... alguien tiene que verlo: el fondo tan guapísimo que he puesto en Mi blog de pruebas... igual marea un poco, pero... es que me ha gustado mucho, je
Y algo más discreto o suave, con flores, en Nueva Plantilla
Es que me chifla este tema de los fondos...
Y voy a ver si pongo las noticias del diario en el blog, que últimamente no me da tiempo ni a leer el periódico... al menos las dejo a mano... y mañana explico cómo se hace.

[+/-] |
Imagen pop-up con ventana |
ppdéis ver cómo funciona en la sidebar izquierda-al final-, picando donde dice "con pala y todo": saldrá una ventana con un muñeco dentro.
Y se hace así:
1º.- Insertar ésto dentro de la tag head de la plantilla (yo lo he puesto en un Elemento de página HTML-jAVA):
<script type="text/javascript">
// JK Pop up image viewer script- By JavaScriptKit.com
// Visit JavaScript Kit (http://javascriptkit.com)
// for free JavaScript tutorials and scripts
// This notice must stay intact for use
var popbackground="lightskyblue" //specify backcolor or background image for pop window
var windowtitle="Image Window" //pop window title
function detectexist(obj){
return (typeof obj !="undefined")
}
function jkpopimage(imgpath, popwidth, popheight, textdescription){
function getpos(){
leftpos=(detectexist(window.screenLeft))? screenLeft+document.body.clientWidth/2-popwidth/2 : detectexist(window.screenX)? screenX+innerWidth/2-popwidth/2 : 0
toppos=(detectexist(window.screenTop))? screenTop+document.body.clientHeight/2-popheight/2 : detectexist(window.screenY)? screenY+innerHeight/2-popheight/2 : 0
if (window.opera){
leftpos-=screenLeft
toppos-=screenTop
}
}
getpos()
var winattributes='width='+popwidth+',height='+popheight+',resizable=yes,left='+leftpos+',top='+toppos
var bodyattribute=(popbackground.indexOf(".")!=-1)? 'background="'+popbackground+'"' : 'bgcolor="'+popbackground+'"'
if (typeof jkpopwin=="undefined" || jkpopwin.closed)
jkpopwin=window.open("","",winattributes)
else{
//getpos() //uncomment these 2 lines if you wish subsequent popups to be centered too
//jkpopwin.moveTo(leftpos, toppos)
jkpopwin.resizeTo(popwidth, popheight+30)
}
jkpopwin.document.open()
jkpopwin.document.write('<html><title>'+windowtitle+'</title><body '+bodyattribute+'><img src="'+imgpath+'" style="margin-bottom: 0.5em"><br>'+textdescription+'</body></html>')
jkpopwin.document.close()
jkpopwin.focus()
}
</script>
2º.- Y ésto dentro de la tag Body, donde queráis que aparezca la imagen en su ventana (que yo he puesto, a continuacíon del código anterior, en el Elemento de página):
<a href="#" onClick="jkpopimage('food1.jpg', 325, 445, 'Breakfast is served.'); return false">
Breakfast pancakes</a>
Insertad aquí la URL de la imagen y cambiad el texto de la imagen y el del link a vuestro gusto.
Vía: JavascriptKit
Nota: los números que van detrás de la URL (en el ej. "food1.jpg"), son el ancho y el alto, respectivamente, de la ventana pop-up: cambiadlos a vuestra conveniencia.

[+/-] |
Tres años... |
mientras, en estos días, se celebran las vistas judiciales por la matanza terrorista del 11-M, en las que sus ejecutores niegan su extremismo religioso y político, y cualquier participación, aún frente a las pruebas de ADN que les señalan e inculpan, mi país-nuestro país-sale a la calle para recordar a tantas familias destrozadas, que no están solas en su dolor. Para recordar que la violencia sólo engendra rencor, y que de éste nacen la venganza y nuevas ciolencias.
Para recordar que NADIE puede privar a NADIE de su más sagrado derecho: EL DERECHO A LA VIDA.
Para recordar que ninguna idea, política o religiosa, es superior a nuestro derecho a VIVIR.
Once metros contra el olvido.
En la estación del metro de Madrid, se ha elevado, bajo una enorme cúpula, un recordatorio a las víctimas del atentado: ayer fue inaugurado, entre flores, memoria, lágrimas e impotencia.
Que jamás el Mundo olvide lo que aquí sucedió... lo que-por desgrtacia- sucede cada día en todo el Orbe: porque quien olvida la Historia, está condenado a repetirla.

[+/-] |
Recoger...soltar... |
imágenes, textos, y lo que a uno se le ocurra (los títulos de las entradas, p.e... lo que imagine cualquiera).
¿Qué significa ésto?. Pues echad una mirada a mi blog de Pruebas y moved las imágenes y el texto de la cabecera por donde os parezca, porque... se pueden mover , gracias a unas piezas de código:
1º.- CSS, a insertar antes del cierre /skin
<style>
<!--
.drag{position:relative;cursor:hand}
-->
</style>
<script language="JavaScript1.2">
<!--
/*Credit JavaScript Kit www.javascriptkit.com*/
var dragapproved=false
var z,x,y
function move(){
if (event.button==1&&dragapproved){
z.style.pixelLeft=temp1+event.clientX-x
z.style.pixelTop=temp2+event.clientY-y
return false
}
}
function drags(){
if (!document.all)
return
if (event.srcElement.className=="drag"){
dragapproved=true
z=event.srcElement
temp1=z.style.pixelLeft
temp2=z.style.pixelTop
x=event.clientX
y=event.clientY
document.onmousemove=move
}
}
document.onmousedown=drags
document.onmouseup=new Function("dragapproved=false")
//-->
</script>
2º.- HTML, pues... donde queráis mostrar el efecto. Pero dentro de la sección Body, claro
<img src="test.gif" class="drag"><br>
<img src="test2.gif" class="drag"><br>
<h1><b class="drag">"Hi there</b></h1>
Introducid la URL de la imagen y/o el texto que queráis, y listos.
Vía: JavascriptKit

[+/-] |
Post-It |
se ve en la cima del blog, al lado de las entradas, cada vez que la página se "refresca". Basta con darle a ""X Cerrar" para que no vuelva a "molestar"... hasta el siguiente "refresco", je.
Y me parece muy útil... no ya para recordar a las visitas donde pueden encontrar cosas, sino para una mismo: hay cosas que hay que actualizar siempre a mano en un blog... y no siempre se acuerda una, la verdad.
Lo he encontrado en JavascriptKit, y consta de dos piezas de código, a insertar-la primera- dentro de la sección head (preferiblemente antes del cierre /skin; y, la segunda, en la cima de la página, es decir: en lo más alto de la sección Body.
Y, para variar, he omitido estas instrucciones para tener mayor control sobre la posición del objeto: así que he unido ambas piezas de código en un Elemento de Diseño HTML-Java sobre las "Entradas del Blog". Y, francamente, queda mejor (a mi juicio).
Bien. Vamos a los códigos:
1º.- CSS:
<style>
<!--
/*Post-it note script- by javascriptkit.com
Visit JavaScript Kit (http://javascriptkit.com) for script
Credit must stay intact for use*/
#postit{
position:absolute;
width:250;
padding:5px;
background-color:lightyellow;
border:1px solid black;
visibility:hidden;
z-index:100;
cursor:hand;
}
-->
</style>
2º.- HTML:
<div id="postit" style="left:150px;top:150px">
<div align="right"><b><a href="javascript:closeit()">[Close It]</a></b></div>
<!--INSERT YOUR CONTENT HERE-->
<b>Reminder:</b><br>
<p><font size="2" face="Arial"><a href="http://freewarejava.com" target="_new">Looking for
free Java applets?<br>
</a>Be sure to check out our sister site Freewarejava.com</font></p>
<p><font size="2" face="Arial"><a href="http://www.dynamicdrive.com" target="_new">Looking for
more scripts?<br>
</a>Visit our partner Dynamic Drive for free, original DHTML scripts and
components.</font></p>
<!--END YOUR CONTENT HERE-->
</div>
<script>
//Post-it only once per browser session? (0=no, 1=yes)
//Specifying 0 will cause postit to display every time page is loaded
var once_per_browser=0
///No need to edit beyond here///
var ns4=document.layers
var ie4=document.all
var ns6=document.getElementById&&!document.all
if (ns4)
crossobj=document.layers.postit
else if (ie4||ns6)
crossobj=ns6? document.getElementById("postit") : document.all.postit
function closeit(){
if (ie4||ns6)
crossobj.style.visibility="hidden"
else if (ns4)
crossobj.visibility="hide"
}
function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) { // if cookie exists
offset += search.length
// set index of beginning of value
end = document.cookie.indexOf(";", offset);
// set index of end of cookie value
if (end == -1)
end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}
function showornot(){
if (get_cookie('postdisplay')==''){
showit()
document.cookie="postdisplay=yes"
}
}
function showit(){
if (ie4||ns6)
crossobj.style.visibility="visible"
else if (ns4)
crossobj.visibility="show"
}
if (once_per_browser)
showornot()
else
showit()
</script>
<script language="JavaScript1.2">
//drag drop function for ie4+ and NS6////
/////////////////////////////////
function drag_drop(e){
if (ie4&&dragapproved){
crossobj.style.left=tempx+event.clientX-offsetx
crossobj.style.top=tempy+event.clientY-offsety
return false
}
else if (ns6&&dragapproved){
crossobj.style.left=tempx+e.clientX-offsetx
crossobj.style.top=tempy+e.clientY-offsety
return false
}
}
function initializedrag(e){
if (ie4&&event.srcElement.id=="postit"||ns6&&e.target.id=="postit"){
offsetx=ie4? event.clientX : e.clientX
offsety=ie4? event.clientY : e.clientY
tempx=parseInt(crossobj.style.left)
tempy=parseInt(crossobj.style.top)
dragapproved=true
document.onmousemove=drag_drop
}
}
document.onmousedown=initializedrag
document.onmouseup=new Function("dragapproved=false")
</script>
Cambiad, por supuesto, las URL y los textos. También podéis modificar a vuestro gusto el color, el padding, el ancho, el fondo de color... lo que queráis.

[+/-] |
Uf... Traductor Google... |
digo "uf" porque, entre que no me gusta, que le estoy pillando "manía" al Google (con eso de que me bloquea) y que... que... que yo qué sé... pues que me he estado resistiendo.
¡pero no encuentro ningún traductor que funcione bien en "directo!. O que traduzca la página entera sin pretender cobrarme por ello...
Así que... está bien: pues me rindo.
De forma que, nuevo traductor. De Google (arg). Si queréis instalarlo en el blog, colocad donde queráis este código (directamente en el lugar de la plantilla que queráis, o en una ventana de "Añadir Elemento-HTML-Java"):
<div class='widget-content'>
<center><form action="http://www.google.com/translate" target="_blank">
<script language="JavaScript">
<!--
document.write ("<input name=u value="+location.href+" type=hidden>") ;
// --></script>
<font color="#000000"><P ALIGN="center">Traducir el Blog a:</font></P> <br> <input value="+location.href+" name="u" type="hidden"/><input value="en" name="hl" type="hidden"/><input value="UTF8" name="ie" type="hidden"/><input value="" name="langpair" type="hidden"/><input onclick="this.form.langpair.value=this.value" title="Frances" value="en|fr" type="image" height="20" src="http://photos1.blogger.com/img/43/1633/320/13539949_e76af75976.jpg" width="30" name="langpair"/> <input onclick="this.form.langpair.value=this.value" title="Aleman" value="en|de" type="image" height="20" src="http://photos1.blogger.com/img/43/1633/320/13539933_041ca1eda2.jpg" width="30" name="langpair"/> <input onclick="this.form.langpair.value=this.value" title="Italiano" value="en|it" type="image" height="20" src="http://photos1.blogger.com/img/43/1633/320/13539953_0384ccecf9.jpg" width="30" name="langpair"/><br> <input onclick="this.form.langpair.value=this.value" title="Portugues" value="en|pt" type="image" height="20" src="http://photos1.blogger.com/img/43/1633/320/13539966_0d09b410b5.jpg" width="30" name="langpair"/> <input onclick="this.form.langpair.value=this.value" title="Ingles" value="es|en" type="image" height="20" src="http://www.connyriemers.com/english%20flag.gif" width="30" name="langpair"/> <input onclick="this.form.langpair.value=this.value" title="Japones" value="en|ja" type="image" height="20" src="http://photos1.blogger.com/img/43/1633/320/13539955_925e6683c8.jpg" width="30" name="langpair"/><br><input onclick="this.form.langpair.value=this.value" title="Koreano" value="en|ko" type="image" height="20" src="http://photos1.blogger.com/img/43/1633/320/13539958_3c3b482c95.jpg" width="30" name="langpair"/> <input onclick="this.form.langpair.value=this.value" title="Chino Simplificado" value="en|zh-CN" type="image" height="20" src="http://photos1.blogger.com/img/43/1633/320/14324441_5ca5ce3423.jpg" width="30" name="langpair"/> <input onclick="this.form.langpair.value=this.value" title="Arabe" value="en|ar" type="image" height="20" src="http://photos1.blogger.com/blogger/3709/485/1600/arabic-flag.gif" width="30" name="langpair2"/></form></center>
No sé por qué... me estaba acordando ahora de una viñeta de la Mafalda de Quino... mejor no lo cuento.


[+/-] |
Navegación con Ajax |
que no es el nombre de un estropajo, ni de ningún producto de limpieza, jjajaaa, sino uno de esos sistemas con que los codificadores nos hacen más simple la vida en la construcción de los blogs.
Lo primero que hay que decir, es que este sistema es absolutamente incompatible con otros sistemas de navegación, tipo Peek-A-Boo, barras de menú, etiquetas en Artículos o Categorías, Tablas de Contenidos, etc. De manera que si queréis usarlo HA DE SER A SOLAS.
Por ese motivo no lo he insertado en mis blogs de hacks: me gustan demasiado mis Artículos y demás como para renunciar a ellos. Pero sí lo he usado en mi blog de CUENTOS: Si entráis, podéis picar en cualquiera de las etiquetas de la sidebar... veréis un "loading" y, a continuación, se os desplegará, bajo la cabecera, las entradas con esa etiqueta, reseñadas por páginas, y con un resumen de cada una de ellas.
La verdad es que es muy práctico y bonito este sistema.
La idea original la podéis encontrar en Blogger Hacked, y su traducción al español, realizada por Leonel, en Trucos Blogger, así:
1º.- CSS-script: Id a Edición de Plantilla y expandedla: podéis colocarl este código antes del cierre / "head"
<style type='text/css'>
#indicator {
position:fixed;
z-index:1000;
padding:15px 0;
top:40%;
background-color:#FFFFFF;
border:1px solid #000000;
width:176px;
left:50%;
margin-left:-88px;
text-align:center;
}
#search-result {
border:1px solid #AAAAAA;
padding:10px;
padding-bottom:30px;
font-size:85%;
}
.search-result-meta {
background:#EFEFEF;
padding:2px;
}
.search-result-meta img {
border-width:0;
vertical-align:
text-bottom;
}
.search-title{
font-size:1em;
padding-bottom:3px;
font-weight:bold;
text-align:left;
text-decoration:underline;
}
.search-cat{
display:block;
padding:3px;
font-size:1em;
margin-top:5px;
margin-bottom:5px;
border-bottom:1px solid #C0C0C0;
font-weight:bold;
}
.search-close {
color:silver;
float:right;
border:1px solid #F5F5F5;
margin-top:10px;cursor:pointer;
}
.search-result-nav {
font-size:1.4em;
font-weight:bold;
padding:5px 0pt;
text-align:center;
}
</style>
<script src='http://bloggerhacked.googlepages.com/prototype.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
// Parametros Personalizables por el Usuario
// ----------------------------
// maxresults - Numero de resultado de mostrar por pagina
// navFlag - Poner Navegacion ON o OFF. Dar 1 para ON y 0 para OFF.
// feedLabel - Text to show for the label feed link.
// catLabel - Etiqueta para categorias.
// closeLabel - Etiqueta para boton Cerrar. Tu puedes usar hypertexto tambien.
var maxresults = 5;
var navFlag = 1; //ON por defecto
var feedLabel = "Suscribir a";
var catLabel = "Categoria:";
var closeLabel = "Click para cerrar";
//]]>
</script>
<script src='http://bloggerhacked.googlepages.com/ajaxlabels.js' type='text/javascript'/>
Yo modifiqué algo el CSS para diseñarlo a mi manera y que me quedara más "mono". Cada quien... ya sabe: a la suya

2º.- HTML:
Buscad esta tag: <b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
y sustituidla por ésta:
<b:loop values='data:post.labels' var='label'>
<a href='#sres' expr:onclick='"javascript:getCat(\"" + data:label.name + "\",null)"' rel='tag'><data:label.name/></a>
ITEM MAS:
Si ya tenéis un elemento ETIQUETAS en vuestra plantilla, además de lo anterior, habréis de "descubrir"- en vuestra plantilla extendida, probablemente en la sección de sidebar- ese widget (tendrá la ID "Label" y el "title" que le hayáis puesto). Ahí reemplazaréis esta condicional: <b:if cond='data:blog.url == data:label.url'>
<data:label.name/>
<b:else/>
<a href='data:label.url'><data:label.name/></a>
</b:if>
por ésta:
<b:if cond='data:blog.url == data:label.url'>
<data:label.name/>
<b:else/>
<a href='#sres' expr:onclick='"javascript:getCat(\"" + data:label.name + "\",null)"' ><data:label.name/></a>
</b:if>
4º.- mirad que no exista ningún "desastre" en "Vista Previa" y guardad la Plantilla. Ahora debéis añadir a vustro blog el "widget" que podéis picar en Trucos o en Blogger Hacked, donde queráis... se añadirá un elemento de página nuevo en vuestra sidebar, por defecto, y allí es dónde se os mostrará este sistema de navegación.
Ahora bien: personalmente, no me gusta nada que ese resumen de mis entradas por etiqueta se vea en la sidebar: no queda nada guapo.
Yo he preferido mostrarlo sobre las Entradas del Blog y, para ello, acudí a Edición de plantilla, la expandí y bajé hasta el widget y sección "Entradas del Blog". Allí añadí, tras el "id main" ésto:
maxiwidgets="2" showaddelement="yes";
de manera que queda así la sección:
<b:section class='main' id='main' maxiwidgets='2' showaddelement='yes'>
Ahora, si miráis el Diseño de vuestra plantilla, veréis que hay un "Añadir Elemento" sobre "Entradas del Blog". Ahí es dónde colocaréis el contenido HTML del widget "automático", de forma que el sistema de navegación se despliegue ahí.
Y creo que... nada más...
Para que las etiquetas no queden muy "sosas" podéis, p.e., colocar unas pestañas verticales, que quedan muy guapas, y que podéis elegir en Exploding Boy (¿A que son guapas?: yo tengo unas en este blog... con algún añadido) y aprender a insertarlas con Hoctro's Place o.. en Ayuda&Kaos, que ya lo tengo explicado, o en Trucos Blogger...
Dejar un Comentario