Crear un Indice de Posts Manual
Muy buenas a todos. llevo varios dĆas poniendo en orden el Ćndice de posts de esta maravilloso (pero llenĆsimo de entradas).AsĆ que ni corto ni perezoso me puse a buscar por aquĆ y por allĆ” buscando un tutorial que me indicara cĆ³mo hacer un Ćndice de posts tal y como yo lo tenĆa en la cabeza. Hasta que al fin encontrĆ© uno nada complicado de hacer y queda la mar de guapo y curioso lo encontre en creativemindly, por cierto muĆ bien explicado i documentado.
Desde ya os digo que no es un Ćndice que se vaya actualizando de forma automĆ”tica (ojalĆ”, pero no) sino que seremos nosotros quienes lo tengamos que actualizar poquito a poco. Actualizarlo, en sĆ, no nos va a costar mucho trabajo ni mucho tiempo. Pero sĆ que nos va a costar un rato crearlo. No es difĆcil, os lo prometo, pero sĆ que es laborioso, especialmente si tenĆ©is un volumen de entradas descomunal como es mi caso. Pero bueno, lo podĆ©is ir haciendo poco a poco, como he hecho yo. Pero creedme, tener un buen Ćndice de posts es muy muy importante.
Hasta ahora, y de hecho todavĆa no lo he terminado de modificar, el Ćndice de entradas de este blog consistĆa en distintas numeraciones por puntos con las entradas que he publicado. Es una forma muy legĆtima de organizar los posts, pero ya sabĆ©is que lo mĆo no es estar quieta. AsĆ que mi intenciĆ³n era hacer un Ćndice mĆ”s organizado y visual. Y esto es lo que os traigo.
Esto deberĆa ser obligatorio. Tener un Ćndice de posts, especialmente si acabas de aterrizar en un blog, es estupendo para hacerte una idea del tipo de contenido que esa persona suele publicar. AsĆ que, aunque no hagĆ”is un Ćndice siguiendo mis indicaciones, sĆ que os animo a que creĆ©is uno.
AsĆ que echadle ganas, buscad raticos y poneos a crear un Ćndice. Os va a merecer la pena seguro. Nada de perezas, hay que currar, especialmente si queremos que nuestro blog vaya mejorando.
En esta primera parte del Ćndice vamos a crear los cuadritos con texto. Y podĆ©is decir, va, paso de esta parte porque lo que yo quiero es que aparezcan imĆ”genes. Bueno, es tu decisiĆ³n, pero yo no estarĆa muy de acuerdo. Y os explico mis razones.
Al ser un Ćndice tipo tabla las imĆ”genes que podamos aƱadir no van a ser muy grandes (como veremos en el prĆ³ximo tutorial) asĆ que puede ser que en la imagen no se vea al 100% quĆ© es lo que hemos hecho. AsĆ que serĆ” IMPRESCINDIBLE poner texto debajo con el tĆtulo de la entrada para que nuestros lectores sepan quĆ© es lo que van a ver.
Y por si esta razĆ³n no te parece suficiente, por temas de SEO y posicionamiento en GOOGLE pon texto siempre en tu Ćndice. Por tanto, esta primera parte es OBLIGATORIA para todos lo que querĆ”is crear un buen Ćndice de posts para vuestro blog.
Resumiendo, en esta entrada vamos a insertar esos cuadritos con texto y vamos a enlazar, en el propio texto, la entrada correspondiente. No tiene ningĆŗn misterio, de verdad. AdemĆ”s os enseƱarĆ© cĆ³mo insertar mĆ”s filas en vuestras secciones y cĆ³mo actualizar el Ćndice. Ya verĆ©is quĆ© facil es.
Todo esto lo vamos a hacer en una PĆGINA de blogger.
ANTES DE EMPEZAR CON EL TUTORIAL
Antes de ver el vĆdeo y comenzar a crear nuestro Ćndice es muy muy importante que pensemos en quĆ© partes queremos dividir nuestro Ćndice. Es decir, en ningĆŗn momento queremos que el Ćndice se convierta en una maraƱa de informaciĆ³n mezclada. Queremos un Ćndice organizado por secciones que permita al lector ver quĆ© tipo de contenidos tenemos y, asĆ, pueda ir a la parte que mĆ”s le interese. AsĆ que el punto nĆŗmero uno serĆa elegir quĆ© secciones tendrĆ” nuestro Ćndice.
En segundo lugar debemos decidir quĆ© entradas queremos meter en cada una de las secciones. Puede ser que no queramos meter absolutamente todos los posts que hemos publicado hasta la fecha, sino que queremos que aparezcan los que mĆ”s nos gustan, los mĆ”s Ćŗtiles, actuales, representativos. De hecho, en este proceso, yo he descartado algunos posts que ya no me gustaban o estaban desfasados. Estos todavĆa estĆ”n publicados en mi blog, los podĆ©is ver, pero no he querido que aparezcan en mi Ćndice por que no me parecĆan relevantes ahora mismo.
HACER INDICE DE POSTS BLOG
Una vez que hayamos tomado estas decisiones ya estamos listos para comenzar con el tutorial. Como os repito (seguramente que mĆ”s veces que las debidas) la primera vez que hagamos el Ćndice nos va a llevar tiempo, esto es asĆ. Pero despuĆ©s, una vez que lo tengamos montado, ademĆ”s de sentirnos muy bien al tener toda la informaciĆ³n organizada, actualizarlo va a ser coser y cantar. De hecho, tambiĆ©n os voy a explicar cĆ³mo se actualiza el Ćndice (que no tiene ningĆŗn misterio).
EL TUTORIAL
AquĆ tenĆ©is el cĆ³digo que vamos a necesitar para crear nuestro Ćndice. Como siempre, que no haya ataques epilĆ©pticos ni histeria colectiva al ver el cĆ³digo, tanto el el vĆdeo, como ahora mismo, os voy a explicar un poquito en quĆ© consiste para que sepĆ”is quĆ© partes podĆ©is tocar y cuĆ”les no.
Como os digo en este tipo de Ćndice no pondrĆa mĆ”s de 4 columnas ni menos de tres. AsĆ que aquĆ tenĆ©is el cĆ³digo para las dos opciones:
ĆNDICE DE 3 COLUMNAS
<table style="font-family: verdana; font-size: 11px; letter-spacing: 3px; margin: 10px auto; text-align: center; text-transform: uppercase; width: 100%; cellpadding="20" cellspacing="10""><tbody>
<tr>
<td style="border: 2px solid #666666; padding: 5px; width: 180px;">texto</td>
<td style="border: 2px solid #666666; padding: 5px; width: 180px;"> texto </td>
<td style="border: 2px solid #666666; padding: 5px; width: 180px;"> texto </td>
</tr>
</tbody></table>
<tr>
<td style="border: 2px solid #666666; padding: 5px; width: 180px;">texto</td>
<td style="border: 2px solid #666666; padding: 5px; width: 180px;"> texto </td>
<td style="border: 2px solid #666666; padding: 5px; width: 180px;"> texto </td>
</tr>
</tbody></table>
ĆNDICE DE 4 COLUMNAS
<table style="font-family: verdana; font-size: 11px; letter-spacing: 3px; margin: 10px auto; text-align: center; text-transform: uppercase; width: 100%; cellpadding="20" cellspacing="10""><tbody>
<tr>
<td style="border: 2px solid #666666; padding: 5px; width: 180px;">texto</td>
<td style="border: 2px solid #666666; padding: 5px; width: 180px;"> texto </td>
<td style="border: 2px solid #666666; padding: 5px; width: 180px;"> texto </td>
<td style="border: 2px solid #666666; padding: 5px; width: 180px;"> texto </td>
</tr>
</tbody></table>
<tr>
<td style="border: 2px solid #666666; padding: 5px; width: 180px;">texto</td>
<td style="border: 2px solid #666666; padding: 5px; width: 180px;"> texto </td>
<td style="border: 2px solid #666666; padding: 5px; width: 180px;"> texto </td>
<td style="border: 2px solid #666666; padding: 5px; width: 180px;"> texto </td>
</tr>
</tbody></table>
Como podrĆ©is ver el Ćndice es muy sencillo: texto no muy grande, en letras mayĆŗsculas, una lĆnea en el borde y chinpĆŗn. Sin fondos ni nada, todo muy sencillo (que yo creo que es la mejor opciĆ³n). Aunque en el vĆdeo os lo explico os comento un poquito:
-En color rojo: el tipo de letra. Yo creo que la Verdana quedarĆ” bien en cualquier blog, queremos que se vea, no una tipografĆa con mil historias.
-El color verde: es el tamaƱo de la tipografĆa. En este caso la he puesto en un tamaƱo 11, suficiente para que se vea bien.
-El color azul: es el espacio entre las letras. Si no querƩis espacio poned un 0, si querƩis menos espacio poned 1,2, etc.
-El color naranja: es el ancho de la lĆnea. PodĆ©is aumentar el tamaƱo lo querĆ”is, pero yo no pondrĆa mĆ”s de 3.
-El color amarillo es el color del borde. En este caso tiene un color gris, pero en esta pƔgina podƩis elegir el color que mƔs os guste.
-El color rojillo: es el estilo de la lĆnea. Solid significa lĆnea sĆ³lida, sin puntos ni nada. PodĆ©is cambiarlo por dashed (lĆneas) o dotted (puntitos)
Una vez que hayĆ”is decidido el nĆŗmero de columnas que querĆ©is, tres o cuatro, copiad ese cĆ³digo, el que corresponda y pegadlo en un documento word o en cualquier otro programa de texto. Es ahĆ donde harĆ©is las modificaciones que vosotros querĆ”is: tamaƱos, colores, etc. Y despuĆ©s, guardad ese documento, para tenerlo a mano. Y ahora ya estĆ”is listos, a por el vĆdeo.
Hacer clic en el boton para ir al Video
01-04-2017
Fuente: creativemindly
Publicado por
0 comentarios:
Publicar un comentario