Blogger ataca otra vez

JMiur [E]

Dicen que no hay nada peor que un mono con navaja. Mentira. Hay algo mucho peor: un Dios irracional. Y Google, que ya es un Dios en la web, se está volviendo loco.

Hubo un día al que en Blogger Buzz llamaron el Spam Friday. El viernes en que un sinfin de blogs fueron marcados como spam; una de esas famosas "fallas del sistema" que terminan en disculpas y blablabla.

Ya pasaron diez días y al parecer o la falla no fue corregida o se trata de una nueva política de Blogger: "eres culpable mientras no demuestres tu inocencia".

Son innumerables las consultas que he recibido en estos días respecto a blogs marcados como spam. Sitios que ya lleva mucho tiempo online pero la epidemia abarca a otros, incluso BLOGS RECIEN CREADOS Y SIN CONTENIDO.

Los Grupos de Ayuda de Google están llenos de pedidos de desbloqueo; los usuarios llevan días y días suplicando que alguien se apiade de ellos. Los Guias de Google hacen lo que pueden pero el voluntarismo no es suficiente (más información).

Hay algo que funciona mal y es grave porque si la idea es eliminar el spam, los resultados obtenidos son patéticos y sólo un imbécil cree que repitiendo una acción equivocada una y otra vez, obtendrá un resultado diferente.

Blogger: ¿quieres reducir la cantidad de blogs spam?:

Crea un mejor sistema de registro.
No permitas abrir cuentas de GMail con tanta facilidad, revisa el sistema; hay decenas de sitios que muestran formas de crear cuentas de manera automática (más información).
Solicita que los usuarios confirmen ser administradores de manera regular.

¿Muy complicado? Modifica los robots:

Mira los comentarios del sitio.
Analiza el feedback, los enlaces entrantes y los enlaces salientes.
Descarta los blogs recien creados, los privados o los que no se indexan.
Cámbiale las baterias, pueden estar sulfatadas.

¡Blogger/Google/Dios: déjate de joder!

Paginación en Blogger

Paginar es separar las entradas del blog en grupos de cierta cantidad de entradas y permitir navegar entre ellas.

En Blogger, la única posibilidad que tenemos es Avanzar (Newer Post) o Retroceder (Older Post); en otros servicios, también existe la posibilidad de crear esa paginación de tal manera que no sólo podemos avanzar o retroceder sino "dividir" nuestro blog de tal manera de poder "saltearnos" cosas y navegar más rápido:

En Blogger Accesories han creado un script que nos permite hacer esto con algunas limitaciones pero, funciona bien y, como parte del truco se basa en propiedades CSS, nos da la posibilidad de personalizarlo de muchas maneras.

Para empezar, vamos a la plantilla y sin expandir lo artilugios, buscamos lo siguiente:

<b:section class='main' id='main' showaddelement='yes'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
</b:section>

Justo debajo, agregamos el script. Este es su contenido:

<script type='text/javascript'>
//<![CDATA[
// http://rias-techno-wizard.blogspot.com
function showpageCount(json) {
var thisUrl = location.href;
var htmlMap = new Array();
var isFirstPage = thisUrl.substring(thisUrl.length-14,thisUrl.length)==".blogspot.com/";
var isLablePage = thisUrl.indexOf("/search/label/")!=-1;
var isPage = thisUrl.indexOf("/search?updated")!=-1;
var thisLable = isLablePage ? thisUrl.substr(thisUrl.indexOf("/search/label/")+14,thisUrl.length) : "";
thisLable = thisLable.indexOf("?")!=-1 ? thisLable.substr(0,thisLable.indexOf("?")) : thisLable;
var thisNum = 1;
var postNum=1;
var itemCount = 0;
var fFlag = 0;
var eFlag = 0;
var html= '';
var upPageHtml ='';
var downPageHtml ='';

var pageCount=5;
var displayPageNum=5;
var upPageWord ='Anterior';
var downPageWord ='Siguiente';

var labelHtml = '<span class="showpageNum"><a href="/search/label/'+thisLable+'?&max-results='+pageCount+'">';

for(var i=0, post; post = json.feed.entry[i]; i++) {
var timestamp = post.published.$t.substr(0,10);
var title = post.title.$t;
if(isLablePage) {
if(title!='') {
if(post.category) {
for(var c=0, post_category; post_category = post.category[c]; c++) {
if(encodeURIComponent(post_category.term)==thisLable) {
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))) {
if(thisUrl.indexOf(timestamp)!=-1 ) {
thisNum = postNum;
}
postNum++;
htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;
}
}
}
} //end if(post.category){
itemCount++;
}
} else {
if(title!='') {
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))) {
if(thisUrl.indexOf(timestamp)!=-1 ) {
thisNum = postNum;
}
if(title!='') postNum++;
htmlMap[htmlMap.length] = '/search?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;
}
}
itemCount++;
}
}

