¡¡ Nuevo Webmasters Deluxe !!

Ahora Webmasters Deluxe ha cambiado de lugar. Puedes encontrarnos en www.webmastersdeluxe.com con más contenido, más funciones y más social.

A+ | a-

domingo, 14 de diciembre de 2008

Articulos Relacionados en Blogger

A continuación vamos a ver como insertar los artículos relacionados al final de tus post en Blogger.

Antes de nada, haz una copia de seguridad de la plantilla de tu blog. En la pestaña "Editar HTML", y despues en "Descargar Plantilla Completa", y guarda el backup en un lugar fácil de encontrar en tu computador. Esta copia te servirá para restaurar la plantilla en caso de necesidad. No me responsabilizo de las consecuencias que tengas por no disponer de una copia de seguridad.

A continuación sigue los siguientes pasos, que para más facilidad puedes realizar con la ayuda de algún editor de HTML para buscar en el código de la plantilla;

1.- Buscar la etiqueta </head>  y pegar el siguiente código ANTES  de la misma:

<script type="text/javascript">
//<![CDATA[
var relatedTitles = new Array();
var relatedTitlesNum = 0;
var relatedUrls = new Array();
function related_results_labels(json) {
for (var i = 0; i < json.feed.entry.length; i++) {
var entry = json.feed.entry[i];
relatedTitles[relatedTitlesNum] = entry.title.$t;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
relatedUrls[relatedTitlesNum] = entry.link[k].href;
relatedTitlesNum++;
break;
}
}
}
}
function removeRelatedDuplicates() {
var tmp = new Array(0);
var tmp2 = new Array(0);
for(var i = 0; i < relatedUrls.length; i++) {
if(!contains(tmp, relatedUrls[i])) {
tmp.length += 1;
tmp[tmp.length - 1] = relatedUrls[i];
tmp2.length += 1;
tmp2[tmp2.length - 1] = relatedTitles[i];
}
}
relatedTitles = tmp2;
relatedUrls = tmp;
}
function contains(a, e) {
for(var j = 0; j < a.length; j++) if (a[j]==e) return true;
return false;
}
function printRelatedLabels() {
var r = Math.floor((relatedTitles.length - 1) * Math.random());
var i = 0;
document.write('<ul>');
while (i < relatedTitles.length && i < 20) {
document.write('<li><a href="' + relatedUrls[r] + '">' + relatedTitles[r] + '</a></li>');
if (r < relatedTitles.length - 1) {
r++;
} else {
r = 0;
}
i++;
}
document.write('</ul>');
}
//]]>
</script>

2.- Guarda la plantilla y haz clic en "Expandir plantillas de Artilugios" y busca el siguiente pedazo de código:

<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
<b:if cond='data:label.isLast != "true"'>,</b:if>
</b:loop>
</b:if>

3.- Pega el siguiente código ANTES de  </b:loop>:

<b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=10"' type='text/javascript'/>
</b:if>

4.- Debe de quedar así, con el texto en rojo para la parte que acabas de añadir: 

<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>

<b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=10"' type='text/javascript'/>
</b:if>

</b:loop>
</b:if>


5.- Ahora busca la siguiente linea:

<div class='post-footer-line post-footer-line-3'/>

6.- Añade el siguiente código DESPUES de ella:

<b:if cond='data:blog.pageType == "item"'><h3>articulos relacionados</h3></b:if>
<script type='text/javascript'>
removeRelatedDuplicates();
printRelatedLabels();
</script>


7.- Debe de quedar así:

<div class='post-footer-line post-footer-line-3'/>
<b:if cond='data:blog.pageType == "item"'><h3>articulos relacionados</h3></b:if>
<script type='text/javascript'>
removeRelatedDuplicates();
printRelatedLabels();
</script>


8.- Para modificar la cantidad de artículos que serán mostrados, busca este código en la plantilla: 

<b:if cond='data:blog.pageType == "item"'>
<script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=
10"' type='text/javascript'/>
</b:if>


9.- Cambia el número en rojo por la cantidad de artículos relacionados que quieres que se muestren. Este número no indica el total de artículos, solamente indica el número de artículos que se mostrarán para cada categoría. 

Los artículos relacionados solamente aparecen cuando los artículos son mostrados de forma individual.  Ten en cuenta que al acceder a la página principal estos no se mostrarán.

Ahora ya tienes todos los artículos relacionados de tu blog en un solo post. Así de simple.

Crear un formulario de contacto para Blogger

Vamos a ver como poder disponer en nuestro blog de Blogger de un formulario de contacto para recibir sugerencias, avisar de enlaces caídos, o simplemente abrir un canal de contacto entre usuarios y editor del blog. Para hacer esto vamos a necesitar de una herramienta que nos permita redireccionar nuestros emails, pues uno de los grandes errores de Blogger es que no dispone de un formulario que nos permita recibir emails directamente de nuestros lectores. 

