Cambiar el enlace de la cabecera del blog

10 de julio de 2014 41 comentarios ,
Hay quienes crean varios blogs que son parte de un blog principal y desean que al dar click a la cabecera no los dirija a la portada, sino que los lleve a otro blog. Lo que aprenderemos en esta entrada será a cambiar el enlace de la cabecera para que abra otra página, ya sea otro blog, una página estática, o cualquier otra dirección.

Por ejemplo, en este blog de pruebas, si das click en el título del blog abrirá u̶n̶ ̶m̶a̶g̶n̶í̶f̶i̶c̶o̶ ̶y̶ ̶e̶s̶t̶u̶p̶e̶n̶d̶o̶ otro blog.

Para conseguir lo antes mencionado debemos ir a Plantilla | Edición de HTML.
Si el título de tu blog es una imagen busca este código:
<div id='header-inner'>
<a expr:href='data:blog.homepageUrl' style='display: block'>
<img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &quot;_headerimg&quot;' expr:src='data:sourceUrl' expr:width='data:width' style='display: block'/>
</a>
Cambia todo lo que está en color rojo por esto:
href='URL del enlace'

Ahí deberás agregar el link del blog o la página que quieras enlazar.

Si no tuvieras una imagen en la cabecera, o sea, que el título del tu blog sea sólo texto, entonces busca este código:
<b:includable id='title'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<data:title/>
<b:else/>
<a expr:href='data:blog.homepageUrl'><data:title/></a>
</b:if>
</b:includable>
De igual manera cambia lo que está en color rojo por esto:
href='URL del enlace'

En el caso de quienes en el título sólo tienen texto, sabrán que cuando se está en la portada el título no tiene enlace, únicamente cuando se entra a un post. Si quisieras que el título de tu blog tenga enlace aun estando en la portada entonces cambia el código anterior por esto:
<b:includable id='title'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<a href='URL del enlace'><data:title/></a>
<b:else/>
<a href='URL del enlace'><data:title/></a>
</b:if>
</b:includable>


Así de simple podrás cambiar el enlace de la cabecera y hacer que al dar click no muestre la portada del blog, sino que abra otro blog.


41 comentarios en:

