Fecha de los posts al estilo Wordpress

Hola, al fin me he acordado de este truco, me lo tenia guardado, pero se me olvido y despues de unos meses me acorde haci que comenzemos:



1.- Nos dirigimos a Opciones-Formato y cambiamos la fecha por la que esta en la penultima opcion.
2.- Ahora en el HTML expandimos los artilugios y pegamos el siguiente codigo antes del /head:

<script>
function date_replace(d){
var da = d.split(' ');
day = "<span class='theDate'>"+da[0]+"</span>";
mon = "<span class='theMonth'>"+da[1].slice(0,3)+"</span>";
year = "<span class='theYear'>"+da[2]+"</span>";
document.write(day+mon+year);
}
</script>

3.- Ahora expandidos los artilugios buscamos el siguiente codigo:

<data:post.dateHeader/>

4.- Y reemplazamos el codigo anterior por este:

<div id='post-date'>
<script>date_replace('<data:post.dateHeader/>');</script>
</div>

5.- Si sos perezoso y no te quieres molestar en crear un estilo para la fecha usa este y lo pones JUSTO antes de ]]></b:skin> (dentro de la plantilla CSS:

div#post-date {
display: block;
float:left; /* set this to right if you want it go to the right */
padding: 1em; /* to keep the text away from the edges */
background-color: #555555; /* you can change this to hold a picture, will make it look nicer */
border: 3px double gray; /* a border to make it look nice */
}

div#post-date span.theDate {
display: block; /* to put this in a different line */
font-size: 3em; /* to make the date stand out */
background-color: transparent; /* to let the background show through */
color: white;
}

div#post-date span.theMonth {
display: block;
font-size: 1em; /* smaller compared to the date */
background-color: transparent;
color: white;
}

div#post-date span.theYear {
display: block;
font-size: 1em; /* smaller compared to the date */
background-color: transparent;
color: white;
}

<script>
function date_replace(d){
var da = d.split(' ');
day = "<span class='theDate'>"+da[0]+"</span>";
mon = "<span class='theMonth'>"+da[1].slice(0,3)+"</span>";
year = "<span class='theYear'>"+da[2]+"</span>";
document.write(day+mon+year);
}
</script>

Proximamente como comentar en blogger no siendo posible

---

Escuchar post

---

Eliminar el numero de etiquetas

En la lista de etiquetas de Blogger por defecto se muestra la cantidad de entradas que han sido clasificadas en cada una de ellas y por estética o espacio algunas personas me han consultado para saber como eliminarlas. Hacerlo es sencillo y rápido y aquí lo mostramos para quien lo desee:

• Entrar a la pestaña “Plantilla” y posteriormente a la opción “Edición HTML”.
• Activar la opción de “Expandir plantillas de artilugios.
• Buscar y eliminar el siguiente código:

(<data:label.count/>)

• Guardar los cambios y ¡Listo!

En lo particular me agrada que se muestre la cantidad de entradas, pero queda a gusto y necesidades de cada quien.

Poner boton único en las entradas

Para que agreguen nuestro blog con un click a cualquier marcador social (o al menos, a una buena compilación), Get your botton nos proporciona una elegante manera, sin salir de nuestro blog.



Para conseguir tu botón, haz clic en "Get Your Button". También tendrás acceso a las estadísticas de marcación de tu blog. Escoge el botón que prefieres, indica dónde lo vas a poner (en mi caso, un blog de Blogger), y el siguiente paso es registrarte con tu correo y una contraseña.

Puedes agregarlo directamente como un widget, si quieres colocarlo en tu sidebar. Pero también puedes (y tienen la amabilidad de explicártelo ellos mismos) colocarlo al final de cada entrada, un buen lugar, dado que si al lector le ha gustado lo que ha leído, puede marcarlo a continuación.

Para ello, y con la plantilla de artilugios expandida, hemos de pegar el código a continuación de UNA de estas líneas, que indican la parte donde aparecen las etiquetas, comentarios, etc.:

<p class='post-footer-line post-footer-line-1'>

<p class='post-footer-line post-footer-line-2'>

<p class='post-footer-line post-footer-line-3'>


Ahora bien: hemos de hacer un pequeño cambio en el código que nos proporciona ADDTHIS para que en Blogger no nos dé error al guardar la plantilla. Consiste en "parsear" o transformar en código el símbolo "&" que aparece dos veces en el script. Sustitúyelo por &amp; para que Blogger lo interprete como debe y puedas guardar la plantilla.

Y nada más, añade tu botón para que podamos agregarte a nuestros favoritos online, y si te ha gustado este artículo y usas estas redes, puedes marcarlo en el botón a continuación .

Imagen Flotante en tu blog

Supongo que os habreis fijado en que, en algunos blogs, hay una imagen bajo, a la derecha de la pantalla, que permanece estática aunque bajeis el scroll. Es lo que se llama imagen flotante. Como veis, he puesto una de prueba en mi blog para que veais un ejemplo de como queda.
Si quereis poner una imagen flotante en vuestro blog sólo teneis que pegar este código antes de </head>:

<a href='http://URL DE TU BLOG.blogspot.com/' style='display:scroll;position:fixed;bottom:0px;right:0px;'><img src='URL DE TU IMAGEN'/>

Nota:En el código de rojo tienes que sustituir don de pone lo de url.....

Mejora la zona de comentarios de tu blog

En muchos posts la parte de comentarios es casi tan importante como el artículo en sí. Por tanto merece la pena tomarte tu tiempo en construirla lo más amigable posible y tan atractiva como el resto del blog. Estas son algunas ideas que podrías tener en cuenta.
 1.- Separa claramente cada comentario bien con un borde alrededor, añadiendo color al fondo o incluyendo una línea entre cada uno
2.- Haz que se diferencien los datos del comentario (autor, fecha, link permanente… etc) del comentario en sí, dándole un estilo diferente. Usando combinaciones diferentes de fuentes, color o fondo. También puedes tratar de poner los datos en un lado de forma que no se encuentren en la línea del comentario.
3.- Si rellenas el fondo del comentario con un color, haz que el siguiente comentario se alterne con una versión distinta de ese color con el fin de diferenciarlos. Puedes poner por ejemplo el fondo en verde y el siguiente comentario en verde más clarito, el siguiente comentario aparecerá nuevamente en el verde principal y así sucesivamente.
4.- Añade un número al comentario para que la gente pueda hacer referencia a él en los suyos.
5.- Diferencia el comentario del autor para que los lectores pueden ver fácilmente su participación en la conversación. Añade un fonfo distinto, un borde de otro color o puedes añadir una etiqueta que diga, "Comentario del autor."
6.- Puedes añadir avatares para animar un poco los comentarios y dar a tus comentaristas algo más de reconocimiento.
7.- Añade links permanentes a cada comentario para que la gente puede enlazarlos bien en sus comentarios o desde otra web.
8.- Puedes añadir algún elemento gráfico usando iconos. Como una nube donde se encuentre la fecha o un icono al lado del nombre de los autores de los comentarios.
9.- Muestra cuántos comentarios se han escrito en la cabecera de los comentarios. Por ejemplo "5 Comentarios escritos. Añade el tuyo".
10.- Añade una previsualización al formulario de comentarios de forma que los que los escriban puedan ver como se verá mientras lo escriben. Esto es bastante útil para comprobar que los enlaces funcionan.
11.- Incluye la posibilidad de que los lectores se suscriban a los comentarios via RSS.
Estas ideas no son ni mucho menos definitivas, puedes darte una vuelta por diferentes webs y comprobar lo que han hecho. Existen diseños realmente originales y las posibilidades son ilimitadas.

Mejorar posicion en google de tu títulos

Ésta técnica no es mía y tampoco la he probado pero me parece interesante y probablemente valga la pena saber qué tal funciona a la hora de posicionar los posts del blog.

¿De qué hablo? Nos lo cuenta en SEOmoz Rand Fishkin. Hace poco comenté que Google ya te permite conocer el número de búsquedas de una palabra clave a través de su herramienta de Adwords.

Esto nos permite conocer que términos son los más utilizados por las personas en el buscador. Pues ahora se trata de sacarle provecho. Imagina que escribes un artículo acerca de cómo hacer que un blog posicione mejor en los buscadores. Bien, ya tienes uno de los mejores posts que nunca has escrito que además piensas, va a ser realmente útil para tus lectores y para los futuros visitantes del blog. Claro que, para que éstos últimos lo lean, tienen que encontrarlo. En ese momento te entran dudas de cual sería el mejor título que podrías ponerle para que posicione de la mejor manera posible en los buscadores.

Después de una fructífera “tormenta de ideas” se te han ocurrido varios pero todavía no sabes por cual decantarte. ¿Qué puedes hacer? Te acuerdas entonces que Google te da una idea aproximada, a través de su herramienta de Adwords, de cuántas veces buscan los usuarios de su buscador determinados términos.

Después de introducir varias palabras que tenías en mente Google te muestra cuáles pueden servir mejor a tu propósito y que quizá puedas incluir en el título de tu post.

Es importante aclarar ciertos puntos, en primer lugar no se trata de llenar los títulos de palabras clave dado que éstos tienen que ser a su vez descriptivos para los visitantes, es decir, no escribas para los buscadores sino para las personas. El punto clave radica en saber combinar el uso de palabras importantes con títulos efectivos.

En otras ocasiones, cuando las palabras están muy competidas, es decir, generan un enorme número de resultados, incluirlas, o no, no variará en exceso los resultados por lo que no tiene sentido intentar encajarlas de cualquier forma.

Recuerda que los títulos “describen el artículo y son el reclamo de los clicks”, por eso primero piensa en los usuarios, luego busca palabras clave que puedas incluir sin que quede extraño y cuando creas que te ha quedado bien, pincha en “Publicar”.

¿Qué tipo de fuente usar?

   Una parte fundamental de la usabilidad de un blog es su facilidad para ser leído. Además de otros aspectos del diseño y del formato que veremos más adelante, el tipo de fuente que usemos influirá en gran medida en lograr una lectura agradable para los ojos de nuestro visitante. Debemos pensar que la mayoría de los usuarios de Internet no se han adaptado todavía a la lectura en pantalla con lo cual, nuestra tarea debe ser facilitar al máximo dicha lectura.
Un blog cuya composición es de un 90% de texto la elección del tipo de fuente no es vanal. No obstante, mientras sigamos una serie de pautas y estándares el proceso no tiene porque ser excesivamente tedioso.
Las principales características que deberíamos tener en cuenta a la hora de elegir una fuente son:
- Que se ajusten al carácter de tu sitio.
- Facilidad de lectura en la pantalla del ordenador.
- Estén disponibles en diversos navegadores y sistemas operativos.

1.Tipos de fuentes.
Las fuentes podemos dividirlas en dos grandes grupos: serif, sans-serif
La diferencia entre una y otra radica en que las serifs tienen unas pequeñas rayas horizontales arriba y abajo, como pequeños rabitos. Un ejemplo de serif sería, Times New Roman y de sans-serif sería Arial.
En términos generales los usuarios consideran más fáciles de leer las fuentes sans-serif.
2.Tamaño de fuentes.
El tamaño medio de fuente usado en las webs es de 12px (size=3). Una cosa que parece clara es la contraindicación de usar fuentes excesivamente pequeñas, 9px. Desaconsejado además por el W3C. Lo ideal sería ofrecer al usuario la posibilidad de ajustar el tamaño de fuente a su necesidad, no obstante, en muchos blogs ofrecer ésta opción no es posible.
3. Análisis de diferentes fuentes.
- Arial
Es probablemente el formato de fuente sans-serif más común, su disponibilidad es amplia.
Es una de las fuentes más utilizadas, pero pierde calidad en tamaños pequeños, su carácter es moderno pero puede resultar algo plano y aburrido.
Su equivalente en Mac es Helvetica.
- Times New Roman
Su disponibilidad también es amplia y es el formato serif más común. Es la fuente predeterminada de los navegadores.
Su facilidad de lectura es aceptable para tamaños de fuente desde los 12px arriba pero nefasta para tamaños menores.
Su carácter es serio, formal y un poco anticuado.
El equivalente en Mac es Times.
- Verdana
Es una fuente sans-serif con alta disponiblidad, se incluyó con Internet Explorer 3, cuando se hacía necesario un tipo de fuente de mayor facilidad de lectura
Su lecturabilidad, por tanto, es excepcional incluso en tamaños pequeños.
Su carácter es moderno, amigable y profesional.
- Georgia
Su disponibilidad es buena, se introdujo con IE4.
Su facilidad de lectura es muy buena, es la mejor fuente serif para leer online dado que se creó con ese propósito.
Su carácter es moderno, profesional y amigable.
Existen otras fuentes como Comic Sans, cuya lectura es buena, no obstante, no parece indicada para dotar de un carácter serio a tu blog, además de ser una fuente un poco detestada por los diseñadores. Trebuchet es parecida a Arial y difícil de leer en tamaños pequeños. Por último, Courier New, es una fuente serif que imita a las máquinas de escribir antiguas y sule usarse para representar código HTML.
Conclusiones.
Parece que la mejor fuente para usar en la web podría ser tanto Verdana como Georgia, no obstante la decisión depende mucho de tí y en las preferencias de los usuarios que puedes ver en el gráfico obtenido de Usability News.

La longitud de la barra indica mayor preferencia entre los usuarios.

Las 8 preocupaciones de google

El todopoderoso Google también tiene sus preocupaciones y así lo describen en ZDNet.com a raíz del artículo “Un buscador que se está convirtiendo en inventor ” del New York Times.
Éstos son los riesgos a los que se enfrenta Google según Google.
1) Las nuevas tecnologías pueden bloquear nuestros anuncios y perjudicar nuesto negocio.
2) Podemos tener dificultades escalando y adaptando nuestra arquitectura existente para acomodarla al crecimiento del tráfico, avances tecnológicos o cambios en los requerimientos de negocio. Lo que puede conducir a la pérdida de usuarios, de publicistas y de miembros de la red de Google, y hacernos incurrir en costos para realizar los cambios necesarios.

3) Dependemos de los proveedores de ancho de banda, data centers y de otros terceros en aspectos clave en la provisión de productos y servicios a nuestros usuarios. Cualquier fallo o interrupción en los servicios de éstos terceros puede afectar a nuestra capacidad operativa y dañar nuestra reputación.
4) Documentos con formato tipo Microsoft Word (Proprietary Document Formats) pueden limitar la eficacia de nuestra tecnología de búsqueda, al ser incapaz de acceder al contenido de los documentos con ese formato.
5) Los index spammers pueden dañar la integridad de nuestros resultados de búsqueda, lo que puede perjudicar nuestra reputación y provocar insatisfacción entre nuestros usuarios.
6) Las diferentes legislaciones repecto a la recolección de datos de nuestros usuarios y su privacidad, pueden afectar a nuestra capacidad a la hora de ofrecer diferentes servicios.
7) Cada vez más personas utilizan dispositivos que no son PC´s para acceder a internet. Las versiones de nuestra web desarrolladas para éstos dispositivos pueden no estar lo suficientemente adaptadas para sus usuarios. Si no somos capaces de atraer y retener un número sustancial de éstos usuarios perderemos una porción creciente del mercado de los servicios online.
8)Si no conseguimos detectar clics fraudulentos o inválidos, nos enfrentaremos a posibles litigios, así como, a la pérdida de la confianza de nuestros anunciantes, lo que podría hacer que nuestro negocio se resintiera.

Menu horizontal

Os dejo este maravilloso menú horizontal, en el cual podréis modificar los sub-menús y todas las pestañas:


[1] Añadimos el código CSS necesario desde "Edición HTML" en nuestro panel sin expandir la plantilla de artilugios, justo antes de ]]></b:skin>:

/* MENU DOS (Robs)
----------------------------------------------- */

#subnavbar {
background: #64343C;
width: 873px;
height: 27px;
font-weight:bold;
color: #FFFFFF;
margin: 0px;
padding: 0px;
font-family:"Trebuchet MS";
}

#subnav {
margin: 0px;
padding: 0px;
}

#subnav ul {
float: left;
list-style: none;
margin: 0px;
padding: 0px;
}

#subnav li {
list-style: none;
margin: 0px;
padding: 0px;
}

#subnav li a, #subnav li a:link, #subnav li a:visited {
color: #FFFFFF;
display: block;
font-size: 11px;
text-transform: uppercase;
margin: 0px 0px 0px 0px;
padding: 5px 10px 5px 10px;
border-left: 1px solid #FFFFFF;
}

#subnav li a:hover, #subnav li a:active {
background: #999999;
color: #000000;
display: block;
text-decoration: none;
margin: 0px 0px 0px 0px;
padding: 5px 10px 5px 10px;
}

#subnav li li a, #subnav li li a:link, #subnav li li a:visited {
background: #64343C;
width: 120px;
heigth: 20px
float: none;
margin: 0px;
padding: 5px 10px 5px 10px;
border-bottom: 1px solid #FFFFFF;

border-left: 1px solid #FFFFFF;
border-right: 1px solid #FFFFFF;
}

#subnav li li a:hover, #subnav li li a:active {
background: #999999;
margin: 0px;
padding: 5px 10px 5px 10px;
}

#subnav li {
float: left;
padding: 0px;
}

#subnav li ul {
z-index: 9999;
position: absolute;
left: -999em;
height: auto;
width: 160px;
margin: 0px;
padding: 0px;
}

#subnav li li {
}

#subnav li ul a {
width: 140px;
}

#subnav li ul a:hover, #subnav li ul a:active {
}

#subnav li ul ul {
margin: -25px 0 0 161px;
}

#subnav li:hover ul ul, #subnav li:hover ul ul ul, #subnav li.sfhover ul ul, #subnav li.sfhover ul ul ul {
left: -999em;
}

#subnav li:hover ul, #subnav li li:hover ul, #subnav li li li:hover ul, #subnav li.sfhover ul, #subnav li li.sfhover ul, #subnav li li li.sfhover ul {
left: auto;
}

#subnav li:hover, #subnav li.sfhover {
position: static;
}

Es en este código donde podemos hacer los cambios para escoger otro color diferente para el menú por ejemplo, cambiando los códigos de color en "background".

Lo principal a tener en cuenta es la anchura del menú, que está establecida en 873px en esta parte del código (señalado en negrita):

#subnavbar {
background: #64343C;
width: 873px;
height: 27px;
font-weight:bold;
color: #FFFFFF;
margin: 0px;
padding: 0px;
font-family:"Trebuchet MS";
}

Ahí tendréis que cambiar ese valor (873px) por el que mejor se adapte al sitio donde irá colocado. Si vais a ponerlo debajo de la cabecera, lo más adecuado será que tenga el mismo ancho que esta por ejemplo.
También podéis sustituir el valor en pixeles por un porcentaje, así si ponéis "width: 100%" el menú ocupará el ancho total disponible del sitio donde esté colocado.

[2] Colocamos ahora el código necesario para armar nuestro menú en un gadget HTML que arrastraremos luego a donde vayamos a mostrar el menú:

<div id="subnavbar">
<ul id="subnav">

<li><a href="URL DEL BLOG" title="Inicio">INICIO</a>
</li>
<li><a href="" title="">PESTAÑA1</a>
<ul>
<li><a href="" title="">SUB-PESTAÑA1</a>
</li>
<li><a href="" title="">SUB-PESTAÑA1</a>
</li>
<li><a href="" title="">SUB-PESTAÑA1</a>
</li>
</ul>
</li>
<li><a href="mailto:" title="Enviame un email">CONTACTO</a>
</li>
<li><a href="" title="">PESTAÑA2</a>
<ul>
<li><a href="" title="">SUB-PESTAÑA2</a>
</li>
<li><a href="" title="">SUB-PESTAÑA2</a>
</li>
<li><a href="" title="">SUB-PESTAÑA2</a>
</li>
</ul>
</li>
<li><a href="" title="">PESTAÑA3</a>
<ul>
<li><a href="" title="">SUB-PESTAÑA3</a>
</li>
<li><a href="" title="">SUB-PESTAÑA3</a>
</li>
</ul>
</li>
<li><a href="" title="">PESTAÑA4</a>
<ul>
<li><a href="" title="">SUB-PESTAÑA4</a>
</li>
<li><a href="" title="">SUB-PESTAÑA4</a>
</li>
</ul>
</li>
<li><a href="" title="">PESTAÑA5</a>

<ul>
<li><a href="" title="">SUB-PESTAÑA5</a>
</li>
<li><a href="" title="">SUB-PESTAÑA5</a>
</li>
<li><a href="" title="">SUB-PESTAÑA5</a>
</li>
<li><a href="" title="">SUB-PESTAÑA5</a>
</li>
</ul>

</li></ul></div>

Es en este código donde tenemos que colocar los enlaces y el texto que aparecerá en cada pestaña del menú y de los sub-menús.

Donde dice a herf= se coloca cada enlace entre las comillas.
Entre las comillas de title= colocamos el texto explicativo que se verá al pasar el puntero sobre el enlace.
En PESTAÑA1, PESTAÑA2, etc. colocamos el texto que se verá en cada pestaña del menú y en SUB-PESTAÑA1, SUB-PESTAÑA2, etc. el texto que se verá en cada sub-menú.


Para añadir más pestañas y subpestañas al menú, fijaros muy bien en como está construido el código:

El contenido de las pestañas que no van a incluir subpestañas, va incluido entre <li> y </li>

<li><a href="URL DEL BLOG" title="Inicio">INICIO</a></li>

El contenido de la pestaña que incluirá subpestañas irá incluido entre <li> y <ul> a continuación estarán las subpestañas (cada una incluida entre <li> y </li>) y para cerrar terminaremos con </ul> </li>


<li><a href="" title="">PESTAÑA3</a><ul>
<li><a href="" title="">SUB-PESTAÑA3</a></li>
<li><a href="" title="">SUB-PESTAÑA3</a></li>
</ul>
</li>

Boton leer más

Me lo han preguntado unas cuantas veces y ya que ayer me lo recordaron de nuevo, voy a explicarlo.
Tengo que decir que muchos trucos de este tipo podéis encontrarlos en la propia ayuda de Blogger, aunque también he de decir, que en este caso no está bien explicado y si sigues lo que dicen no funciona.

Vayamos por parte entonces:
Lo primero que debemos hacer es modificar la plantilla, “Plantilla -> “Edición de HTML”, como siempre antes de realizar cualquier cambio realiza una copia de seguridad. Debes “Expandir plantillas de artilugios” y localizar el texto siguiente: <div class=’post-body’>
Una vez localizado incluye debajo el siguiente código:

<b:if cond='data:blog.pageType == "item"'> 
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>

Una vez hecho sólo tienes que localizar el siguiente texto: <data:post.body/> y añadir justo después:

<a expr:href='data:post.url'>Leer más...</a>
</b:if>

El resultado final debería ser el siguiente:

<div class='post-body'>

<b:if cond='data:blog.pageType == "item"'> 
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>
<p><data:post.body/></p>

<a expr:href='data:post.url'>Leer más...</a>
</b:if>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>

En rojo está lo que hemos añadido. Ahora sólo tienes que guardar la plantilla.
Para dividir los posts hay que añadir una etiqueta en las entradas que define cuál quieres que sea el extracto de la entrada que se muestre antes del “Leer más”.
Para ello sólo tienes que escribir el texto inicial y el resto encerrarlo dentro de:

<span class="fullpost"> <---Segunda parte del texto ---> </span>

De manera que, si en el área de creación de entradas de Blogger escribieras lo siguiente:

Texto inicial
<span class="fullpost">
Texto secundario
</span>

En tu blog aparecería lo siguiente:
Texto inicial
Leer más…
Y al pinchar aparecería, “Texto Inicial” seguido de “Texto secundario”.
Incluir la etiqueta automáticamente.
Existe también la posibilidad de, que por defecto y para no tener ni que acordarte ni que escribirlo una y otra vez, hacer que la etiqueta aparezca automáticamente cada vez que quieras crear una entrada.
Simplemente vas a “Opciones -> Formato” y en en el cuadro de texto de “Plantillas de entrada” añades <span class=”fullpost”> </span> y guardas los cambios. Ahora cada vez que abras el editor aparecerá automáticamente la etiqueta.

Efecto esquina doblada(solo blogs CSS)

En este post os dejaremos un truco muy vistoso con un efecto esquina doblada para tus post y entradas:

En plantilla edición de HTML podemos encontrar algo así:

.post {

margin:.5em 0 1.5em;

border-bottom:0px dotted $bordercolor;

padding-bottom:1.5em;

}

Es el sitio indicado para añadir una imagen de fondo o color en los post y en este caso el efecto de esquina doblada, tendremos que eliminar lo anterior y en su lugar añadimos:

.post {
background:#ccc;/* color del post */
color: #333; /* color del texto */
margin: 2em auto;
overflow: hidden;
padding: 1em 1.5em;
position: relative;
width: 580px; /* ancho del post*/
}
.post:before {
content:"";
position:absolute;
top:0;
right:0;
border-width:0 40px 40px 0;
border-style:solid;
border-color:#fff #fff #333 #000;/* color borde y pestaña */
background:658E15;
/* sombra pestaña opcional*/
-webkit-box-shadow:0 2px 2px rgba(0,0,0,0.3), -2px 2px 2px rgba(0,0,0,0.2);
-moz-box-shadow:0 2px 2px rgba(0,0,0,0.3), -2px 2px 2px rgba(0,0,0,0.2);
box-shadow:0 2px 2px rgba(0,0,0,0.3), -2px 2px 2px rgba(0,0,0,0.2);
}

En vista previa ya podemos ver el resultado, si deseamos usar nuestros propios colores sólo debemos sustituirlos, para facilitar la tarea en el mismo código está indicado el lugar para hacerlo.

47 buenos consejos sobre blogs

Aquí os dejo los 47 mejores consejos para conseguir que vuestro blog sea visto y leído por todos y todas.

● actualizaciones frecuentes, las buenas obras, y la personalidad - la cooperación de estos factores es crítica. Si no se puede actualizar con regularidad (no necesariamente todos los días, pero tienen un plan fijo), el blog es difícil establecer la cantidad de influencia y de acceso.

　　● Si la gente a encontrar el valor del trabajo, que le perdone por los errores de ortografía. Pero si usted no puede mantener el nivel de trabajo, el tráfico disminuirá.

　　● No tiene que preocuparse sobre a quién leer, acaba de escribir sus temas de interés. No para complacer a otros, para concentrarse en algo que creo que es interesante.

　　● El ajuste del intervalo. Tenga en cuenta lo mucho que cómodamente puede compartir las cosas por su cuenta, usted no tiene "todos los responsables". Sólo tiene que decidir qué partes de su vida que están dispuestos a compartir, tratar de encontrar un equilibrio.

　　● Recuerde: todas las cosas que publica Google y otros sitios se encuentran y se archivan. Así que considerar cuidadosamente antes de publicar. Se ha escrito por lo que su sitio ha sido desestimada. Nunca porque "no tiene Internet" y asumir que usted está escribiendo acerca de otras personas (familiares, amigos o compañeros de trabajo) el contenido no se verlos.

　　● sitio Web desde que empecé, mi abuela ha estado mirando, así que he sido para ellos como los lectores son una parte importante de mí. Esto me permite concentrarse en escribir y yo estoy dispuesto a compartir su contenido, y reducir el desorden. Quiero que el sitio para una amplia gama de personas a aceptar.

　　● Una de mis reglas es "No elimine ningún diario." Así que escribir nada, tengo que pensar, seguro de que no se arrepentía de lo que el futuro se ponga para arriba. Por esta razón no se recomienda "tomar para abrir el Tíbet." No quiero despertar al día siguiente para ver, no recuerdo su escritura.

　　Fraser (blogjam.com)

　　● Usted debe ser similar a la apariencia de un blog como un libro, yo quiero ser un placer leer tu blog, así que estoy buscando cosas que me hacen reír de buena fe. Suena simple, lo sé, pero a veces difícil de encontrar.

　　● No trate de satisfacer al lector, no sólo porque "se sintió obligado a escribir" y un diario - sólo escribir cuando se tiene Huayao Jiang.

　　● que no hay encanto personal de las reglas del editor del sitio y prohibiciones. Si te levantas el lunes y el martes que se siente completamente diferentes, el diario debe reflejarlo. Finalmente, usted encontrará su sonido favorito y estilo propio, si escribes algo interesante o divertido, entonces usted tendrá más lectores y más. Usted no necesita impresionar a la gente a propósito.

　　● hablar de trabajo, sólo para evitar la escritura de su comprensión general de las personas. De lo contrario, es muy probable que ofender a algunas personas.

　　● No escriba algo así como "Hoy he hecho una cosa determinada," este artículo, a menos que realmente estás haciendo es muy especial, o usted puede hacer que algunas cosas se vuelven muy especial.

　　● blog en línea como un palo de la mano a su pequeño bar, un registro o para encontrar cosas interesantes por hacer para la carta de este enfoque.

　　● Si alguien mañana para crear un blog, para grabar un celular muy rica cámara gato infancia, estoy totalmente de que habrá un tráfico importante.

　　Glenn Reynolds (instapundit.com)

　　● publica regularmente la revista, encontrar el tema que le interesa, el seguimiento continuo de abajo, por escrito graves (odio lleno de errores ortográficos y gramaticales en el blog.)

　　● educado siempre será recompensado. nombres Humanos primero puede sonar gracioso, pero hará que los lectores más ofensivo.

　　● un blog, seleccione su mayoría de la gente mucho más que conocer el tema - como su ocupación, sus asuntos locales, y así - vamos a ser una parte importante de tu blog.

　　● Cuando usted tiene algo de especial importancia, envía un mensaje a otro blog para que sepan. Ellos le darán el enlace, recibirá a los lectores a visitar.

　　● Usted debe tener una cámara digital. Las fotos serán blog a la vida. Si la foto es buena, realmente será mejor que mil palabras.

　　Robyn Pollman (tampatantrum.com)

　　● Mantenga su propio estilo - no siempre imitar a la gente a tu alrededor copia. Su personalidad debe estar presente en todas partes. Se hace tu único y la representación de "verdadero yo".

　　● Recuerde, incluso si usted piensa que escribir sólo para amigos y familiares, que en realidad tienen los lectores de texto de todo el mundo. Usted no sabe quién, dónde, en qué momento de leer su diario

　　● Cuando mi marido y yo empezamos a escribir el blog, hemos mencionado que muchas veces ir al cine y restaurantes. Imagina que nuestros golpes - los lectores en aquellos lugares que, con la esperanza de reunirse con nosotros - y luego escribir su propio blog en este asunto! Rápidamente aprendió a escribir nuestro plan para hacer después la cosa, y no antes.

　　● Hay que desarrollar una piel más gruesa. estación de blog experimentarán disturbios, el mismo que el foro. Este blog es parte de la experiencia. Como con cualquier actividad física, miles de danza de la audiencia por las normas, todo es color de rosa, pero siempre y cuando un hombre, trajo el caos a los chicos de confusión - el blog de la misma estación. Blog que no pueden hacer frente a estas demasiado personal - aunque a veces esto es difícil de hacer, dependiendo de las circunstancias.

　　Quin Parker (quinparker.com)

　　● Una gran cantidad de personas en el comienzo del tiempo de la escritura no quieren perderse lo que va a escribir.

　　● Las personas no les gusta leer un diario enorme lleno de agravios, que se han visto mucho.

　　● Al igual que todas las otras páginas, como las actualizaciones frecuentes, y poner las cosas interesantes.

　　● Conozca a sus lectores.

　　Hash (iMakeContent.net)

　　● Un buen blog tiene que adaptarse al estilo de su contenido. Blog personal de buenos elementos - tales como una visión muy subjetiva del mundo - se puede utilizar para mostrar el diseño para el blog, ampliada reanudar blog, o proporcionar información sobre el producto a los clientes en términos de el blog de negocios que está mal.

　　● estructura de navegación debe ser simple. Al igual que el diseño de cualquier sitio, lo mejor lejos de el icono parpadea, la música, o difíciles de ver en la pantalla con el color.

　　● blog debe ser escrito de acuerdo a lo que dijo, quieres que la gente a entrar en un lector fijo, por lo que tiene que mantener su promesa. Si se crea un blog de tecnología, sus lectores se sorprenderán por qué empezar a escribir su matrimonio / equipo / el fracaso del Estado cronológico. Por supuesto, ¡el proceso puede llegar a nuevos lectores del blog y luego decidió volver a abrir.

　　● individuales blog, la necesidad de algo diferente. Puede ser de contenido muy útil por ejemplo - para compartir conocimientos dentro de la línea para proporcionar el análisis más reciente, difícil de encontrar en el enlace. Tal vez no es habitual, el punto interesante, profundo de vista.

　　● sitio blog necesidades de la personalidad. sitio de blog debe crecer y cambiar, y responder al mundo que describe.

　　● una planificación cuidadosa. Si el blog se hace bien, puede convertirse en un centro de su vida.

　　● considerar seriamente el nombre del blog. Si desea utilizar las palabras de al menos varios años. Suena divertido y hay cosas interesantes, tal vez mañana será obsoleto. Algo para el día de hoy, tal vez mañana será el estilo de vida vergonzoso.

　　● encontrar el software que usted necesita. Empecé de Blogger, Radio Userland y luego fue trasladado a la ahora muy parecido a utilizar el tipo movible. Cada uno tiene ventajas y limitaciones. Considere lo que usted desea utilizar otro equipo en el blog? ¿Quieres crear un nuevo blog? ¿Qué tipo de servicios de hosting? Considere la posibilidad de su software de procesamiento de imagen que se utiliza, si el blog tiene noticias, qué tipo de agregador de noticias. En general, la actualización de un poco de conocimiento técnico, conocimientos de HTML, para hacer que su equipo de principio.

　　● copia de seguridad de todas las cosas. No confíe en su empresa de alojamiento. Si se cierra, usted tendrá que volver a ejecutar el más rápido. Y definitivamente no quieren perder varios años de escribir diario.

　　● El uso del acceso a Internet de banda ancha. Esto ha cambiado mi forma de blog.

　　● considerar seriamente lo que usted escribió. Usted estará encantado de compartir los detalles íntimos de su vida amorosa. Unos años más tarde, puede que le resulte embarazoso.

　　● Cuando no se divierten en un diario de la época - de parada, tomar un descanso.

　　Adrian Hon (mssv.net)

　　● El verdadero "secreto" es entender la decisión de su blog es su propio éxito, y no en otros. Si usted piensa que un weblog es buena "actualiza varias veces al día, con todos los últimos enlaces, todos los días por miles de personas visitan", entonces es casi seguro que estará decepcionado. Pero si usted piensa que un buen blog es "feliz de escribir sobre una base regular, y por lo menos algunas personas felizmente puede leer," entonces usted va a hacer muy bien.

　　Jason (kottke.org)

　　● utilizar la gramática, ortografía congelación.

　　● No escriba usted no tendrá que volver más tarde, alguien lo utiliza para atacar.

　　● No deje que su blog y pánico a nadie, que siempre aparecen. También, porque la gente realmente leer tu blog y el pánico, puede dejar de escribir, que va a desaparecer!

　　Rannie (photojunkie.org)

　　● Antes de comenzar un blog, asegúrese de que sus límites. ¿Cuánto hay que revelar al alcance de la decisión en sí misma. Después de empezar a blog es fácil cambiar el rango, pero si usted ya ha publicado más de la línea y usted no quiere que nadie vea las cosas, y luego desea establecer los límites muy difícil.

　　● Si quieres traer tráfico a su blog, un blog alojado por participar en otros proyectos como una manera de llamar la atención.