Para este ejercicio yo he utilizado EmailmeForm, pero existen otros servicios de similares características que tambien pueden ser tenidos en cuenta. Empezamos;

  • Lo primero que haremos será darnos de alta en EmailmeForm, utilizando un correo electrónico habilitado, que despues nos servirá para recibir nuestros emails. Despues de confirmar el alta, accedemos al servicio de EmailmeForm
  • Creamos con el panel un nuevo formulario, indicando el nombre con el que lo reconoceremos, la dirección de email en donde queremos recibir los emails redireccionados, dirección a donde se enviará el spam, y la URL a donde queremos devolver a nuestros usuarios despues de realizar el envio
  • A continuación escribimos el número de campos que queremos que contenga el formulario (por defecto 4), y al pulsar en "Next" nos aparecerán los campos que indicamos. Ahora tenemos que configurarlos, lo cual es muy simple, porque la gran mayoría de formularios son estandar, y no necesitaremos realizar muchos cambios. Podemos decidir si serán campos obligatorios o opcionales, y si serán de texto largo, o una sola linea.
  • Una vez hecho saltamos a la siguiente opción en donde nos da a elegir el tamaño para cada campo. Probablemente no tengas que hacer demasiadas variaciones
  • Saltamos a la siguiente opción, donde tendremos que indicar el encabezado que queremos para nuestro formulario, el pié de página, una hoja de estilos en caso de que la tengamos, titulo del botón de envío, alineación del mismo, y si queremos que aparezca una imagen de identificación (captcha), opción esta muy interesante para evitar spam y envíos automatizados. Tambien debemos definir el modo en que usaremos el formulario (Display Mode) que dejaremos marcada como: Web Form will be inside the web page, visitor never leaves the site ya que lo insertaremos en nuestro blog, como si se tratara de un post más.
  • Cuando tengamos todo configurado saltamos a la siguiente opción, en donde tendremos que indicar algunos datos como desde donde se envía el email, el asunto del mismo, si incluye fecha de exportación y otros datos. Este apartado es simple de configurar, y probablemente no tengas que modificar ningún dato
  • En la siguiente opción  tendremos un ejemplo de como quedaría nuestro formulario. Si decidimos que todo está correcto, hacemos click en finish y nuestro formulario estará creado, y entonces saltamos a la última opción, en donde te permitirá entre otras cosas copiar el código (Get the HTML code)
  • Una vez que tenemos este código, abrimos nuestro blog en blogger y creamos un nuevo post, en donde vamos a pegar el código que acabamos de obtener. Este código admite más modificaciones si lo creemos necesario, pues al ser HTML es fácil de modificar con cualquier editor.

Para finalizar haremos algunas pruebas para asegurarnos de que todo funciona correctamente. Podemos utilizar este tipo de formularios para varias cosas como son; formulario de contacto, buzón de sugerencias, formulario de enlaces caidos, de advertencia, de suscripción, y todas las funciones que se te ocurran.

Aquí teneis un ejemplo práctico de un formulario: 

Sugerencias de publicaciones en Webmasters Deluxe

Envíanos tus sugerencias sobre temas que te gustaría ver publicados en Webmasters Deluxe, y los publicaremos.

- Solo se aceptan sugerencias sobre el tema que trata Webmasters Deluxe
- Las sugerencias propuestas se publicarán en el menor plazo de tiempo posible

Nombre *
Email *
Titulo Sugerencia * 
Texto Sugerencia *

* Todos los campos son obligatorios

Por favor, introducir el texto de la imagen 

[ Refrescar Imagen ] [ What's This? ]


Fuente;  Emailmeform.com

sábado, 13 de diciembre de 2008

Google Zeitgeist 2008 para América Latina

 Como ya anunciamos, Google Zeitgeist acaba de publicar la lista de términos más buscados en este año 2008 que ahora finaliza para un total de 35 paises. Entre estos términos tenemos las búsquedas más significativas para América Latina. Google Zeitgeist realiza la medición de estas búsquedas a través de las búsquedas de más rápido crecimiento que son aquellos términos que han visto un mayor incremento en volumen de búsquedas en un periodo de tiempo específico. Estas búsquedas de más rápido crecimiento se calculan con un algoritmo que compara el incremento del porcentaje en búsquedas de un término específico durante un periodo de tiempo determinado. Como no todas las búsquedas cumplen el término significativo para un periodo determinado, se aplica el uso de los mismos tipos de filtros que se utilizan con SafeSearch, de manera que por ejemplo no se incluyen palabras clave de temática de adultos, las cuales reciben gran cantidad de búsquedas pero no son significativas para Google Zeitgeist.

A continuación presentamos los diez términos que resultaron ser los más representativos en las búsquedas para este año 2008 en los países de Latino América;

  1. fulltono
  2. facebook
  3. jonas brothers
  4. cinetube
  5. ikarium
  6. hacksantana
  7. heath ledger
  8. diego velázquez
  9. en la disco
  10. servel

Fuente; Google.com

  ©Diseño: Isi Roca.

Subir