0

Iconos Navideños

En Girly Blogger he visto unos bonitos iconos navideños creados por Taizzar el pack consta de 15 iconos en formato .png y la descarga está disponible en archivo zip.




En la misma página de Girly Blogger encontraréis más iconos navideños que pueden ser muy útiles si estáis pensando en la decoración de blog.

Por cierto.... ¿saben ya lo del concurso?

0

DESKTOPOGRAPHY - Wallpapers



Visto en DESKTOPOGRAPHY

0

Limpiar la cache del navegador


Ultimamente estoy recibiendo consultas con problemas de todo tipo de errores en el panel de Blogger, uno de los más comunes es el problema para visualizar los cambios realizados en la plantilla mediante el uso de la "Vista previa".

He comprobado que en la mayoría de los casos este y otros problemas parecidos se solucionan limpiando la caché del navegador, así que voy a explicar como se hace en Firefox3 e IExplorer7 y Google Chrome, por ser estas las últimas versiones de estos navegadores.

No os preocupeis, el metodo para limpiar la caché suele ser parecido en todos los navegadores; si estás usando otra version u otro navegador, busca opciones similares a las que se muestran en esta entrada.

Una cache en general es una copia que hace un programa de datos y archivos que usa con frecuencia para tenerlos disponibles y leerlos de forma mas rapida cuando se necesitan. Pero a menudo, la cache se corrompe y el programa (en este caso el navegador) podría hacer cosas raras, como el tipo de fallos del que hablaba al principio. Cuando esto pasa la solución es siempre limpiar la cache.

  • Firefox
[1] Pinchamos en el menú del navegador en "Herramientas" y después en  "Limpiar datos privados" se abrirá una ventana como esta:


[2] Marcamos la opción "Caché" y pinchamos en "Limpiar datos privados ahora".

  • Internet Explorer
[1] Pinchamos en el menú del navegador en "Herramientas" y después en "Opciones de Internet" veremos entonces esta ventana:


[2] En la pestaña "General" pinchamos en el botón "Eliminar" del Historial de exploración.

  • Google Chrome
 [1] Pinchamos en la imagen de la llave inglesa (herramientas) en la parte superior derecha y en la ventana que se abre escogemos "Eliminar datos de navegación..."


[2] Marcamos la opción "Caché" y pinchamos en "Eliminar datos de navegación".

Como véis practicamente es igual para todos los navegadores mencionados y podemos aprovechar al mismo tiempo para limpiar las cookies, historial de navegación o búsquedas y demás archivos temporales al mismo tiempo.

0

Pizcos Blog y su concurso navideño

Hace unos ocho meses me comentaba la idea de crear un blog donde incluir los resultados de las pruebas que hacía, me mostraba un menú, al otro un diseño de plantilla, que si un efecto por aquí y mucha dosis de imaginación por allá.
Pensé que con tanta disponibilidad había que hacer algo y ese algo fue invitar a todos a conocer su blog.
Desde ese día suele llamarme madrina y me siento bien, porque le veo como pez en el agua son sus códigos y su inseparable Gimp cambiando de diseño día si y día también.
Hablo de Pizcos, y quien si no, podía tener la idea de hacer un concurso, dicho concurso trata sobre MEJOR DECORACION NAVIDEÑA DE BLOG.


El premio según sus palabras "No tengo nada mejor que ofrecer, para el ganador será un diseño a su gusto del blog" Si, Pizcos ya sé que no eres un Picasso pero diseñar una plantilla lleva su tiempo y el tiempo es oro, y como se suele decir y es cierto la intención es lo que cuenta.




Ha sido tan buena la acogida que todos hemos querido aportar nuestro granito de arena. Los premios hasta el momento son:

4 plantillas proporcionadas por:

*Xanarts.com
*Randomness
*BloggerSphera(en este caso para el primer blog ganador de lengua portuguesa)
*Pizcos Blog

6 banners publicitarios, durante un mes, en:

*Palomas de Papel
*Folk Tango
*Vagabundia
*The Best Music
*Mi Rincón Gastronómico
*Gem@ Blog

El plazo para apuntarse termina el 30 de Diciembre de 2008.
El jurado tendrá hasta el día 5 de Enero de 2009 para decidir los ganadores.
El 6 de Enero se publicara el ganador.

Los ganadores elegirán el premio que desean de los expuestos hasta el momento del cierre de inscripción. Esa elección será por orden de ganadores, es decir primero elegirá el primero, luego el segundo y así hasta otorgar todos los premios. Cada premio elegido no podrá ser seleccionado por otra persona.

Les animo a sumarse a esta iniciativa, el tema es navideño y la finalidad pasarlo bien.



