Mil Trucos Blogger

Best Orange – Plantilla para blogger

Deja tu Reacción sobre el artículo
Me Gusta Dichoso Feliz Admirado Triste Enojado
En estos días e estado trabajando en una nueva plantilla para blogger que hoy compartiré con ustedes llamada Best Orange
La plantilla es mayormente de color naranja, con iconos de redes sociales en la parte superior que giran al pasar el cursor, un menú desplegable arriba de las entradas, también incluye el leer más automático en todas las entradas y otras características que la hacen única.

Para modificar los enlaces de los iconos sociales arriba del blog busca en la Edición HTML esto:

<div class=’social-icons’ id=’social-iconos’>
<ul>
<li class=’social_icon’><a href=’#facebook‘><img border=’0’ src=’http://lh3.googleusercontent.com/-9RgnEDN1jFc/UKK9O1S1TPI/AAAAAAAADSk/KOIvtDu-oSM/s36/social-facebook.png’/></a></li>
<li class=’social_icon’><a href=’#twitter‘><img border=’0’ src=’http://lh4.googleusercontent.com/-KtqAlZRCokQ/UKK9PbLsnSI/AAAAAAAADSg/njBnVDn3O9I/s36/social-twitter.png’/></a></li>
<li class=’social_icon’><a href=’#googleplus‘><img border=’0’ src=’http://lh4.googleusercontent.com/-4PWKT-fgHJ8/UKK9O7mGEPI/AAAAAAAADSY/ENZ0BHmO6TY/s36/social-googleplus.png’/></a></li>
<li class=’social_icon’><a href=’#rss‘><img border=’0’ src=’http://lh5.googleusercontent.com/-6hu6NkWouSw/UKK9PIQCrHI/AAAAAAAADSc/5QI5O-H7EYs/s36/social-rss.png’/></a></li>
<li class=’social_icon’><a href=’#youtube‘><img border=’0’ src=’https://lh5.googleusercontent.com/-l-dUM9Ftfx0/UnwyCShDfrI/AAAAAAAACcs/98_EhX55hsI/s1600/social-youtube.png’/></a></li>
<li class=’social_icon’><a href=’#ask‘><img border=’0’ src=’https://lh4.googleusercontent.com/-KUsf7rnBv6o/UnwzJSZugcI/AAAAAAAACc0/AwKQIuSkLAI/s1600/social-ask.png’/></a></li>
<li class=’social_icon’><a href=’#blogger‘><img border=’0’ src=’https://lh6.googleusercontent.com/-GqN0pxxiwB4/UnwzyhrblJI/AAAAAAAACc8/jIn1hOCSMzw/s1600/social-blogger.png’/></a></li>
<li class=’social_icon’><a href=’#pinterest‘><img border=’0’ src=’https://lh5.googleusercontent.com/-_RfK_R561Ms/Unw0jmCGr8I/AAAAAAAACdQ/BEUO8bDIGvE/s1600/social-pinterest.png’/></a></li>
<li class=’social_icon’><a href=’#instagram‘><img border=’0’ src=’https://lh4.googleusercontent.com/-oSl2vipEUaU/Unw0iASbUBI/AAAAAAAACdI/YE7xCIlD5sc/s1600/social-instagram.png’/></a></li>
</ul></div>

Solo reemplaza lo que está en rojo por la URL que indica. Si quieres agregar más iconos, solo agrega arriba del </ul></div> una linea como esta:

<li class=’social_icon’><a href=’URL del enlace‘><img border=’0′ src=’URL de la imagen‘/></a></li>


Para modificar el menú horizontal arriba de las entradas busca esta parte:

<div id=’menuWrapper’>
<ul class=’menu’>
<li class=’top’><a class=’top_link’ href=’URL del enlace‘><span>Pestaña 1</span></a></li>
<li class=’top’><a class=’top_link’ href=’#’><span class=’down’>Pestaña 2</span></a><ul class=’sub’><li><a class=’fly’ href=’#’>Pestaña 2.1</a><ul>
<li><a href=’URL del enlace‘>Pestaña 2.1.1</a></li>
<li><a href=’URL del enlace‘>Pestaña 2.1.2</a></li>
<li><a href=’URL del enlace‘>Pestaña 2.1.3</a></li>
</ul>
</li>
<li class=’mid’><a class=’fly’ href=’#’>Pestaña 2.2</a>
<ul>
<li><a href=’URL del enlace‘>Pestaña 2.2.1</a></li>
<li><a href=’URL del enlace‘>Pestaña 2.2.2</a></li>
<li><a href=’URL del enlace‘>Pestaña 2.2.3</a></li>
<li><a class=’fly’ href=’#’>Pestaña 2.2.4</a>
<ul>
<li><a href=’URL del enlace‘>Pestaña 2.2.4.1</a></li>
<li><a href=’URL del enlace‘>Pestaña 2.2.4.2</a></li>
<li><a href=’URL del enlace‘>Pestaña 2.2.4.3</a></li>
</ul>
</li>
<li><a href=’URL del enlace‘>Pestaña 2.2.5</a></li>
<li><a class=’fly’ href=’#’>Pestaña 2.2.6</a>
<ul>
<li><a href=’URL del enlace‘>Pestaña 2.2.6.1</a></li>
<li><a href=’URL del enlace‘>Pestaña 2.2.6.2</a></li>
</ul>
</li>
</ul>
</li>
<li><a href=’URL del enlace‘>Pestaña 2.3</a></li>
<li><a href=’URL del enlace‘>Pestaña 2.4</a></li>
<li><a href=’URL del enlace‘>Pestaña 2.5</a></li>
</ul>
</li>
<li class=’top’><a class=’top_link’ href=’#’><span class=’down’>Pestaña 3</span></a>
<ul class=’sub’>
<li><a href=’URL del enlace‘>Pestaña 3.1</a></li>
<li><a href=’URL del enlace‘>Pestaña 3.2</a></li>
<li><a href=’URL del enlace‘>Pestaña 3.3</a></li>
<li><a href=’URL del enlace‘>Pestaña 3.4</a></li>
</ul>
</li>
<li class=’top’><a class=’top_link’ href=’#’><span class=’down’>Pestaña 4</span></a>
<ul class=’sub’>
<li><a href=’URL del enlace‘>Pestaña 4.1</a></li>
<li><a class=’fly’ href=’#’>Pestaña 4.2</a>
<ul>
<li><a href=’URL del enlace‘>Pestaña 4.2.1</a></li>
<li><a href=’URL del enlace‘>Pestaña 4.2.2</a></li>
<li><a href=’URL del enlace‘>Pestaña 4.2.3</a></li>
<li><a href=’URL del enlace‘>Pestaña 4.2.4</a></li>
<li><a href=’URL del enlace‘>Pestaña 4.2.5</a></li>
<li><a href=’URL del enlace‘>Pestaña 4.2.6</a></li>
</ul>
</li>
<li><a href=’URL del enlace‘>Pestaña 4.3</a></li>
<li><a href=’URL del enlace‘>Pestaña 4.4</a></li>
<li><a href=’URL del enlace‘>Pestaña 4.5</a></li>
<li><a href=’URL del enlace‘>Pestaña 4.6</a></li>
</ul>
</li>
<li class=’top’><a class=’top_link’ href=’#’><span class=’down’>Pestaña 5</span></a>
<ul class=’sub’>
<li><a href=’URL del enlace‘>Pestaña 5.1</a></li>
<li><a href=’URL del enlace‘>Pestaña 5.2</a></li>
<li><a href=’URL del enlace‘>Pestaña 5.3</a></li>
</ul>
</li>
</ul>
</div>

