Si sóis habituales a buscar cosas en Google, habréis observado que junto a los resultados de busqueda,
aparece una pequeña imágen del "autor" de ese artículo, pues bien, en este artículo os describo la forma de hacerlo.
Este sería el resultado
Lo primero sería crear un
perfil de Google+ con
una foto de perfil de primer plano de buena calidad en la que se te reconozca, (esta será la que se muestre en los resultados de búsqueda de Google).
Ahora debemos
añadir las páginas webs donde queremos que salga nuestra foto de autor,
al perfil de Google +, para ello vamos a la
pestaña Perfil, entramos en
editar perfil y en la pestaña donde pone
“colaborador en” añadir las webs.
Una vez finalizado estos pasos,
tan solo nos falta colocar el enlace en nuestros blog, pero este enlace, no es un enlace normal, si no, que deberá
describir el autor del artículo. El nombre debe ser el mismo que el del perfil de Google + para que funcione, pero no solo eso, sino, que el enlace debe dirigirnos al perfil de Google + que tenemos, para ello copiamos la dirección de la barra de direcciones del navegador cuando estemos en el perfil de Google +, y se lo ponemos al enlace, además este enlace debe tener el atributo rel:"author", a continuación os dejo un ejemplo de cómo debería quedar en enlace en código HTML, que es como deberéis crearlo:
Escrito por: <a href="https://plus.google.com/106881662225015745755" rel="author" target="_blank">AntonioHermi</a>
Como observaréis, en
el enlace apuntamos hacia el perfil de Google +, lleva el atributo author, y el texto normal será vuestro nombre, por lo que al mostrarlo en la web se verá lo siguiente:
Escrito por: AntonioHermi
Lo podemos instalar en la plantilla de dos formas diferentes:
1.-
Mediante enlace directo
2.-
Mediante caja de autor
Mediante enlace directo:
.- Copiamos el código anterior (con vuestros datos)y nos dirijimos a:
Plantilla-Edicción de Html-continuar-marcamos( Expandir plantillas de artilugios )
y buscamos mediante f3: <div class='post-footer'> y encima pegamos el código. Guardamos y listo.
Resultado
Escrito por: AntonioHermi
Mediante caja de autor:
Primeramente nos dirijimos a:
Plantilla-Edicción de Html-continuar-marcamos( Expandir plantillas de artilugios ) y buscamos mediante
f3: ]]></b:skin> y justo encima pegamos los estilos con el siguiente código:
/* acerca del autor----------------------------------- */
.acercadelautor {
background: #F7F6F6;
border:1px solid #E1E0E0;
padding-bottom:10px;
margin:5px auto;
padding:10px 5px 5px 10px;
letter-spacing:normal;
font-size:11px; /* Tamaño del texto */
line-height:1.0em;
border-radius:10px;
}
.acercadelautor:hover {
-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, .3);
-moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, .3);
box-shadow: 0px 0px 20px rgba(0, 0, 0, .3);
}
.fn {
font-size:12px;
}
/* fin acerca del autor-------------------------------------- */
Los colores se pueden modificar para adaptarlo a vuestros blog en esta
Tabla de colores.
El segundo paso sería incluir el enlace con la imagen y para ello usamos el siguiente código, donde modificaremos nuestros datos:
<div class='acercadelautor'>
<img alt='' border='0' src='DIRECCIÓN URL DE LA IMAGEN DEL PERFIL' style='float:left; margin:0 10px 10px 0; width:50px; height:50px;'/>
<span class='fn'><b><a href='https://plus.google.com/NUMERO IDENTIFICACION GOOGLE PLUS' rel='author' title='Escrito por TU NOMBRE'>Publicado por TU NOMBRE </a></b></span>
<p>UN BREVE RESUMEN DE TI.</p><p>Me puedes seguir en mi cuenta de <a href='URL DE TWITTER'><span style='font-family: Comic Sans MS; font-weight: bold; color: DeepSkyBlue;'>Twitter</span></a> o contactarme en <a href='URL DE FACEBOOK'><span style='font-family: Comic Sans MS; font-weight: bold; color: Blue;'>Facebook</span></a></p>
</div>
Una vez modificado con nuestros datos, copiamos y y nos dirijimos a:
Plantilla-Edicción de Html-continuar-marcamos( Expandir plantillas de artilugios ) y buscamos mediante
f3:
<div class='post-footer'> y encima pegamos el código.
Guardamos y listo.
Bueno, si habéis realizado todos los pasos correctamente, os saldrá la foto de autor, y empezareis a notar un aumento de visitas, desde que realicéis estos pasos, tardareis 3 o 4 días en empezar a ver que aparece vuestra foto, así que paciencia y ya veréis la diferencia.
Si queréis ver el ejemplo, abrir Google y colocar Amor Sevillista.