0

Ava7 Patterns


Sí, ya sé me estoy repitiendo mucho últimamente sobre estos temas y creo que tendré que añadir una etiqueta nueva donde agrupar todas estas herramientas para diseño.
Hoy trata de Ava7 Patterns,una página que contiene nada más y nada menos que 600 Patterns lo que muchos conocemos por patrones o fondos.
¿Se imaginan la comodidad de ver el efecto con un click? pues lo pueden hacer en el botón PREVIEW.

Visto en Xyberneticos.

0

Consejos de Blogger

Me comenta S.O.S de una página donde podemos comprobar el tiempo de carga de nuestro blog, coincide que ayer al dar salida a una entrada Blogger mostraba este gráfico.


Acelera el rendimiento de tu blog "Consejos y trucos" así que allá voy dispuesta a recibir sabios consejos para mejorar el rendimiento de mi blog.
Uno de los consejos es en respuesta a ¿Cómo puedo hacer que mi blog cargue más rápido?
Recomienda Blogger que el número de entradas mostradas no sea superior a 10 indicando que podemos modificar esa parte en Opciones | Formato | personalmente pienso que 10 es una exageración a no ser que se trate de entradas reducidas o con el clásico sistema de expandir la entrada. Por otra parte está el tema estético creo que lo ideal es un número equiparado a la medida de la sidebar pero sobre gustos no hay nada escrito.

El siguiente consejo trata de los vídeos, imágenes o efectos multimedia y este es el consejo.
  • Disminuir el tamaño de las imágenes o hacer uso de miniaturas que enlacen con la imagen en tamaño completo.Si utiliza imágenes de terceros, considere la posibilidad de subir a los álbumes web de Picasa a través del editor de entradas de Blogger.
  • Si usted tiene un gran número de imágenes para mostrar, puede cargar todas las imágenes (de vacaciones o un evento) a un álbum web de Picasa y enlace con el álbum en su barra lateral o posterior.
En definitiva que las imágenes las alojemos en Blogger y ante la necesidad de mostrar varias imágenes nos ofrece la genial idea de alojarlas en un bonito álbum de Piacasa enlazando este desde nuestra sidebar. De esta forma con Picasa todo queda en casa (la rima no estaba prevista y no entra en el consejo)

Recomienda también que cualquier añadido que hagamos a la hoja de estilos (CSS) lo hagamos en la parte superior del blog. Podían decir que a partir de <head> y entre las etiquetas <style type='text/css'> y </script> pero no, con la parte superior es bastante.
Por último proporciona un enlace para poder medir el tiempo de carga de nuestro blog.
Se trata de NUMIÓN donde ingresando la url de nuestro blog interpreta el tiempo de carga incluyendo códigos HTML, imágenes y Javascript.

Lástima que los consejos de Blogger siempre lleguen tarde al igual que las soluciones. Pero ahí están, con el más vale tarde que nunca.


0

Concurso navideño en Pizcos Blog

Desde el blog de Pizcos nos llega una interesante propuesta para estas Navidades que se aproximan.
Un concurso a la mejor decoración navideña de blog y con un fantástico premio para el ganador, nada más y nada menos, que una plantilla "a la carta" para el blog diseñada por Pizcos.

Los que estéis interesados en participar no tenéis más que pasaros por su blog y apuntaros, allí además encontraréis información sobre los componentes del jurado y demás...

Si queréis difundir la idea de Pizcos para que el número de participantes sea mayor, podéis colocar el banner que ha hecho especialmente para la ocasión directamente desde la sidebar de Pizcos Blog.


Desde luego a mi me encanta la iniciativa y estaré siguiendo los blogs que se apunten para no perderme detalle de su decoración navideña.
Si necesitáis alguna idea podéis consultar alguna entrada en mi blog en "Especial Navidad" donde publicaré alguna cosilla más en los próximos días .


Actualización:

Ya hay otro premio que ofrecer, así que de momento habrá primero, segundo y tercer premio. Desde Xanarts.com, Pilar ofrece una plantilla para WordPress que incluye un banner de 468x60, un botón 88x31, una firma personalizada y el banner de la cabecera también personalizado.

Fernando de Randomness tambien ofrece una plantilla para Blogger o WordPress.

Por si hay alguna duda, el premio que Pizcos ofrece, es completo, es decir incluye diseño original, hacks y trucos que queráis implementar.

0

Como cambiar de plantilla