" Cambiar el enlace de la cabecera del blog "

  1. Se ve muy interesante Potro. Gracias

    ResponderEliminar
    Respuestas
    1. No sé qué tan interesante sea pero seguro será útil para uno que otro, al menos eso espero :D

      Eliminar
  2. xD Me encanto cuando dijiste "u̶n̶ ̶m̶a̶g̶n̶í̶f̶i̶c̶o̶ ̶y̶ ̶e̶s̶t̶u̶p̶e̶n̶d̶o̶" jajaja por que realmente CiudadBlogger lo es! es estupendo n.n
    Gracias por tu aporte Potro! ;D

    ResponderEliminar
  3. hola potro
    oye, quise hacer lo de esta entrada y no me sale: http://ciudadblogger.com/2010/08/anuncios-rotativos-con-jquery.html

    las imágenes me salen una abajo de la otra, ocupando más espacio en vez de que se hagan con el efecto de transición
    el archivo que hay que descargar lo subí a dropbox y está publico.
    Y las partes que tienen # en el primer código me salen en rojo, pero así lo dejé

    no se cual es el problema, me puedes ayudar?

    me encanta tu blog y siempre me sale lo que explicas, no sé por que ese no me sale :(

    ResponderEliminar
    Respuestas
    1. Hola Mile, ya te he respondido en esa entrada. Saludos.

      Eliminar
  4. Este comentario ha sido eliminado por el autor.

    ResponderEliminar
  5. Hola Potro. Me gustaría recuperar el enlace a la página principal en la cabecera, lo que tienen por defecto todos los blogs. El problema es que algo tan sencillo como esto no puedo hacerlo, seguramente porque llevo años manipulando la plantilla que habré cambiado algo que no debía. El código está en su sitio, pero nada. Si me dices como solucionar esto te estaré muy agradecido. Este es el blog: http://www.profesorfrancisco.es/
    Un saludo

    ResponderEliminar
    Respuestas
    1. Hola, supongo que sí será por todas las modificaciones que has hecho (o así venía la plantilla), yo he revisado el código fuente de tu blog y encuentro la cabecera, incluso encuentro el enlace al título del blog pero no encuentro la razón del porqué no está activo el enlace.
      Lo único que se me ocurre es que localices el <div id='header-wrapper'> y todo ese DIV lo encierres en un enlace que apunte a la portada del blog. Es algo no muy convencional pero podría resultar.

      Eliminar
    2. Muchas gracias por el tiempo dedicado y por responder tan rápido. Probaré a hacer eso que dices y luego te cuento el resultado.

      Eliminar
    3. Hola de nuevo. No funcionó lo de enlazar toda esa parte, pero he visto dónde puede estar el origen del problema. En la pestaña de diseño de blogger no aparece el cuadro de la cabecera (imagen: http://2.bp.blogspot.com/-khL-SAcm5oQ/U_MzUSCCQuI/AAAAAAAAJyk/qQYjEFKM_Wc/s1600/dise%C3%B1o.JPG ) . Por eso te hago otra pregunta: ¿Que puede faltar en el código para que no se reconozca el cuadro de cabecera en el apartado de diseño de blogger. (PD: en agradecimiento a tu ayuda te he puesto un enlace desde mi blog, desde una entrada con PR 3)

      Eliminar
    4. Gracias por el enlace :)
      No te fíes por lo que se ve en la sección Diseño, algunas veces los gadgets no se muestran ahí por diversas razones, ya sea que se haya ocultado intencionalmente aplicando estilos CSS, o que no quepa en esa área y simplemente no se muestre.
      El gadget de la cabecera existe, aparece en el código fuente de tu blog, pero debe haber otra razón por la que no se muestran sus elementos.
      Por cierto, ahora mismo en el código fuente no veo que hayas puesto un enlace al DIV de la cabecera.

      Pd. ¿Has intentado ver si en la plantilla original todo funciona bien?

      Eliminar
  6. Hola de nuevo Potro. Tengo una duda con la cabecera de mi blog,... quisiera poner una imagen de cabecera, pero al ajustarla desde photoshop al tamaño justo me pierde calidad, entonces, me gustaría poder crear la cabecera a mayor tamaño para que la calidad del banner este perfecta y luego poner ajustarla al tamaño del blog desde ¿ccs?. Muchas gracias.

    ResponderEliminar
    Respuestas
    1. Hola, ¿has probado el formato PNG? es un formato que guarda mayor calidad en las imágenes, incluso más que el JPG.
      La imagen de la cabecera se supone que se autoajusta, al menos eso sucede en la mayoría de las plantillas. De cualquier manera, es mejor que trabajes en una imagen que tenga las medidas exactas que necesitas para que no tengas que preocuparte por ajustar nada, es decir, que desde el momento que crees tu documento en Photoshop lo hagas con las medidas justas que tendrá tu cabecera, así el resultado final deberá ser el mismo que en el blog.

      Eliminar
    2. En esta plantilla al darle a la opción de reducir hasta ajustar me hace la imagen muy pequeña, no se ajusta.

      Pero si, utilizando PNG me va mucho mejor, no una muy buena calidad, pero me vale. Muchas gracias de nuevo.

      Eliminar
  7. Hola de nuevo "el potro", me pongo de nuevo en tus manos y espero que como siempre puedas resolver mis problemas.

    Resulta que en mi blog (con dominio personalizado) cuando clikas en la cabecera (como imagen) te lleva a la url original de blogger y no a la personalizada. Probé a hacer lo que explicas en este post pero cuando guardo resulta que me desaparece la cabecera del blog, la verdad no lo entiendo. Tampoco se si para lo que quiero es mejor hacerlo de otra forma.

    Gracias de antemano. Un saludo.

    ResponderEliminar
    Respuestas
    1. Hola alfonso, ¿en cuál blog te sucede eso? ¿en la configuración del dominio añadiste los registros CNAME necesarios o cómo lo configuraste?

      Eliminar
  8. Uffh!! el potro!! pues la verdad es que no entiendo muy bien lo de los CNAME. Vi en foros de blogger que para redireccionar un dominio de una tercera empresa con blogger hablaban de los CNAME pero no llegaba a entender ni a configurarlo de esa forma. Finalmente me fui al canal de youtube de mi empresa del dominio (CDMON) y allí explicaban como redireccionar sin necesidad de los CNAME y así lo hice.

    De todas formas me interesaría todavía mas que la imagen de cabecera no haga nada, ni siquiera se vea el cambio de cursor a la mano cuando pase el ratón por encima, es decir un default , pero en este caso no se como hacerlo. La pagina es miabueloypicasso.com, que realmente es un blogspot maquillado y manipulado y que además es de las antiguas plantillas.

    De nuevo un saludo y muchas gracias.

    ResponderEliminar
  9. Hola "el potro", solucionado!!! solo darte las gracias por tu tiempo y decirte que ya lo tengo, no es necesario que contestes a estos últimos comentarios.

    Gracias nuevamente.

    ResponderEliminar
    Respuestas
    1. Vale, de cualquier manera ojalá consideres configurar adecuadamente el dominio ya que de lo contrario en los resultados de búsqueda (de Google o cualquier otro) aparecerá con la dirección original, es decir, con blogspot.com

      Eliminar
  10. Hola de nuevo Potro, para terminar mi personalización de tu genial plantilla "Bloggerest", me gustaría ponerle un enlace a una palabra de la descripción del blog en la cabecera.
    ¿Es posible?

    Gracias!!!

    ResponderEliminar
    Respuestas
    1. No, la descripción es un "include" que contiene todo el texto de la descripción en conjunto. En todo caso podrías quitar el <b:include name='description'/> y en su lugar poner el texto de la descripción (y el enlace que quieres) manualmente.

      Eliminar
    2. Me aparece 4 veces esa frase en la plantilla. ¿Cuál de ellas es la que tengo que probar a cambiar?

      Gracias Potro!!

      Eliminar
    3. He ido probando, y al final cambiando la última lo he conseguido. Aunque no sé por qué ;)

      Gracias Potro!!!

      A ver si no te doy mucha guerra en un tiempico... ;)

      Eliminar
  11. Hola amigo Potro por favor ayúdame con este problema;
    Mi problema es con las urls de mi blog de blogger, lo que pasa es que al final de todas las urls de mi blog de blogger sale esto #.VHR9bYuG_wk POR EJEMPLO: si con su permiso tomamos la url de esta entrada de su blog saldría así http://www.ciudadblogger.com/2014/07/cambiar-el-enlace-de-la-cabecera-del-blog.html#.VHR9bYuG_wk en ves de salir limpia la url ósea así http://www.ciudadblogger.com/2014/07/cambiar-el-enlace-de-la-cabecera-del-blog.html como puede ver son símbolos, puntos, números y letras que salen al final de la url después de .html que no tienen ningún sentido y que yo denomino basura. Yo he mirado otros blog y a nadie le sale eso. Lo que yo quiero saber es porque me sale eso al final de las urls de mi blog y como hago para que las urls salgan sin eso ósea limpias.
    Le agradezco por su ayuda y me disculpo por tomar su url pero solo era para explicarle mejor. si desea ver las urls de mi blog puede buscar mi blog en google con este nombre: ven a ver tv online.
    ¡Muchas gracias por su ayuda!

    ResponderEliminar
    Respuestas
    1. Hola Alejandro, prueba poner tu blog como privado, guarda los cambios, luego pon de nuevo tu blog como público y mira si eso lo resuelve.

      Eliminar
    2. Hola amigo potro
      le cuento que entre a configuración/básico y en lectores del blog lo puse en “Privada: solo autores de blogs” y guarde los cambios luego lo puse otra ves en “Público” y guarde los cambios pero no funciono porque sigue saliendo los símbolos y letras al final de las urls entonces entre a configuración/básico y en lectores del blog lo puse en “Privada: solo estos lectores” y guarde los cambios luego lo puse otra ves en “Público” y guarde los cambios pero tampoco funciono.
      por favor me puede decir otra forma de solucionar este problema.
      ¡Muchas gracias por su ayuda!

      Eliminar
    3. Ignoro de qué otra forma pueda resolverse. Esos caracteres usualmente aparecen cuando el blog es privado (por eso e sugería el procedimiento anterior) y/o cuando el blog está marcado con contenido para adultos pero no es tu caso. Quizá el el foro de ayuda de Blogger un empleado de Google pueda decirte qué sucede y cómo resolverlo.
      Saludos.

      Eliminar
    4. Bueno amigo potro, permítame le hago la ultima pregunta sobre este tema y no lo molesto mas ¿usted cree que esos símbolos, puntos, números y letras que salen al final de las urls pueden afectar mi SEO de alguna manera?
      Le agradezco mucho por tomarse el tiempo para contestarme.

      Eliminar
    5. No soy experto en el tema de SEO, pero en mi opinión no, no debería interferir.
      Saludos.

      Eliminar
  12. Hola mi corazón!
    Por aquí ando buscando algo similar hasta cierto punto, porque aunque tiene que ver con el enlace del cabezal un blog, en mi caso lo que quiero es que no tenga link.
    Es decir, que al hacer clic en la portada del blog no dirija a ningún lado. Es que agregue un código en mi blog, que al poner el mause encima de los links del blog, se poner un pequeño fondo redondeado en dicho link y este fondo se aplica igualmente en el cabezal de mi bloggi, y no quiero que se vea así..
    Me puedes ayudar please?
    gracias anticipadas.. :)

    ResponderEliminar
    Respuestas
    1. Hola!, son prácticamente los mismos pasos sólo que en lugar de sustituir el link lo eliminarías. Localiza este código:

      <div id='header-inner'>
      <a expr:href='data:blog.homepageUrl' style='display: block'>
      <img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &quot;_headerimg&quot;' expr:src='data:sourceUrl' expr:width='data:width' style='display: block'/>
      </a>


      Y elimina lo que está en negrita.

      Eliminar
  13. Hola, mi problema es que consigo redireccionar la pagina de inicio a una pagina estática, pero también quiero que se vea la pagina principal, "portfolio" la he llamado. Pero cada vez que intento acceder a la página portfolio, me direcciona al incio. Así que no puedo acceder a la lista de entradas. Te djo el enlace del blog, te agradecería mucho la ayuda.
    http://cjimenezcalvo.blogspot.com/p/inicio.html
    Gracias!!

    ResponderEliminar
    Respuestas
    1. Hola Lina, yo no tengo una entrada sobre ello pero te remito a un blog que sí tiene una publicación sobre lo que deseas:
      http://www.oloblogger.com/2013/04/portada-facil-para-blogger.html

      Eliminar
    2. Vaya error más tonto, era muy fácil la solución, pero llavaba tiempo buscando y no había forma, iba a volverme loca! Muchísimas gracias

      Eliminar
  14. Este comentario ha sido eliminado por el autor.

    ResponderEliminar
  15. Hola Potro

    Tengo un problema con el logo de mi blog. Queda muy pequeño y no sé cómo arreglarlo
    No sé si se podría modificar el data:width o similar....
    mi web es www.librosquevoyleyendo.com
    A ver si me das la idea para solucionarlo
    Gracias

    ResponderEliminar

Si tu blog contiene material protegido por derechos de autor habilita tu perfil y deja únicamente el nombre de tu blog, no dejes la dirección del mismo, de lo contrario el comentario será eliminado.

 
Ir Arriba Ir Abajo
I Ciudad Blogger