Tutorial: Personaliza tu Blogger para micronicho + platilla gratuita (Optimizada/Adsense)

Geg1

Kappa
Verificación en dos pasos desactivada
Verificado por Whatsapp
¡Ha verificado su Paypal!
Desde
13 Sep 2013
Mensajes
2.522
Aquí el Tutorial más completo para convertir tu blogger en un micronicho

Empezando, por lo más sencillo: Cosas a eliminar

para eliminar el molesto "Página principal" que vemos al final de cada entrada, haremos lo siguiente:


Iremos a Plantilla>Personalizar>Avanzado>Añadir CSS

y añadiremos lo siguiente:

#blog-pager {visibility:hidden; display:none;}

Seguimos con "Suscribirse a entradas (ATOM)"

Iremos a Plantilla>Personalizar>Avanzado>Añadir CSS

y añadiremos lo siguiente:

.feed-links {
visibility:hidden;
display:none;
}

Para eliminar el "Reconocimiento" que dice: "Con la tecnologia de Blogger":


Iremos a Plantilla>Personalizar>Avanzado>Añadir CSS

y añadiremos lo siguiente:

#Attribution1 {display:none; visibility:hidden;}


Para eliminar la navbar de Blogger:


Iremos a Plantilla>Personalizar>Avanzado>Añadir CSS

y añadiremos lo siguiente:

#navbar-iframe {

height:0px;

visibility:hidden;

display:none

}

Dándole un estilo sencillo y bonito a nuestro blog:

Para bordear la entradas de tu blog y darle un aspecto como este:



.post-outer {
border: 1px solid #000;
border-radius:0px;
-moz-border-radius:0px;
-webkit-border-radius:0px;
padding:15px;
margin: 20px 0;
}
.column-right-outer .widget, .column-left-outer .widget {
border: 1px solid #000;
border-radius:0px;
-moz-border-radius:0px;
-webkit-border-radius:0px;
padding:10px;
margin: 10px 0;
}

Modificando estas dos variables, obtendremos un borde redondeado o default (0px)

-moz-border-radius:0px;
-webkit-border-radius:0px;

Modificando esta variable, hara mas ancho el borde (1 px) y podrás cambiarle el color en #000.

border: 1px solid #000;

Tabla de colores HTML aquí.


Para agregar un acerca del autor (By: ayudarbloggers.com)


Iremos a Plantilla>Editar HTML

y buscaremos esta linea:

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

Abajo de ella, pegamos lo siguiente:


<div class='acercadelautor'>
<img alt='Foto de perfil' border='0' src='URL IMAGEN FOTO' style='float:left; margin:0 10px 10px 0; width:80px; height:80px; border-radius:50px;' title='NOMBRE EXACTO G+'/><a href='URL PERFIL G+?rel=author' target='_blank' title='Perfil en Google Plus'><strong>NOMBRE DE PERFIL VISIBLE:</strong></a>
<p>BREVE DESCRIPCION PERSONAL</p>
</div>

Después iremos a Plantilla>Personalizar>Avanzado>Añadir CSS

y añadiremos lo siguiente:

.acercadelautor {
background: #e7e7e7;
border: 1px solid #ccc;
letter-spacing: normal;
color: #00000;
text-transform: none;
font-size: 14px;
padding: 5px;
margin: 10px 0 20px 0;
}
.acercadelautor strong {
color: #00000;
font-weight: bold;
font-size: 16px;
text-decoration: underline;
}
.acercadelautor a{
color:#00000;
}

Para centrar la Cabecera de BLOGGER:

iremos a Plantilla>Personalizar>Avanzado>Añadir CSS

y añadiremos lo siguiente:

.header .widget {
text-align:center;}
.header img {margin:0 auto;}

★Por último les dejo la plantilla optimizada para los anuncios de Adsense:

https://mega.co.nz/#!UVM32JDB!g88CL_1GWyfIoKW-XT270FiyKt65IszgoHOMwq3PdNk

Para ver un ejemplo de blog:

DEMO

Pronto pondré un ejemplo con adsense.

*COMENTAR ES AGRADECER
*TAMBIEN EXISTE EL BOTON AGRADECER, SI CREES QUE TE GUSTO ESTE TUTORIAL, DALE AL BOTON "Me agrada"
*COMPARTELO EN LAS REDES SOCIALES!
 
Última edición:

Carlos Arreola

Admin
Verificado con videollamada
Verificación en dos pasos desactivada
Verificado por Whatsapp
¡Ha verificado su Paypal!
¡Excelente comerciante!
Desde
6 Abr 2009
Mensajes
4.358
¿Alguna imagen de cómo queda o ejemplo de algún blog así? Se ve interesante
 

Geg1

Kappa
Verificación en dos pasos desactivada
Verificado por Whatsapp
¡Ha verificado su Paypal!
Desde
13 Sep 2013
Mensajes
2.522

Galbatorix

Dseda
Verificación en dos pasos desactivada
Desde
13 May 2013
Mensajes
1.232
No me gustó. Parece copy/paste, los ejemplos no son claros, no se puede ver la demo.

Opino que hay que ser más prolijo al escribir, sobre todo en tutoriales, donde es muy importante asegurar la comprensión. Te pongo por ejemplo esta línea:

y buscaremos esta linea:

dónde el ejemplo no se copió y no sabemos que es lo que hay que copiar.

El concurso de tutoriales no es un sorteo, se trata de aportar contenido de calidad no ir por el dinero como a una rifa. Tu aporte falla en muchos aspectos básicos y no se logra el objetivo del tutorial que es acrecentar un conocimiento o mejorar una habilidad.

Te dejo una estrellita, y no te desanimes, esperaremos que tus próximos aportes tengan la calidad necesaria para competir.
* * * * *
 

Geg1

Kappa
Verificación en dos pasos desactivada
Verificado por Whatsapp
¡Ha verificado su Paypal!
Desde
13 Sep 2013
Mensajes
2.522
No me gustó. Parece copy/paste, los ejemplos no son claros, no se puede ver la demo.

Opino que hay que ser más prolijo al escribir, sobre todo en tutoriales, donde es muy importante asegurar la comprensión. Te pongo por ejemplo esta línea:



dónde el ejemplo no se copió y no sabemos que es lo que hay que copiar.

El concurso de tutoriales no es un sorteo, se trata de aportar contenido de calidad no ir por el dinero como a una rifa. Tu aporte falla en muchos aspectos básicos y no se logra el objetivo del tutorial que es acrecentar un conocimiento o mejorar una habilidad.

Te dejo una estrellita, y no te desanimes, esperaremos que tus próximos aportes tengan la calidad necesaria para competir.
* * * * *

