Hellooooooww~~
Hoy os traigo de parte de un request de Saku un gadget de un calendario personalizable que sirve para añadir eventos  y funciona con Javascript (espero que esa haya sido la idea que me preguntabas, si no en otra entrega añadiré otros calendarios <3)


Espero que te guste, este calendario es bastante especial xDDD La verdad es que me llevó la vida entenderlo y seguro que por ahi hay más bonitos nwn Espero que no te disguste :3
A ver que tal~ *W* 
1. Coloca todo este código en <body> donde tu quieras [Plantillas Clásicas], o en un gadget [Nuevas Plantillas] <3


Lo traigo completamente como salía en el post :3 ahora voy explicando qué es cada cosa xD Lo primero de todo es que es bastante complicado de "averiguar"porque es un código directo, no es algo que tu pongas y ya está xDDD no sé si me explico <3 En fin... Voy a colocar instrucciones:

En esta línea cambias la font, tamaño y color.

*/
msgFont='Arial,helvetiva';
msgFontSize="12";
msgFontColor="black"
/*

En esta cambias los eventos que se te ocurran, puedes añadir muchísimos, tambien con colores y esas cosillas <3
 
var eventos = new Array()
eventos[0] = new evento (25,4,"evento del 25 de abril jajaja")
eventos[1] = new evento (5,8,"este marca el evento del 5 agosto")
eventos[2] = new evento (15,7,"Aqui puedes poner <u><font color=ff0000>colores</font></u>")
eventos[3] = new evento (10,8,"me gustan<u><font color=ff0000> los colores</font></u>")

En esta línea contienen varias variables, la que empieza con var highlight_start es para destacar con colores o el borde cómo quieres que salga el día señalado de hoy. Si quieres colocar más CCS, utiliza el atributo style que está mas adelante.


/* VARIABLES FOR FORMATTING
NOTE: You can format the 'BORDER', 'BGCOLOR', 'CELLPADDING', 'BORDERCOLOR'
      tags to customize your caledanr's look. */

var TR_start = '
<tr>';
var TR_end = '</TR>
';
var highlight_start = '<td WIDTH="20"><table CELLSPACING=0 BORDER=1 BGCOLOR=DEDEFF BORDERCOLOR=CCCCCC style="font-size:' +msgFontSize+'px; font-family:'+msgFont+'; color:'+msgFontColor+'">
<tr><td WIDTH=18><b><center>
';
var highlight_end   = '</CENTER></TD></TR>
</TABLE></B>';
var TD_start = '<td WIDTH="20"><center>
';
var TD_end = '</CENTER></TD>';

En esta línea contienen varias variables también, estas son para el diseño de la tabla, los colores, el fondo y demás. Si quieres colocar más CCS, utiliza el atributo style que está mas adelante.

/* BEGIN CODE FOR CALENDAR
NOTE: You can format the 'BORDER', 'BGCOLOR', 'CELLPADDING', 'BORDERCOLOR'
tags to customize your calendar's look.*/
cal =  '<table BORDER=1 CELLSPACING=0 CELLPADDING=0 BORDERCOLOR=BBBBBB style="font-size:' +msgFontSize+'px; font-family:'+msgFont+'; color:'+msgFontColor+'">
<tr><td>';
cal += '<table BORDER=0 CELLSPACING=0 CELLPADDING=2 style="font-size:' +msgFontSize+'px; font-family:'+msgFont+'; color:'+msgFontColor+'">' + TR_start;
cal += '<td COLSPAN="' + DAYS_OF_WEEK + '" BGCOLOR="#EFEFEF"><center>
<b>';
cal += month_of_year[month]  + '   ' + year + '</B>' + TD_end + TR_end;
cal += TR_start;


Para modificar el mensaje inicial que aparece al recargar la página:

<div id="divMessage" style="position:absolute; width:175px; height:80px; font-size: 12px; font-family: Arial; color:#000000;">
      Aqui se muestra el evento que señales en el Calendario!!!

</div>


ACTUALIZO: Para cambiar los links de color, tipo, etc coloca esto entre las pestañas <style> o <b:skin> de tu blog:

tr td a center {....lo que quieras añadir aquí....}

* * *
Ya está! Creo que eso es todo por ahora :3 espero que os haya gustado <3
Para la siguiente buscaré más para nuevas entradas *W*
Chauuu~~

ラベル: