Aspire. Añadir una descripción al título. | Oloblogger Seguimos con problemillas solventables de la plantilla Aspire. En esta ocasión, queremos añadir una descripción al título del blog. Esto vie...

11 de febrero de 2009

Aspire. Añadir una descripción al título.

Seguimos con problemillas solventables de la plantilla Aspire.

En esta ocasión, queremos añadir una descripción al título del blog. Esto viene a ser como un lema o un subtítulo que suele acompañar en Blogger al nombre del blog. Es el caso de "Blogger para torpes... y para no tanto"

Esta plantilla no lleva la cabecera estandard, editable desde Elementos de Página, y que es desde dónde se puede añadir de forma sencilla en una plantilla clásica. Por eso, por más que escribamos ahí, nunca se verá ni la descripción, ni tampoco una posible imagen.

De todas formas, lo primero que debeis hacer es grabar con ese sistema (desde Elementos de Página-->Cabecera) la descripción que quereis. De esta manera estará disponible para otro tipo de plantillas (por si los cambios...). Blogger grabará el dato en data:description.

Ahora tenemos que localizar la parte de código (artilugios expandidos) que realmente muestra el título en esta plantilla:

<b:includable id='main'>
<h1><a expr:href='data:blog.homepageUrl'><data:title/></a></h1>
<data:description/>

</b:includable>

En el código anterior, ya hemos insertado (en negrita) la descripción. Pero no es suficiente para que se vea bien, puesto que el espacio destinado a ese apartado es escaso y las letras se cortarán. Por este motivo, hay que ampliar la altura todo lo que necesites en este ID.

#head {position:relative; width:1020px; height:250px; margin:0 auto; text-align:left; background: url(http://www.webpagedesign.ws/aspire/top-right-bg-repeat.jpg) 90px 0px repeat-x;}

Si quereis cambiar el color, tamaño, margen, etc de la descripción (por defecto no sale muy agradable), insertad la variable indicada con una etiqueta de estilo. Por ejemplo:

<div style='font-family:Verdana;font-size:14px;font-style:italic;color:#797639;margin:-10px 0px 0px 25px;'><data:description/></div>


Si lo colocais de esta última manera -entre DIV's y con un margen superior negativo- no necesitareis siquiera cambiar el alto del #head y se podrá quedar en el 250px original.

Esto último, al gusto...

¿Vemos otro post al azar por si le encuentras utilidad o quizás prefieres ser más metódico y suscribirte a nuestras entradas por correo? También puedes imprimir este artículo y por supuesto compartirlo en redes sociales si fue de tu agrado.

Compartir
Copy URL

Y muchos más artículos interesantes si nos sigues en...

follow us in feedly