Esta entrada debería haberla publicado hace mucho tiempo, en realidad creo que debería haber sido una de las primeras del blog...
A menudo olvido que hay mucha gente que empieza con su blog y que, datos tan básicos como este, siguen siendo imprescindibles.
Ultimamente he recibido bastantes emails solicitando la explicación para hacer un cambio de plantilla y, aunque siempre devuelvo esos emails con la información solicitada,  he pensado que mejor incluirla en una entrada y que esté disponible para todos...

Instalar la plantilla desde nuestro PC 

Antes de empezar tendremos que haber descargado la nueva plantilla desde cualquier página donde las ofrecen para descargar, a nuestro PC. 


[1] Nos situamos en nuestro panel de Blogger en la parte de "Diseño" y pichamos en la opción de "Edición HTML".

[2] Antes de hacer nada más lo mejor será tener un respaldo de la plantilla actual por si algo saliese mal y necesitásemos recuperarla de nuevo.
Pinchamos en "Descargar plantilla completa" y una copia de la misma se descargará a nuestro PC.
Llegados a este punto, no estaría de más el copiar el código de cada uno de los Widgets (Gadget) en un editor de texto (el Blog de notas, por ejemplo) ya que se perderán con el cambio.
También podríamos esperar a tener cargada la nueva plantilla y hacer el cambio de plantilla manteniendo los Widgets; cualquiera de las dos formas de respaldo evitará su perdida.

[3] Pinchamos en "Examinar" y localizamos el archivo de la nueva plantilla que previamente hemos guardado en nuestro PC, en formato XML.

[4] Una vez localizado el archivo de la nueva plantilla, lo seleccionamos y pinchamos entonces en "Subir".
Blogger te mostrará el aviso de que estas eliminando artilugios, si ya los habíamos respaldado guardando su código, continuaremos con el proceso.
Si Blogger no marca ningún error, la nueva plantilla estará entonces instalada.




Instalar la plantilla de forma "copia y pega".

En algunas páginas se ofrece el código de la plantilla directamente para copiar en formato .txt.
Para sustituirla tendremos que marcar la opción "Expandir plantillas de artilugios" y seguir estos pasos:
  1. Seleccionar todo el código de la plantilla actual.
  2. Eliminarlo por completo.
  3. Colocar el nuevo código en su lugar.
  4. Hacer "Vista previa" para visionar la plantilla en el blog antes de guardar.
  5. Guardar la plantilla.

0

Imágenes en Blogger ¿tamaño original?

Muchos lo preguntan y todos lo queremos saber.
¿Hay forma de añadir imágenes en Blogger y que se muestren en su tamaño original?
La respuesta es SI pero cuidado, puedes añadir cualquier tamaño pero no superior al espacio de las entradas de tu blog.
En algunas plantillas la medida de las entradas viene reflejado de la siguiente forma:
El espacio que nuestra plantilla tiene para los post es el width que trae establecido en main.
Pongamos por ejemplo que tenemos una plantilla Minima modificada con la idea de añadir grandes fotografías en main-wrapper tiene de ancho 780 (width:780px;) subimos una imagen a una entrada y nos proporciona un código más o menos así:

<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://xxx/s1600-h/nombre.jpg"><img style="cursor: pointer; width: 400px; height: 320px;" src="http://xxx/s400/nombre.jpg" alt="" id="BLOGGER_PHOTO_ID_xxx00290" border="0" /></a>

Escogiendo el tamaño grande nos mostraría una imagen de 400px × 320px para que esa imagen se mostrara en su tamaño original 640px × 512px lo que haríamos sería eliminar todo lo de color rojo (enlace que nos abre la imagen en una nueva ventana) y conservar la parte en azul. En esa parte resaltada en negrita (400) omitimos el 4 y en su lugar añadimos 0 quedaría así:

<img style="cursor: pointer; width: 400px; height: 320px;" src="http://xxx/s000/nombre.jpg" alt="" id="BLOGGER_PHOTO_ID_xxx00290" border="0" />
Con ese cambio mostramos una imagen de 640px × 512px.

Muchos tenemos la costumbre de acceder al blog por Blogger in draft en este caso el código de una imagen sería distinto aunque referente al tamaño el resultado es el mismo:

<div class="separator" style="clear: both; text-align: center;">
<a href="http://xxx/s1600-h/nombre.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://xxx/s400/nombre.jpg" /></a></div>

Desechamos la parte en color rojo, y conservamos la azul y verde, esta última es para la ubicación de la imagen si eliminamos el color verde la imagen se situará a la izquierda pero no es problema porque situándose en la pestaña Redactar podemos arrastrar la imagen.

Otro ejemplo adaptado a esta entrada. Mi plantilla tiene de main-wrapper width:510px quiero añadir una imagen y escojo la opción grande (400)

Pienso que la quiero mostrar en su tamaño original (500px×333px)no es mucha la diferencia pero puede hacerse así que donde dice /s400/ lo cambio por /s000/ el resultado sería la imagen en su tamaño original


Lo único a tener en cuenta es no intentar subir una imagen de tamaño superior al espacio de nuestras entradas porque seguramente desplazaría nuestra sidebar situándola al final de las entradas.


0

Whatsitscolor extraer colores de imágenes



Otra sencilla pero eficaz herramienta para extraer los colores de una imagen, se trata de Whatsitscolor

0

Buscando a Joana


Joana Emilce Contrera, de 15 años, se ausentó de su hogar en la localidad costera de Arroyo Leyes (Argentina), el 30 de octubre pasado. Su familia denunció el hecho ante la Policía y ratificó el reclamo frente a la Secretaría de Derechos Humanos de Santa Fe, que a través del Registro Provincial de Información de Niños, Niñas y Adolescentes Desaparecidos solicita información sobre el paradero de la menor.

Joana es una adolescente de 1,60 metros y pesa 57 kilos. Es de contextura delgada, tez trigueña y ojos marrones. Tiene una mancha marrón debajo del labio inferior y un lunar en la barbilla.

Se sospecha que fue secuestrada por una red de tráfico de personas que controla Argentina de norte a sur y de oeste a este, y que opera no solo en este país sino también en el resto del continente, en España y otros lugares de Europa. Se trata de mujeres que son secuestradas para ejercer la prostitución en contra de su voluntad o para imponerles algún otro tipo de esclavitud.

Sus familiares y amigos han fundado un blog para ayudar en su búsqueda:



Ante cualquier dato por favor contactarse con la Secretaría de Derechos Humanos de Santa Fe (Saavedra 2059, de la ciudad de Santa Fe o Moreno 248 de la ciudad de Rosario) o bien llamar a la línea gratuita 0800-555-3348 durante las 24 horas.


Actualización:

Apareció Joana Emilce Contrera
Hasta el momento no trascendió sobre su estado de salud ni los motivos por los que se ausentó.

0

Wigflip Generadores de Superstickies y alguno más



Wigflip es una de esas páginas que cuando la descubres te preguntas dónde estaría antes.
Consta de once generadores algunos conocidos como Superstickies


Y el famoso MAKE YOUR OWN SPEECH BUBBLE!

Hay un generador que me ha gustado es roflbot en un instante nos añade texto a cualquier imagen, un buen sustituto de las marcas de agua para fotografías.



[+/-] VER MÁS

Con tinytags podemos jugar a crear etiquetas.

Y si de jugar se trata hay que probar AutoMotivator




0

Calendario de archivos controlado en "fuentes y colores"

No hace mucho os explicaba la forma de colocar un calendario de archivos en el blog, hoy os muestro como colocar otro calendario parecido pero al que podremos controlar su "aspecto" desde Fuentes y colores de nuestro panel.

Lo he encontrado en phydeaux3, lo he traducido al castellano y he cambiado la imagen de carga por otra más pequeña, además he colocado un pequeño icono delante de las entradas que se muestran debajo del calendario.



[1] Añadimos un nuevo elemento "Archivos" en nuestra sidebar, que ha de tener este formato (pincha en la imagen para verla a mayor tamaño):



Elemento Archivos



[2] Localizamos ahora en la parte de "Edición HTML", sin expandir artilugios, la línea correspondiente al widget de "Archivos":

<b:widget id='BlogArchive1' locked='false' title='Archivo del blog' type='BlogArchive'/>


Tendremos que cambiar esa línea por este código:

<b:widget id='BlogArchive1' locked='false' title='Blog Archive' type='BlogArchive'>

<b:includable id='main'>

<b:if cond='data:title'>

<h2><data:title/></h2>

</b:if>

<div class='widget-content'>

<div id='ArchiveList'>

<div expr:id='data:widget.instanceId + "_ArchiveList"'>

<b:if cond='data:style == "HIERARCHY"'>

<b:include data='data' name='interval'/>

</b:if>

<b:if cond='data:style == "FLAT"'>

<b:include data='data' name='flat'/>

</b:if>

<b:if cond='data:style == "MENU"'>

<b:include data='data' name='menu'/>

</b:if>

</div>

</div>

<b:include name='quickedit'/>

</div>

</b:includable>

<b:includable id='toggle' var='interval'>

<!-- Toggle not needed for Calendar -->

</b:includable>

<b:includable id='flat' var='data'>

<div id='bloggerCalendarList'>

<ul>

<b:loop values='data:data' var='i'>

<li class='archivedate'>

<a expr:href='data:i.url'><data:i.name/></a> (<data:i.post-count/>)

