Entonces, la pregunta del millón es: ¿Dónde alojar archivos javascript?

Hace un par de meses, Fernando en Quite Random nos mostraba una serie de alternativas para incorporar javascript en la misma plantilla. Cuando es posible, añadir javascript en la misma plantilla es lo más recomendable; sin embargo, cuando los archivos son demasiado grandes, es preferible usar un hosting externo.

¿Qué hosting usar?

Hay una serie de alternativas:

1. HotlinkFiles. Como su nombre lo indica, permite el hotlink de todo tipo de archivos, incluyendo *.js e *.ico.

• Características: 1GB de espacio libre, 8 MB de ancho de banda mensual, 50 MB máximo por archivo.
• Uso: Para obtener el enlace directo a cada archivo, es necesario subir el archivo, y en la sección “MyFiles” hacer click sobre él con el botón derecho del mouse (Propiedades/Dirección).

2. Lycos Tripod. Un hosting web de la época de los dinosaurios (seguro lo recordarán quienes lo vieron como alternativa a Angelfire o Geocities). Permite incluso hacer experimentos con PHP.

• Características: 1GB de espacio libre para todo tipo de archivos, ancho de banda ilimitado. El registro te da un subdominio del tipo “usuarios.lycos.es”, “chica-web.es”, “super-red.es” “miss-web.es” o “mi-website.es”.
• Uso: Accediendo a tu cuenta, puedes subir archivos vía FTP en WebFTP/Abrir FTP Web. El enlace directo a tu archivo será: tusubdominio/archivo.extensión. Por ejemplo: http://chicablogger.chica-web.es/easyslider.js.

3. FileAve. Un antiquísimo sitio online desde 2002, que comencé a valorar gracias a la recomendación de Alvaris Falcon.

• Características: Subdominio, 30MB para subir archivos de todo tipo. Es necesario entrar cada 30 días para evitar que tu cuenta sea borrada.
• Uso: Mediante el registro, puedes subir y ver las direcciones directas de tus archivos desde la sección “Files”.

4. Ripway. 30 MB para subir todo tipo de archivos (incluidos videos, imágenes y archivos PHP), 150 MB de banda ancha mensual. Utiliza el mismo script que Fileave; por lo tanto, puedes ver las URLs de tus archivos en la sección “Files”.

5. Web Hosting gratuitos varios, como 000WebHost. TexMixer hizo un listado de hostings gratuitos sin publicidad en los que perfectamente puedes llegar a instalar WordPress. Hostings como éstos, hay muchos; el problema es muchos de ellos prohiben ser usados sólo como hostings de archivos. En todo caso, siempre es recomendable leer sus políticas, y tener un respaldo de tus archivos.

Alternativas para alojar javascript, hay. Si usas Blogger, es bueno que las tengas a mano, porque nunca sabes cuándo las vas a necesitar.

Posts relacionados

• Kadoo: 10 GB gratuitos para almacenar archivos
• Alternativa a Google pages
• Pure CSS Menu: Generador de menús desplegables sin javascript

El script, de JavaScript Kit, es un countdown (cuenta regresiva) que se muestra en forma de texto, y que podemos modificar para hacerlo más funcional y utilizarlo en cualquier fecha: Navidad, año nuevo, cumpleaños, etc.

Para utilizarlo, sólo es necesario copiar el texto en un nuevo widget (o gadget) de HTML javascript y listo. Podemos añadir un título a nuestro widget, o simplemente dejar el área en blanco.

Espero que sea útil!

Script original (en inglés)

Se vería algo así:

“2 days left until Christmas (Dec 25)!“

<script type="text/javascript">
 
/*
Annual Occasions Count Down script- By JavaScript Kit
For this and over 400+ free scripts, visit http://www.javascriptkit.com
This notice must stay intact
*/
 
var today=new Date()
 
//Enter the occasion's MONTH (1-12) and DAY (1-31):
var theoccasion=new Date(today.getFullYear(), 12, 25)
 
//Customize text to show before and on occasion. Follow grammer below:
var beforeOccasionText="left until Christmas"
var onOccasiontext="Today is Christmas. Happy Holidays!"
 
var monthtext=new Array("Jan","Feb","Mar","April","May","June","July","Aug","Sep","Oct","Nov","Dec")
theoccasion.setMonth(theoccasion.getMonth()-1) //change to 0-11 month format
var showdate="("+monthtext[theoccasion.getMonth()]+" "+theoccasion.getDate()+")" //show date of occasion
 
var one_day=1000*60*60*24
var calculatediff=""
 
calculatediff=Math.ceil((theoccasion.getTime()-today.getTime())/(one_day))
if (calculatediff<0){ //if bday already passed
var nextyeartoday=new Date()
nextyeartoday.setFullYear(today.getFullYear()+1)
calculatediff=Math.ceil((nextyeartoday.getTime()-today.getTime())/(one_day)+calculatediff)
}
 
//Display message accordingly
var pluraldayornot=(calculatediff==1)? "day" : "days"
if (calculatediff>0)
	document.write("<b>"+calculatediff+" "+pluraldayornot+" "+beforeOccasionText+" "+showdate+"!</b>")
else if (calculatediff==0)
	document.write("<b>"+onOccasiontext+" "+showdate+"!</b>")
 
</script>

Configuración básica del script

//Enter the occasion’s MONTH (1-12) and DAY (1-31):
var theoccasion=new Date(today.getFullYear(), 12, 25)

Determina la fecha de la cuenta regresiva, en números. En este caso, es 12,25 (Diciembre 25). Va siempre primero el mes, y luego el día.

//Customize text to show before and on occasion. Follow grammer below:
var beforeOccasionText=”left until Christmas”
var onOccasiontext=”Today is Christmas. Happy Holidays!”

Determina el texto que queremos que se muestre antes del día y en el mismo día, respectivamente.

var monthtext=new Array(“Jan”,”Feb”,”Mar”,”April”,”May”,”June”,”July”,”Aug”,”Sep”,”Oct”,”Nov”,”Dec”)

Los nombres de los meses. Podemos mostrarlos en forma abreviada o completa.

var pluraldayornot=(calculatediff==1)? “day” : “days”

Singular y plural del texto que va a acompañar al número. Ejemplo, “día” : “días”.

Script en español

Hice una traducción al español del script, de acuerdo a lo que permiten mis conocimientos en javascript. Pueden descargarlo desde aquí en formato *.txt.

Para adornar la cuenta regresiva, también podemos agregar un estilo en HTML. Así, podemos poner una imagen que acompañe al texto, o cambiar el color y el tamaño del texto.

Ejemplo:

Aquí utilicé un icono de Iconspedia de 64×64 píxeles, alineado a la izquierda, con un texto de 16px en verde #284d22 (ver colores HTML).

CÓDIGO (modificar a gusto):

<div style="color: #284d22; font-size: 16px; padding-left: 68px; min-height: 64px; background: url(http://i362.photobucket.com/albums/oo63/girlyblogger/candy-cane-64x64.png) top left no-repeat;">
 
El-script-va-aquí
 
</div>

Más countdowns (Flash)

Posts relacionados

• Blogger: ¿Dónde alojar archivos javascript?
• Copos de nieve en el blog
• Mostrar anuncios de Adsense sólo a los visitantes de buscadores en WordPress y Blogger