He modificado para poner la web demo desde mi movil y se me ha jodido en post :(



Enviado desde mi GT-I8190L mediante Tapatalk
 

GatoRyuzaki

Dseda
Verificación en dos pasos desactivada
Desde
3 Mar 2013
Mensajes
1.137
Si no me equivoco la url del demo es esta.
Para la otra guarda el post en borrador :s
 

pedro salinas

Ómicron
Verificación en dos pasos desactivada
Desde
20 Feb 2010
Mensajes
4.880
Esa url que pasastes esta en wordpress :distant:
 

miguel0n

Delta
Redactor
Verificación en dos pasos desactivada
Desde
14 Feb 2014
Mensajes
677
MUy cencillo no pasa nada
 

Geg1

Kappa
Verificación en dos pasos desactivada
Verificado por Whatsapp
¡Ha verificado su Paypal!
Desde
13 Sep 2013
Mensajes
2.522
Uf bueno disculpen es que estoy desde el cel..

La demo es: www. lasuñasdegel .com

No funciona aqui por conflicto con la ñ

Enviado desde mi GT-I8190L mediante Tapatalk

---------- Post agregado el 13-may-2014 hora: 12:34 ----------

No me gustó. Parece copy/paste, los ejemplos no son claros, no se puede ver la demo.

Opino que hay que ser más prolijo al escribir, sobre todo en tutoriales, donde es muy importante asegurar la comprensión. Te pongo por ejemplo esta línea:



dónde el ejemplo no se copió y no sabemos que es lo que hay que copiar.

El concurso de tutoriales no es un sorteo, se trata de aportar contenido de calidad no ir por el dinero como a una rifa. Tu aporte falla en muchos aspectos básicos y no se logra el objetivo del tutorial que es acrecentar un conocimiento o mejorar una habilidad.

Te dejo una estrellita, y no te desanimes, esperaremos que tus próximos aportes tengan la calidad necesaria para competir.
* * * * *

He arreglado los problemas y está la demo online!

pasate y mira!

Saludos

---------- Post agregado el 13-may-2014 hora: 14:51 ----------

@pedro salinas;
[MENTION=18257]epsilo99[/MENTION]
[MENTION=41405]GatoRyuzaki[/MENTION]


Agregada la DEMO! Saludos y espero sus comentarios
 
Última edición:

Geg1

Kappa
Verificación en dos pasos desactivada
Verificado por Whatsapp
¡Ha verificado su Paypal!
Desde
13 Sep 2013
Mensajes
2.522
Que les parecio? :( le e puesto mucho empeño a este tutorial, y asi se basan mis plantillas para nichos

Enviado desde mi GT-I8190L mediante Tapatalk
 

kibrot

Dseda
Verificación en dos pasos desactivada
Desde
10 Dic 2012
Mensajes
1.104
Esperaré el ejemplo con adsense para probarla en uno de mis blogs
 

Allan Cano

Iota
Exchanger
Verificación en dos pasos desactivada
Desde
26 Feb 2014
Mensajes
2.020
Al fin lo implemente y quedo perfecto. Excelente post bastante bueno :p8:.
 

spitfire

Épsilon
Verificación en dos pasos desactivada
Desde
20 Feb 2013
Mensajes
902
Muy buen tuto Geg1 , justo estaba buscando para eliminar el reconocimiento de Con la tecnologia Blogger, pero tengo una duda, nos puede perjudicar borrar el reconocimiento? G no nos podria borrar el blog de un dia para el otro? gracias.
 

Geg1

Kappa
Verificación en dos pasos desactivada
Verificado por Whatsapp
¡Ha verificado su Paypal!
Desde
13 Sep 2013
Mensajes
2.522
Muy buen tuto Geg1 , justo estaba buscando para eliminar el reconocimiento de Con la tecnologia Blogger, pero tengo una duda, nos puede perjudicar borrar el reconocimiento? G no nos podria borrar el blog de un dia para el otro? gracias.
no para nada1!jaja

Enviado desde mi GT-I8190L mediante Tapatalk
 

spitfire

Épsilon
Verificación en dos pasos desactivada
Desde
20 Feb 2013
Mensajes
902
Ok, gracias, tengo dos sugerencias que podrias agregar a tu tuto, no se como se hacen, pero tal vez tu si y yo estoy necesitando eso para agregarlo a mi blog

1-En la barra vertical de navegacion agregue varios enlaces a las distintas etiquetas y asi parece que fueran categorias
pero me gustaria saber como hacer para que al ver las etiquetas por ejemplo hosting se mostrara arriba de las entradas de esa categoria una leyenda diciendo Articulos en la categoria hosting y asi sucesivamente para todas las categorias creadas con las etiquetas

en este mismo punto debo destacar que al no haber entradas en la categoria seleccionada muestra una leyenda que dice
No hay ninguna entrada con la etiqueta gomerias. Mostrar todas las entradas

perio quedaria mejor modificarlo para que se leyera
No hay ningun articulo en la categoria gomerias.


como se podria hacer?

2-Como puedo hacer para que en la pagina pincipal del blog, antes de las entradas se muestre una pequeña descripcion del sitio, a modo de presentacion del mismo?

muchas gracias, espero que te sirva mi sugerencia, spitfire.


no para nada1!jaja

Enviado desde mi GT-I8190L mediante Tapatalk
 

Abraham777

Beta
Verificación en dos pasos desactivada
Desde
12 Jul 2014
Mensajes
44
Me ha encantado el tuto, pero el efecto de los bordes redondeados no funciona :mad:

Me gustaria ver si alguien lo puede probar con adsense.

Saludos.
 

Valentozer

Baneado
Gamma
Verificación en dos pasos desactivada
Desde
21 Jun 2014
Mensajes
364
Muy bueno!!

¿Que es mejor para hacer un micronicho, wordpress o blogger?
Casi todo lo que he visto ha sido con wordpress y muy poca gente tira al blogger.
 

Crea una cuenta o accede para comentar

Debes ser un miembro para poder comentar

Crear cuenta

Crea una cuenta en nuestra comunidad

Acceder

¿Ya tienes una cuenta? Accede aquí


Arriba