</li>

</b:loop>

</ul>

</div>



<div id='blogger_calendar' style='display:none'>

<table id='bcalendar'><caption id='bcaption'>



</caption>

<!-- Table Header -->

<thead id='bcHead'></thead>

<!-- Table Footer -->



<!-- Table Body -->

<tbody><tr><td id='cell1'> </td><td id='cell2'> </td><td id='cell3'> </td><td id='cell4'> </td><td id='cell5'> </td><td id='cell6'> </td><td id='cell7'> </td></tr>

<tr><td id='cell8'> </td><td id='cell9'> </td><td id='cell10'> </td><td id='cell11'> </td><td id='cell12'> </td><td id='cell13'> </td><td id='cell14'> </td></tr>

<tr><td id='cell15'> </td><td id='cell16'> </td><td id='cell17'> </td><td id='cell18'> </td><td id='cell19'> </td><td id='cell20'> </td><td id='cell21'> </td></tr>

<tr><td id='cell22'> </td><td id='cell23'> </td><td id='cell24'> </td><td id='cell25'> </td><td id='cell26'> </td><td id='cell27'> </td><td id='cell28'> </td></tr>

<tr><td id='cell29'> </td><td id='cell30'> </td><td id='cell31'> </td><td id='cell32'> </td><td id='cell33'> </td><td id='cell34'> </td><td id='cell35'> </td></tr>

<tr id='lastRow'><td id='cell36'> </td><td id='cell37'> </td></tr>

</tbody>

</table>

<table id='bcNavigation'><tr>

<td id='bcFootPrev'></td>

<td id='bcFootAll'></td>

<td id='bcFootNext'></td>

</tr></table>



<div id='calLoadingStatus' style='display:none; text-align:center;'>

<script type='text/javascript'>bcLoadStatus();</script>

</div>

<div id='calendarDisplay'/>



</div>



<script type='text/javascript'> initCal();</script>



</b:includable>

<b:includable id='posts' var='posts'>

<!-- posts not needed for Calendar -->

</b:includable>

<b:includable id='menu' var='data'>

Configure your calendar archive widget - Edit archive widget - Flat List - Newest first - Choose any Month/Year Format

</b:includable>

<b:includable id='interval' var='intervalData'>

Configure your calendar archive widget - Edit archive widget - Flat List - Newest first - Choose any Month/Year Format

</b:includable>

</b:widget>


[3] Colocamos ahora el script para el calendario justo antes del </head> de nuestra plantilla:



<!-- Blogger Archive Calendar -->

<script type='text/javascript'>

//<![CDATA[



var bcLoadingImage = "http://img182.imageshack.us/img182/7880/rotatingarrowuq0.gif";

var bcLoadingMessage = " Cargando....";

var bcArchiveNavText = "Ver archivo";

var bcArchiveNavPrev = '&#9668;';

var bcArchiveNavNext = '&#9658;';

var headDays = ["Domingo","Lunes","Martes","Miercoles","Jueves","Viernes","Sabado"];

var headInitial = ["Do","Lu","Ma","Mi","Ju","Vi","Sa"];



// Nothing to configure past this point ----------------------------------

var timeOffset;

var bcBlogID;

var calMonth;

var calDay = 1;

var calYear;

var startIndex;

var callmth;

var bcNav = new Array ();

var bcList = new Array ();



//Initialize Fill Array

var fill = ["","31","28","31","30","31","30","31","31","30","31","30","31"];

function openStatus(){

document.getElementById('calLoadingStatus').style.display = 'block';

document.getElementById('calendarDisplay').innerHTML = '';

}

function closeStatus(){

document.getElementById('calLoadingStatus').style.display = 'none';

}

function bcLoadStatus(){

cls = document.getElementById('calLoadingStatus');

img = document.createElement('img');

img.src = bcLoadingImage;

img.style.verticalAlign = 'middle';

cls.appendChild(img);

txt = document.createTextNode(bcLoadingMessage);

cls.appendChild(txt);

}