27 comentarios :

  1. hola oloman...
    tengo una duda en lo que es publicidad en blogger...
    vi q tenes adsense abajo del menu... podrias decirme como es la forma de paga que utiliza adsense?... como retiro el dinero?... el rank que tengo es 2 cual seria el promedio de dinero?

    he visto otros sitios q ofrecen publicidad paga pero requieren una cuenta paypal... sabes si los servicios que paypal ofrece son segurops y confiables?

    gracias oloman por este espacio
    saludos

    ResponderEliminar
  2. a mi me ocurre una cosilla...
    las imagenes de mis cabeceras estan añadidas dentro del codigo del header como background url (----
    pero no estan vinculadas al blog, osea a la pagina de inicio. Hay forma de hacer que vincule la imagen?

    ResponderEliminar
  3. no me he subscrito al comment :(

    ResponderEliminar
  4. Sobre la publi, Adsense paga por transferencia o mediante envío de cheque a domicilio. Lo hace en dólares USA, por lo que si no es esa tu moneda, en tu banco seguramente tendrás que pagar por cobrarlo.

    Mi opinión es que es preferible transferencia, ya que lo recibes en moneda local (el equivalente), sin gastos y más rápido.

    El pago es automático pero sólo lo hacen cuando alcanzas los 100$.

    El rank no tiene nada que ver, porque pagan por clicks. Creo que nadie sabe cual es el algoritmo exacto para calcular el precio por click, pero depende del ratio click/visitas. Muchas visitas con pocos clicks = poco precio.

    No pienses que vas a poder ganar una pasta con esto. Cuando tienes un número de visitas más o menos razonable -como las que tiene este blog- puede que te alcance para pagar un dominio y hosting propio, pero poco más.

    Lo de Paypal, salvo sorpresas futuras, es serio, pero te cobran una comisión por cada pago que recibes. Es muy poco, pero para cantidades pequeñas, supone un porcentaje muy alto.

    No conozco otros medios de publi buenos, pero para lo que yo quiero, me vale con Adsense.

    ResponderEliminar
  5. Asunto "incluir descripción en Aspire" concluido con éxito. Muchísimas gracias.
    Mi siguiente reto (para mi es un reto todo esto, soy muy torpe) es convertir la plantilla Aspire en una plantilla adaptable a cualquier resolución de pantalla. En un post ya has comentado que eso se consigue cambiando pixel fijos por %.
    ¿La cosa sería cambiar los anchos y las posiciones relativas a derecha o izquierda por sus equivalentes en % nada más o no es tan fácil?

    ResponderEliminar
  6. Malina, normalmente el widget de cabecera con enlace viene de serie y sólo tienes que configurarlo desde "Elementos de Página" con la imagen que quieras. Sólo hay que elegir entre ponerla debajo o en lugar del título para que funcione como tú quieres.

    Entiendo que tienes una plantilla sin este artilugio, porque además no lo he podido encontrar en tu código fuente.

    En ese caso tendrás que buscar en la parte de HTML, el lugar dónde muestra la imagen e insertar un tag de enlace (A HREF)con su correspondiente cierre.

    Por lo que yo puedo ver, tendrás algo así como

    <a expr:href='data:blog.homepageUrl'>
    <div id='header-wrapper'>
    <div class='header section' id='header'><div class='widget Header' id='Header1'>
    <div id='header-inner'>
    <a href=
    <div class='titlewrapper'>
    <h1 class='title'>
    @}--,&#180;-- MALINA MANIAC
    </h1>
    </div>
    <div class='descriptionwrapper'>
    <p class='description'><span>RECURSOS GRATIS, PROGRAMAS, MUSICA, LIBROS, DISEÑO GRAFICO</span></p>
    </div>
    </div>
    </div></div>
    </div>
    </a>

    Las líneas en negrita es lo que hay que añadir para que todo el DIV que contiene la imagen, funcione como enlace. Si sólo quieres que sea enlace la parte de descripción, pues entonces desplazas el A HREF y el /A para que encierren sólo el DIV del DESCRIPTION-WRAPPER.

    ResponderEliminar
  7. No, Mujer Quijote, no es tan fácil en tu caso. Esta plantilla tiene muchos gráficos de fondo para conformar su aspecto y si lo compruebas, verás que ahí empiezan los problemas.

    Por ejemplo, podrás hacer variable el ancho del contenido de los posts sin problemas. Pero la imagen que forma la parte de arriba del "pergamino", permanecerá invariable. Eso hará que no se vea continuo: los posts serán o más anchos o más estrechos que dicha parte de arriba. Con los gadgets de la sidebar pasará lo mismo.

    Es el problema de tener una plantilla tan sofisticada. Para conseguir una estética como esa, normalmente se recurre a fondos hechos con imágenes y resulta bastante complicado hacer "cajas" con esos fondos que sean adaptables a anchos variables.

    Hay que construir una parte de arriba-izda, otra de arriba-derecha, un cuerpo, a veces unos laterales y por último otras parte de abajo-izda y abajo-derecha. Todo esto para que el contenido pueda expandir la caja en vertical y la configuración de cada pantalla en horizontal.

    Hoy por hoy, estoy haciéndo una plantilla nueva con muchas imágenes y por este mismo motivo, he desistido de hacerla con ancho variable, así que, por favor.. ¡no me pidas ayuda para la tuya! XD

    ResponderEliminar
  8. mira lo que tengo es esto

    /* Header
    -----------------------------------------------
    */

    #header-wrapper {
    background: url(http://images.universodivx.net/imgupload/images/40784cabecera_conlogo_malina.jpg) bottom right no-repeat;
    height: 176px;
    width:1020px;
    margin:0 auto 10px;
    }

    ResponderEliminar
  9. he probado a poner esa linea en negrita por encima de #header-wrapper y no se ve la imagen
    y si la pongo por debajo no me hace nada

    ResponderEliminar
  10. No Malina. Esa parte que has pegado corresponde al CSS, que es la zona dónde defines el estilo de la página, el aspecto general.

    Después del <body> empieza el HTML y ahí es dónde debes buscar algo parecido a lo que te indico.

    Se me olvidó decirte que seguramente necesites pinchar en Expandir Plantillas de Artilugios para verlo completo.

    ResponderEliminar
  11. Te envio lo que tengo por correo porque no me deja ponerlo en el comentario. He intentado poner esa linea negrita por encima del div id='header-wrapper pero me da error al guardar

    ResponderEliminar
  12. ¡Ooops! Ahora me doy cuenta que hablas de "una línea". Son dos, la primera y la última.

    Sobre lo de dos artilugios con etiquetas, que se me olvidó comentarte antes, sí que puedes hacerlo. Aquí mismo hay dos instalados en este blog, pero con códigos tan distintos que quizás te pasó desapercibido.

    El otro está bajo el rótulo "Suscribir Temas".

    Lo único que puede ocurrir, es que al ir a grabar, te avise de que tienes dos artilugios con el mismo ID. Blogger les pone de ID "label1". Simplemente cambias uno de los dos por "label2" y se soluciona.

    ResponderEliminar
  13. Oído cocina. Reto eliminado. Tendré que buscarme alguno más sencillo.
    Gracias por todo.

    ResponderEliminar
  14. ya lo consegui! en una me funciona, voy a ver en las demás pero es de suponer que si.

    Graciassssssssss

    ResponderEliminar
  15. listo! ya me funciona correctamente en todas las plantillas, que gusto!

    un abrazoteeeeeeeee

    ResponderEliminar
  16. Una pregunta.
    ¿Una plantilla hay que hacerla completa a golpe de línea de código tras línea de código o existen aplicaciones más o menos gráficas para hacer al menos lo básico, aunque luego hagas retoques o insertes cosas a base de código?

    ResponderEliminar
  17. Se puede diseñar entera, pero creo que es más fácil coger una estándar y modificarla.

    La Black Mínima es buena para eso. Lleva lo justo y así puedes modificar fácilmente lo existente y luego, por supuesto, añadir lo que quieras.

    ResponderEliminar
  18. No sé que es lo que quieres decir con "arreglar el feed", Defcay.

    Se puede acceder a él perfectamente y además, tienes varios gadgets instalados que, precisamente, funcionan extrayendo del feed los datos que muestran.

    http://fundiendoelmodem.blogspot.com/feeds/posts/default

    ResponderEliminar
  19. Te he enlazado, espero que con tu permiso, en una de mis entradas. Sigo tu excelente trabajo desde hace un tiempo.

    Un saludo

    ResponderEliminar
  20. Hola, Oloman, como sabes desde que descubrí tus blogs soy una fan entregada. Oloblogger me parecía extrañísimo porque no tenía ni idea de lo que hablábais; así que me puse a estudiar y me lo leí entero de un tirón.

    Hoy inauguro: http://www.mondandomanzanas.blogspot.com/

    Lo malo es qe el texto sólo queda centrado en pantallas de 1024 de resolución, el puntero sólo se ve con el explorer y el formulario de comentarios sólo tiene una columna, cuando debería tener dos...Pero como primer intento no está tan mal.

    Gracias, maestro. A la próxima clase te traeré una manzana

    ResponderEliminar
  21. Ya estoy aquí de nuevo.
    La pregunta de la semana es:
    ¿Cómo puedo hacer para que en la columna en la que se listan mis etiquetas aparezca, al lado de cada etiqueta, el número de la cantidad de veces que esa etiqueta ha sido puesta?
    Algo así como :
    preguntas (5)
    respuestas (2)
    tonterías (100)
    Mi plantilla es Aspire, aunque supongo que esto es algo más general.
    Gracias.

    ResponderEliminar
  22. Vicente: Se agradece el ser citado.

    Chiti: ¡Guau! Me alegro mucho de que te hayas decidido a crear un blog. Siempre he pensado que si te animabas a dar el paso, lo harías muy bien. Espero que el tiempo y tú, me deis la razón.
    Sobre los problemas técnicos, supongo que habrás escogido tu plantilla con mucha ilusión, pero es realmente endiablada. La primera pega que le veo es la inclusión de un IFRAME para mostrar el texto, que provoca que tenga una barra de desplazamiento adicional a la del navegador. Puedo intentar ayudarte, pero preferiría que, para empezar, cogieras alguna de las plantillas que Blogger te ofrece.
    Ahí no tendrás muchos problemas porque no te costará mucho irla personalizando con las ayudas de blogs como este.
    Más adelante, cuando controles un poco, ya podrás coger otra más complicada.
    En cualquier caso, mantenme informado para ayudarte... ¡aunque sea para la plantilla que has escogido!

    La Mujer Quijote: Prepararé un post para explicarlo, que creo que no tengo hecho ninguno.

    ResponderEliminar
  23. Gracias por tus ánimos Oloman. En cuanto a lo de cambiar la plantilla...¿me creerás si te digo que miré unas 1000? La encontré después de casi un mes buscando (o mis gustos son muy refinados o soy más rara que un perro verde).

    Claro que quiero tu ayuda ...es más...la necesito! ¿iframe? he hecho cientos de experimentos con la plantilla borrando todo lo que se me ha ocurrido y no he conseguido quitar la dichosa barra...

    ¡help! .

    Gracias a capazos.

    ResponderEliminar
  24. Chiti, en la barra lateral tienes mi dirección de contacto. Mándame un correo para tener yo tu dirección de idem.

    ResponderEliminar
  25. Hola Olobloger, vengo de parte del Escaparate de Rosa, que ya la tenía vuelta mono con la plantilla Aspire, por lo demás ella es un amor en la disposición que ha tenido hacia mí.

    Tengo varias preguntas sobre Aspire, pero en específico ahora, me gustaría saber como pongo una imagen en la cabecera.

    Algo me he metido ya al código y sustituí esta imagen http://i254.photobucket.com/albums/hh92/eblogtemplates/aspire/header-bg.jpg
    y modifique encima pensando que podría "pegar" mi cabecera sobre esta imagen, pero no me dió resultado. Ya que sólo logré que me pusiera en su lugar esta imagen http://i254.photobucket.com/albums/hh92/eblogtemplates/aspire/top-right-bg-repeat.jpg

    Tú sabes como podría insertar mi propia imagen? sin desconfigurar la plantilla.

    Desde ya muchas gracias!

    ResponderEliminar
  26. Hola otra vez, ya solucioné lo de la cabecera, de la misma manera que posteo arriba.

    Gracias de todas maneras

    ResponderEliminar
  27. Hola Isonauta. Me alegro de que lo solucionaras por tí mism@. Supongo que lo que hiciste fue construir una imagen de las mismas dimensiones que la original pero con tus propios gráficos, alojarla y sustituir la URL. Esa es la forma más fácil para no tener que alterar la plantilla.

    ResponderEliminar