for(var p =0;p< htmlMap.length;p++) {
if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)) {
if(fFlag ==0 && p == thisNum-2) {
if(thisNum==2) {
if(isLablePage) {
upPageHtml = labelHtml + upPageWord +'</a></span>';
} else {
upPageHtml = '<span class="showpage"><a href="/">'+ upPageWord +'</a></span>';
}
} else {
upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';
}
fFlag++;
}
if(p==(thisNum-1)) {
html += '<span class="showpagePoint">'+thisNum+'</span>';
} else {
if(p==0) {
if(isLablePage) {
html = labelHtml+'1</a></span>';
} else {
html += '<span class="showpageNum"><a href="/">1</a></span>';
}
} else {
html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +'</a></span>';
}
}
if(eFlag ==0 && p == thisNum) {
downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';
eFlag++;
}
}//end if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
}//end for(var p =0;p< htmlMap.length;p++){

if(thisNum>1) {
if(!isLablePage) {
html = '<span class="showpage"></span>'+upPageHtml+' '+html +' ';
}
}

html = '<div class="showpageArea">'+html;
// html = '<div class="showpageArea"><span class="showpage"> Total '+(postNum-1)+': </span>'+html;

if(thisNum<(postNum-1)) {
html += downPageHtml;
}

if(postNum==1) postNum++;
html += '</div>';

if(isPage || isFirstPage || isLablePage) {
var pageArea = document.getElementsByName("pageArea");
var blogPager = document.getElementById("blog-pager");
if(postNum <= 2) {
html ='';
}
for(var p =0;p< pageArea.length;p++) {
pageArea[p].innerHTML = html;
}
if(pageArea&&pageArea.length>0) {
html ='';
}
if(blogPager) {
blogPager.innerHTML = html;
}
}
}
//]]>
</script>
<script src='/feeds/posts/summary?alt=json-in-script&amp;callback=showpageCount&amp;max-results=99999' type='text/javascript'/>

En el código, hay una serie de valores que podemos modificar:

La cantidad de posts que se mostrarán por página (por defecto una sola):
var pageCount = n;

La cantidad de páginas listadas (por defecto dos)
var displayPageNum=n;

Los textos a mostrar:
var upPageWord ='Back'; // página anterior
var downPageWord ='Next'; // página siguiente

Para que todo estuviera terminado sólo nos faltaría agregar el estilo. Eso lo ponemos entre etiquetas <style> o bien antes de </b:skin>.

Este son las propiedades originales definidas por Blogger Acccesories:

.showpageArea {
background: transparent url(http://i263.photobucket.com/albums/ii150/mohamedrias/ShowPagenavbar.jpg) no-repeat left top;
color:#003366;
font-size: 11px; 
padding: 10px 15px 10px 30px;
text-align: left;
width: 470px;
}
.showpageArea a {
color: #0F0;
text-decoration: underline;
}
.showpageNum a {
border: 1px solid #FFF;
color:#0F0;
margin: 0 10px;
padding: 0 5px 0 8px;
text-decoration:none;
}
.showpageNum a:hover {
color: #FE8314;
background-color: #FFF;
border: 1px solid #0071A5;
}
.showpagePoint {
color: #FE8314;
margin: 0 8px 0 4px;
}
.showpage a {
color: #FFF;
padding: 0 2px 0 4px;
text-decoration: none;
}
.showpage a:hover {
color: #FE8314;
text-decoration: underline;
}
.showpageNum a:link,.showpage a:link {
color: #CC0000;
text-decoration: none;
}

Veamos que significa cada cosa así podemos personalizarlo:

.showpageArea {} es el rectángulo donde se va a mostrar la paginación y en el ejemplo, tiene una imagen de fondo. En mi caso, sólo definí un borde, eliminé el ancho y centré el contenido.

.showpageArea a {} son los enlaces en general (los números de las páginas y los textos Anterior y Siguiente). Podemos usar cualquier propiedad; yo, elegí ponerles una imagen y un borde.

.showpageArea a:hover {} no está en el ejemplo pero, como en mi caso, todos los rectangulitos será iguales se lo agrego para cambiar el efecto gráfico cuando colocamos el ratón encima de un enlace.

.showpageNum a {} y .showpageNum a:hover {} son los enlaces con los números de las páginas si es que queremos que se vean diferentes.

.showpage a {} y .showpage a:hover {} son los enlaces con los textos si es que queremos que se vean diferentes.

.showpagePoint {} es el texto que muestra el número de la página actual

Otra posibilidad si no se quiere poner el código a la plantilla, es agregar un elemento HTML y ubicarlo justo debajo del elemento Entradas del Blog. En ese caso, es allí donde colocamos el estilo y debajo, el script.

Es importante saber que la paginación no funciona en las páginas individuales (esto es lo normal incluso en otros sistemas) pero tampoco funciona si navegamos por etiquetas utilizando hacks y, esto último es una limitacion. De cualquier modo, me parece una solución interesante y pese a que los códigos son largos, es bastante simple de implementar y allá en el fondo, pueden verlo funcionando.

ACLARACIONES Y ACTUALIZACIONES:

Es importante recalcar que si implementamos el truco y hacemos click en Vista Previa no veremos nada ya que en este modo, los scripts no se ejecutan así que sólo podemos Guardar y ver el blog.

Un problema reportado por Fernando Alayo Orbegozo en un comentario nos alerta de una omisión en el script. Cuando nuestro sitio no está alojado en blogspot.com (cuando se tiene un dominio propio), deberemos modificar el código porque no funcionará en la página principal aunque sí lo hará en el resto.

Hay una línea que dice:

var isFirstPage = thisUrl.substring(thisUrl.length-14,thisUrl.length)==".blogspot.com/";

Alli, se detecta la página principal de nuestro sitio pero, como verifica blogspot.com, un dominio propio será ignorado, deberemos cambiar esa línea por:

var isFirstPage = thisUrl=="miDominio";

Y cambiar miDominio por la dirección de la página principal, por ejemplo:

var isFirstPage = thisUrl=="http://www.dospuntosyaparte.com/";

Mostrando la cantidad de posts

¿Problemas al re-alojar Scriptaculous?

Hay un problema repetido cuando mudamos ciertos scripts de Google Pages a otro servidor y habrá que resolverlos uno por uno. En este caso, hay algunas consultas repecto al uso de las tan conocidas Prototype y Scriptaculous.

Tanto MrPrado como Mar alojaron esos scripts en Skydrive sin problemas pero ... no funcionan.

Peor aún, llegan a producirse errores serios y en un momento el navegador colapsa.

El problema es Scriptaculous ya que por lo general, esta librería utiliza otras, asociadas y todas deben estar en el mismo directorio:

http://nuestroAlojamiento/scriptaculous.js?load=effects

Muchos servicios de alojamiento de archivos nos permiten la creación de carpetas pero, eso no significa que esas carpetas sean reales, algunas veces, son virtuales, sólo una forma de organizarnos. Skydrive funciona de ese modo así que, por lo visto, no es un lugar adecuado para alojar esos scripts; en todo caso, si alguien pudo hacer que funcionara, sería bueno que lo dijera.

Si necesitamos un servidor porque queremos alojar esos scripts, de lo que he probado hasta ahora, Yahoo Geocities es una opción sencilla y no parece tener problemas pero, no es la única posibilidad.

En lo personal, me he decidido por olvidarme de alojar esos scripts y utilizar las llamadas AJAX Libraries API de Google que no son otra cosa que esos mismos scripts pero que Google pone a disposición de cualquiera que necesite utilizarlas en sus páginas web (más información). Este método tiene algunas ventajas respecto a alojarlas nosotros mismos: Google se encarga de cachearlas, no hay restrciciones en el ancho de banda y, con ciertas limitaciones, los scripts se actualizan con cierta regularidad.

En el caso de estas librerias, lo único que hace falta para acceder a ellas es agregar a la plantilla el siguiente código:

<script src='http://www.google.com/jsapi'/><script>
  google.load(&quot;prototype&quot;, &quot;1.6.0.2&quot;);
  google.load(&quot;scriptaculous&quot;, &quot;1.8.1&quot;);
</script>

Usando Yahoo! Geocities para alojar scripts y otras cosas

Como ya terminé con Google Pages me siento un poco extraño en medio de la tranquilidad así que decidí probar alguno de los otros servicios que podemos utilizar en su reeemplazo. Uno de los que despertó mi curiosidad es Yahoo! Geocities, vamos a ver cómo creamos una cuenta y si podemos utilizarla como repositorio para alojar nuestros archivos.

El servicio se publicita como un lugar que nos permite crear sitios web de manera sencilla y sin demasiadas restricciones. Disponen de varios planes y uno de ellos es gratuito así que allá vamos.

Si ya tenemos una ID de Yahoo, la ingresamos sino, la creamos en un par de pasos sencillos. Lo único que sugerirá es elegir una ID adecuada ya que será la que luego se usará como URL.

En la siguiente pantalla respondemos un par de preguntas y listo. Ya tenemos creado nuesto sitio y nos mostrarán el Panel de Control desde donde podremos manejarlo (más información).

Ahora, ya estamos listos para subir archivos. Vamos a MANAGE y allí nos darán dos posibilidades: Easy Upload y File Manager.

Con una cuenta gratuita, Yahoo Geocities nos ofrece 15MB de espacio disponible y 4.2MB de ancho de banda por hora. No parecen valores muy altos comparados con otros pero si lo usamos para cierto tipo de documentos, es más que suficiente.

Obvio, voy a usar Easy Upload y transferir archivos desde mi PC al directorio principal. Pueden subirse varios de manera simultánea mientras el total no supere los 5 megas.

La lista de archivos aceptados es realmente muy amplia; entre otros:

archivos comprimidos (ARJ, GZ, TGZ, ZIP)
multimedia (ASF, AU, AVI, MID. MOV, MP3, MPEG, MPG, PPS, PPT, QR, RM, WAV, WMA)
imagenes (ANI, BMP, CUR, GIF, JPEG, JPG, PNG, TIF)
applets de Java (CLASS, JAR)
web(CSS, HTM, HTML, JS, XML)
Macromedia (DCR, FLA, SMI, SMIL, SPL, SWF)
documentos (DOC, PDF, RTF, TXT, XLS)

Una vez subidos, podemos ir a File Manager y allí, copiar las direcciones URL de cada uno para usarlos en cualquier otra página web incluyendo las plantillas de Blogger. Para esto, hacemos click con el botón derecho del ratón sobre View y copiamos el enlace:

Para que se den una idea, alojando los cinco scripts más pesados y sus respectivas copias, sólo estoy usando 0.3MB de los 15MB disponibles así que es una buena alternativa para alojar ese tipo de archivo que la mayoría de los servicios no acepta.