function callArchive(mth,yr,nav){

// Check for Leap Years

if (((yr % 4 == 0) && (yr % 100 != 0)) || (yr % 400 == 0)) {

fill[2] = '29';

}

else {

fill[2] = '28';

}

calMonth = mth;

calYear = yr;

if(mth.charAt(0) == 0){

calMonth = mth.substring(1);

}

callmth = mth;

bcNavAll = document.getElementById('bcFootAll');

bcNavPrev = document.getElementById('bcFootPrev');

bcNavNext = document.getElementById('bcFootNext');

bcSelect = document.getElementById('bcSelection');

a = document.createElement('a');

at = document.createTextNode(bcArchiveNavText);

a.href = bcNav[nav];

a.appendChild(at);

bcNavAll.innerHTML = '';

bcNavAll.appendChild(a);

bcNavPrev.innerHTML = '';

bcNavNext.innerHTML = '';

if(nav < bcNav.length -1){

a = document.createElement('a');

a.innerHTML = bcArchiveNavPrev;

bcp = parseInt(nav,10) + 1;

a.href = bcNav[bcp];

a.title = 'Archivo anterior';

prevSplit = bcList[bcp].split(',');

a.onclick = function(){bcSelect.options[bcp].selected = true;openStatus();callArchive(prevSplit[0],prevSplit[1],prevSplit[2]);return false;};

bcNavPrev.appendChild(a);

}

if(nav > 0){

a = document.createElement('a');

a.innerHTML = bcArchiveNavNext;

bcn = parseInt(nav,10) - 1;

a.href = bcNav[bcn];

a.title = 'Archivo siguiente';

nextSplit = bcList[bcn].split(',');

a.onclick = function(){bcSelect.options[bcn].selected = true;openStatus();callArchive(nextSplit[0],nextSplit[1],nextSplit[2]);return false;};

bcNavNext.appendChild(a);

}

script = document.createElement('script');

script.src = 'http://www.blogger.com/feeds/'+bcBlogId+'/posts/summary?published-max='+calYear+'-'+callmth+'-'+fill[calMonth]+'T23%3A59%3A59'+timeOffset+'&published-min='+calYear+'-'+callmth+'-01T00%3A00%3A00'+timeOffset+'&max-results=100&orderby=published&alt=json-in-script&callback=cReadArchive';

document.getElementsByTagName('head')[0].appendChild(script);

}

function cReadArchive(root){

// Check for Leap Years

if (((calYear % 4 == 0) && (calYear % 100 != 0)) || (calYear % 400 == 0)) {

fill[2] = '29';

}

else {

fill[2] = '28';

}

closeStatus();

document.getElementById('lastRow').style.display = 'none';

calDis = document.getElementById('calendarDisplay');

var feed = root.feed;

var total = feed.openSearch$totalResults.$t;

var entries = feed.entry || [];

var fillDate = new Array();

var fillTitles = new Array();

fillTitles.length = 32;

var ul = document.createElement('ul');

ul.id = 'calendarUl';

for (var i = 0; i < feed.entry.length; ++i) {

var entry = feed.entry[i];

var link = entry.link[0].href;

var title = entry.title.$t;

var author = entry.author[0].name.$t;

var date = entry.published.$t;

var summary = entry.summary.$t;

isPublished = date.split('T')[0].split('-')[2];

if(isPublished.charAt(0) == '0'){

isPublished = isPublished.substring(1);

}

fillDate.push(isPublished);

if (fillTitles[isPublished]){

fillTitles[isPublished] = fillTitles[isPublished] + ' | ' + title;

}

else {

fillTitles[isPublished] = title;

}

li = document.createElement('li');

li.style.listType = 'none';

li.innerHTML = '<a href="'+link+'">'+title+'</a>';

ul.appendChild(li);

}

calDis.appendChild(ul);

var val1 = parseInt(calDay, 10)

var valxx = parseInt(calMonth, 10);

var val2 = valxx - 1;

var val3 = parseInt(calYear, 10);

var firstCalDay = new Date(val3,val2,1);

var val0 = firstCalDay.getDay();

startIndex = val0 + 1;

var dayCount = 1;

for (x =1; x < 38; x++){

var cell = document.getElementById('cell'+x);

if( x < startIndex){

cell.innerHTML = ' ';

cell.className = 'firstCell';

}

if( x >= startIndex){

cell.innerHTML = dayCount;

cell.className = 'filledCell';

for(p = 0; p < fillDate.length; p++){

if(dayCount == fillDate[p]){

if(fillDate[p].length == 1){

fillURL = '0'+fillDate[p];

}

else {

fillURL = fillDate[p];

}

cell.className = 'highlightCell';

cell.innerHTML = '<a href="/search?updated-max='+calYear+'-'+callmth+'-'+fillURL+'T23%3A59%3A59'+timeOffset+'&updated-min='+calYear+'-'+callmth+'-'+fillURL+'T00%3A00%3A00'+timeOffset+'" title="'+fillTitles[fillDate[p]].replace(/"/g,'\'')+'">'+dayCount+'</a>';

}

}

if( dayCount > fill[valxx]){

cell.innerHTML = ' ';

cell.className = 'emptyCell';

}

dayCount++;

}

}

visTotal = parseInt(startIndex) + parseInt(fill[valxx]) -1;

if(visTotal >35){

document.getElementById('lastRow').style.display = '';

}

}



function initCal(){

document.getElementById('blogger_calendar').style.display = 'block';

var bcInit = document.getElementById('bloggerCalendarList').getElementsByTagName('a');

var bcCount = document.getElementById('bloggerCalendarList').getElementsByTagName('li');

document.getElementById('bloggerCalendarList').style.display = 'none';

calHead = document.getElementById('bcHead');

tr = document.createElement('tr');

for(t = 0; t < 7; t++){

th = document.createElement('th');

th.abbr = headDays[t];

scope = 'col';

th.title = headDays[t];

th.innerHTML = headInitial[t];

tr.appendChild(th);

}

calHead.appendChild(tr);

for (x = 0; x <bcInit.length;x++){

var stripYear= bcInit[x].href.split('_')[0].split('/')[3];

var stripMonth = bcInit[x].href.split('_')[1];

bcList.push(stripMonth + ','+ stripYear + ',' + x);

bcNav.push(bcInit[x].href);

}

var sel = document.createElement('select');

sel.id = 'bcSelection';

sel.onchange = function(){var cSend = this.options[this.selectedIndex].value.split(',');openStatus();callArchive(cSend[0],cSend[1],cSend[2]);};

q = 0;

for (r = 0; r <bcList.length; r++){

var selText = bcInit[r].innerHTML;

var selCount = bcCount[r].innerHTML.split('> (')[1];

var selValue = bcList[r];

sel.options[q] = new Option(selText + ' ('+selCount,selValue);

q++

}

document.getElementById('bcaption').appendChild(sel);

var m = bcList[0].split(',')[0];

var y = bcList[0].split(',')[1];

callArchive(m,y,'0');

}

function timezoneSet(root){

var feed = root.feed;

var updated = feed.updated.$t;

var id = feed.id.$t;

bcBlogId = id.split('blog-')[1];

upLength = updated.length;

if(updated.charAt(upLength-1) == "Z"){timeOffset = "+00:00";}

else {timeOffset = updated.substring(upLength-6,upLength);}

timeOffset = encodeURIComponent(timeOffset);

}

//]]>

</script>

<script src='/feeds/posts/summary?max-results=0&amp;alt=json-in-script&amp;callback=timezoneSet'/>

<!-- End Blogger Archive Calendar -->


[4]Guardamos los cambios y ya podremos ver la versión básica del calendario en nuestra sidebar.



Calendari basico

[5] Para poder controlar el aspecto del calendario en "Fuentes y colores" hemos de añadir en la plantilla unas cuantas variables exclusivas del calendario.

(El sitio ideal para colocarlas es justo debajo o encima de las que ya bienen en nuestra plantilla y que están casi al comienzo de esta):



/* Calendario de Archivos Variables

=========================================

<Variable name="bcCalenderFonts" description="Calendar Font Sizes"

type="font" default="normal normal 100% Tahoma, Arial, Sans-serif" / value="normal normal 100% Tahoma, Arial, Sans-serif">

<Variable name="bcTableBackgroundColor" description="Calendar Background Color"

type="color" default="#ffffff" value="#ffffff">

<Variable name="bcTableBorderColor" description="Calendar Border Color"

type="color" default="#000000" value="#000000">

<Variable name="bcTableTextColor" description="Calendar Text Color"

type="color" default="#000000" value="#000000">

<Variable name="bcMenuBackgroundColor" description="Calendar Menu Select Background Color"

type="color" default="#ffffff" value="#ffffff">

<Variable name="bcMenuTextColor" description="Calendar Menu Select Text Color"

type="color" default="#000000" value="#000000">

<Variable name="bcTableHeaderBackgroundColor" description="Calendar Header Background Color"

type="color" default="#ffffff" value="#ffffff">

<Variable name="bcTableHeaderTextColor" description="Calendar Header Text Color"

type="color" default="#000000" value="#000000">

<Variable name="bcTableHighLightColor" description="Calendar Highlight Color"

type="color" default="#cccccc" value="#cccccc">

<Variable name="bcCalenderLinksColor" description="Calendar Links Color"

type="color" default="#0000ff" value="#0000ff">

<Variable name="bcCalenderLinksHoverColor" description="Calendar Links Hover Color"

type="color" default="#0000ff" value="#0000ff">

<Variable name="bcTableFooterBackground" description="Calendar Footer Background Color"

type="color" default="#ffffff" value="#ffffff">

<Variable name="bcFooterLinksColor" description="Calendar Footer LinksColor"

type="color" default="#0000ff" value="#0000ff">


[6] Para terminar, añadimos unas líneas de CSS en la plantilla, por ejemplo, justo antes de ]]></b:skin>



/* Archive Calendar CSS

----------------------------------------------- */



/* div that holds calendar */

#blogger_calendar { margin:5px 0 0 0;width:98%;}



/* Table Caption - Holds the Archive Select Menu */

#bcaption {border:1px solid $bcTableBorderColor;padding:2px;margin:10px 0 0;background:$bcMenuBackgroundColor;font:$bcCalenderFonts}



/* The Archive Select Menu */

#bcaption select {background:$bcMenuBackgroundColor;border:0 solid $bcMenuBackgroundColor;color:$bcMenuTextColor;font-weight:bold;text-align:center;}





/* The Heading Section */

table#bcalendar thead {}



/* Head Entries */

table#bcalendar thead tr th {width:20px;text-align:center;padding:2px; border:1px outset $bcTableBorderColor; font:$bcCalenderFonts;background:$bcTableHeaderBackgroundColor;color:$bcTableHeaderTextColor}



/* The calendar Table */

table#bcalendar {border:1px solid $bcTableBorderColor;border-top:0; margin:0px 0 0px;width:95%;background:$bcTableBackgroundColor}



/* The Cells in the Calendar */

table#bcalendar tbody tr td {text-align:center;padding:2px;border:1px outset $bcTableBorderColor; color:$bcTableTextColor;font:$bcCalenderFonts;}



/* Links in Calendar */

table#bcalendar tbody tr td a:link, table#bcalendar tbody tr td a:visited, table#bcalendar tbody tr td a:active {font-weight:bold;color:$bcCalenderLinksColor;}

table#bcalendar tbody tr td a:hover {color:$bcCalenderLinksHoverColor;}



/* First Row Empty Cells */

td.firstCell {visibility:visible;}



/* Cells that have a day in them */

td.filledCell {}



/* Cells that are empty, after the first row */

td.emptyCell {visibility:hidden;}



/* Cells with a Link Entry in them */

td.highlightCell {background:$bcTableHighLightColor;border:1px solid $bcTableBorderColor}



/* Table Footer Navigation */

table#bcNavigation {width:95%;background:$bcTableFooterBackground;border:1px solid $bcTableBorderColor;border-top:0;color:$bcTableTextColor;font:$bcCalenderFonts;}

table#bcNavigation a:link {text-decoration:none;color:$bcFooterLinksColor}

td#bcFootPrev {width:10px;}

td#bcFootAll{text-align:center;}

td#bcFootNext {width:10px;}

ul#calendarUl {margin:5px auto 0!important;}

ul#calendarUl li a:link {}

ul#calendarUl li {

background:transparent url(http://img504.imageshack.us/img504/3452/stocknextpagesr5.png) no-repeat !important;

padding: 0 0 0 35px !important;

}


Guardamos los cambios y vemos como ha quedado el calendario:



Ejemplo sin modificar

[7] Si vamos ahora a "Fuentes y colores" en nuestro panel, veremos allí las nuevas opciones para cambiar el aspecto al calendario.

Tendremos en cuenta que en la vista desde "Fuentes y colores" no se verá el calendario completo, así que tendremos que ir guardando y comprobando algunos cambios desde la vista normal del blog.



Este es uno de los aspectos del calendario que conseguí en una de mis pruebas:



Ejemplo terminado

Ocultar las entradas que se despliegan debajo del calendario



En el código CSS que añadimos en el paso [6], localizamos esta línea:

ul#calendarUl {margin:5px auto 0!important;} y añadimos en ella un display:none;:

ul#calendarUl { display:none;margin:5px auto 0!important;}


Como es lógico, una vez ocultas las entradas ya no necesitaremos mostrar la imagen de carga ni el "Cargando...", así que en el paso [3] localizamos (casi al principio) estas líneas y las eliminamos:

var bcLoadingImage = "http://img182.imageshack.us/img182/7880/rotatingarrowuq0.gif";

var bcLoadingMessage = " Cargando....";






Nota:

Los que no quieran usar el calendario desde "Fuentes y colores" y prefieran usar uno de los modelos diseñados por phydeaux3, solo han de omitir el paso [5], es decir, ignorar la colocación de variables y en el paso [6] colocar uno de los códigos CSS proporcionados por phydeaux3.





0

ICONLOOK - Iconos



ICONLOOK es un buscador de iconos algo muy útil cuando necesitamos  iconos de un tamaño determinado.


La búsqueda también podemos realizarla en la amplia nube de tab.


0

GREENPEACE Wallpapers


Wallpapers GREENPEACE