Solo te queda modificar lo que dice URL del enlace.

Para cambiar la imagen de Read more en las entradas de leer más automático, busca esto:

<div id=’readmore’><img src=’http://4.bp.blogspot.com/-jbTFn7gyBpM/UnrgBI8oKII/AAAAAAAACcA/P65r_D8BRM8/s1600/READ+MORE.png‘/></div>

Y reemplázalo lo que está en rojo por la URL de la imagen que quieres, solo recuerda que tienes que reemplazarlo 3 veces, puesto a que hay 3 de ellos. Si lo que quieres es cambiarlo por un texto (Leer más) borra del <img… hasta …</div> (x3), y reemplázalo por el texto que desees.

Recuerda que esta plantilla esta hecha a base de una del diseñador de plantillas, así que podrás modificar algunas características en el Editor de plantillas.

0
Shares

Relacionados...

Deja tu Reacción sobre el artículo
Me Gusta Dichoso Feliz Admirado Triste Enojado

16 Comentarios

  1. Elclasico Sport Elclasico Sport
    noviembre 8, 2013    

    dicurpa hermano no se mucho de esto de platilla pero en esto dias es hecho canbia con mi platilla y aora en mi blogger me aparesen dos entrada cuando publico una entra aprese en la dos entrada qu tiene el blogger algien que me ayude

  2. Juvinao Juvinao
    noviembre 8, 2013    

    Tal vez tengas duplicado el datapost:body

  3. noviembre 8, 2013    

    Estoy de acuerdo con lo que dice Juvinao, esos errores se presentan cuando haz cambiado mucho la plantilla de tu blog, la solución es que borres los datapost:body que sobran.

  4. Eh no Eh no
    noviembre 9, 2013    

    Cuáles son las etiquetas que añadiste? La principal que veo es el blockquote, cuáles más? o.o

  5. noviembre 9, 2013    

    Al referirte “etiquetas” estas hablando de las categorías.

  6. Juvinao Juvinao
    noviembre 9, 2013    

    Creo que te refieres al estilo css.

  7. Eh no Eh no
    noviembre 9, 2013    

    Nada, olvidalo, ya ví, gracias aún así.

  8. Afasfa Afasfa
    noviembre 9, 2013    

    Muy bonito, aunque me gustaría que hicieses un Chat HTML para blogger q.q

  9. noviembre 10, 2013    
  10. Kicksilver Kicksilver
    noviembre 10, 2013    

    Excelente plantilla, me gusta.

  11. noviembre 10, 2013    

    Que bueno que te guste Kicksilver

  12. Joel Joel
    noviembre 11, 2013    

    Gracias por compartirnos esta hermosa plantilla

  13. noviembre 18, 2013    

    Como puedo cambiar el color del menú horizontal de pestañas? Gracias. Un saludo.

    • noviembre 20, 2013    

      Busca: background:#FF8000; /* Color de fondo */, y cambia #FF8000 por el codigo del color que quieras ponerlo. (o)

  14. enero 29, 2014    

    Hola. Voy a instalar esta plantilla en mi blog, pero necesito que el menú horizontal permita más pestañas. Ahora mismo sólo permite la longitud que tiene, sin meterse en la columna lateral. ¿Es posible cambiarlo y que ocupe todo el ancho del blog? Y que la barra lateral empiece justo debajo. Muchas gracias!

    • febrero 4, 2014    

      Hola Ana un gusto saludarte, bueno…
      Para cambiar el ancho del menú deberás buscar el código #menuWrapper { en los estilos css (si no lo encuentras vuelve a intentarlo borrando el espacio), más abajo podrás encontrar el valor width: 70%;, sustitúyelo por width: 100%;, con eso será suficiente para lograr tu objetivo.

      Un saludo :>)

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Categorías

Síguenos en Facebook

Suscribete por Email

Introduce tu Correo:

Recibiras nuestros últimos posts en tu correo