Cambios en el titulo parte I, Entendiendo las cosas basicas
Categorías: Aprende lo Básico, Personaliza Código, Titulo, Título18. September 2005.22:09
Generalmente dependiendo de la persona que realizó el diseño de tu blog, todo lo que sea título, se define como head, o encabezado (si se traduce)
En mi blog este código que presento a continuación define la mayoría de los cambios que se pueden hacer en el título.
(esto es parte de lo que se define como, hojas de estilo (CSS): por ejemplo, en ellas se escribe: el titulo 1 será así(tipo letra, color, otros), el título 2 será asá, entonces, cuando comienza el código del blog, solo se utiliza la palabra titulo 1 y no es necesario volver a definir el color, el tipo de letra, el tamaño, cada vez que se quiera hacer algo con este título)
La hoja de estilo es independiente del tipo de plataforma que se utiliza, la única diferencia es en donde se puede editar esta CSS.
La mayoría de las plantillas de blogger, definen en la misma plantilla (a la cual se puede acceder mediante el Menu Plantilla y luego Edición HTML) la CSS, asi que en la parte superior todo lo que esta entre las etiquetas <style> y </style> corresponde a la hoja de estilos.
Algunas plantillas acceden de manera externa al archivo .css. En este caso, para realizar un cambio se debe descargar el archivo de la dirección en la que se detalla en la parte superior de la plantilla, luego realizar los cambios, despues subir el archivo nuevamente a un servicio que te lo permita y finalmente cambiar la url de la nueva dirección en donde alojaron el archivo. Si quieren tambien pueden copiar todo este codigo que esta en el .css y agregarlo al principio de la plantilla dentro de la correspondiente etiqueta que ya mencioné.
Si necesitan un servicio para subir sus archivos revisen este post: Paginas para Subir Archivos
#blog-header {
color: #ffe;
background: #8b2 url(http://www.blogblog.com/moto_son/headbotborder.gif) bottom left repeat-x;
margin: 0 auto;
padding: 0 0 15px 0;
border: 0;
}
#blog-header h1 {
font-size: 24px;
color: #FFE;
text-align: left;
padding: 15px 20px 0 20px;
margin: 0;
background-image: url(http://www.blogblog.com/moto_son/topper.gif);
background-repeat: repeat-x;
background-position: top left;
}
#blog-header p {
font-size: 110%;
color: #ffe;
text-align: left;
padding: 3px 20px 10px 20px;
margin: 0;
line-height:140%;
}
y esta otra parte:
margin: 25px 0 0 0;
padding: 0;
}
h2 {
font-size: large;
}
h3.post-title {
margin-top: 5px;
font-size: medium;
}
ALGUNAS DEFINICIONES:
color: obviamente es el color, en header h1 es el del título y en p es el de la descripción.
text-align: alineación del texto, puede ser right(derecha), left(izquierda), center(centrado). Solo es necesario reemplazar en este caso left por la que quieran.
font-size: es el tamaño de la letra no deben borrar el px, solo cambien el numero.
padding: corresponde a los margenes (px o em). Si escriben un solo valor, por ejemplo 5px ó 1em, se asume que es el margen con todos los lados (arriba, abajo, derecha, izquierda). Si especifican 4 valores, por ejemplo
padding: 0; 5px; 3px; 0px; Esto significa que tendra 0px de margen superior, 5px de margen derecho 3px de margen inferior y 4px de margen izquierdo
DESPUES SIGO
Si este Post te ayudó recuerda votar por el blog En esta Página
Post Relacionados
Como Cambiar el Titulo del Blog para Agregar una Imagen o Foto">Como Cambiar el Titulo del Blog para Agregar una Imagen o FotoComo crear un menu para las Entradas muy Largas o Para Moverse en la Plantilla (Menu para saltar la navegación, “Skip Navigation” link)?">Como crear un menu para las Entradas muy Largas o Para Moverse en la Plantilla (Menu para saltar la navegación, “Skip Navigation” link)?
Agregue una imagen con titulo, pero se ve el antiguo, como lo borro??">Agregue una imagen con titulo, pero se ve el antiguo, como lo borro??
Dato, Logos y Botones">Dato, Logos y Botones
Widgets “Comentarios Recientes para BLOGGER en Español” (Modificado por Mi)">Widgets “Comentarios Recientes para BLOGGER en Español” (Modificado por Mi)
Post al Azar:
Envía este Post


Translate this Blog 









22. September 2005. a las 10:36 pm
Hola Paty, yo soy renueva en esto y bien poco computina asi es que cuando encontré esta página lo agradecí montones… el tema es que yo no logro dar con esos “comandos”, asi como tampoco puedo incorporar fotos, no sé porqué el sistema no me las acepta, o sea, me dice que las esta insertando y después, al revisar no hay nada de nada… como hacer pa´cachar bien como va la cosa? Mil gracias por tus consejos
23. September 2005. a las 6:58 am
Por ejemplo el texto anterior es de mi tipo de plantilla, y por lo que he estado viendo…hay bastantes cambios pero en general se mantiene la estructura…
De a poco iré explicando lo del titulo, de tal manera que sea aplicable para la mayoría de las plantillas…
Gracias por tu comentario..
25. May 2006. a las 5:46 pm
yo soy muy nuevo en esta wea…. y mi plantilla es diferente a los ejemplos que pones…que hago?…
LO QUE YO QUIERO HACER, ES PONER EN EL ENCABEZADO YN DIBUJO O LOGO PERMANENTE…
te agradeceria que me pudieras ayudar ya que leo y leo y no cacho na….
COPIE LA PLANTILLA PA VER SI ME PUEDES AYUDAR
gracias…
/* Header
———————————————– */
@media all {
#header {
width:660px;
margin:0 auto 10px;
border:1px solid #333;
}
}
@media handheld {
#header {
width:90%;
}
}
#blog-title {
margin:5px 5px 0;
padding:20px 20px .25em;
border:1px solid #222;
border-width:1px 1px 0;
font-size:200%;
line-height:1.2em;
color:#ccc;
text-transform:uppercase;
letter-spacing:.2em;
}
#blog-title a {
color:#ccc;
text-decoration:none;
}
#blog-title a:hover {
color:#ad9;
}
#description {
margin:0 5px 5px;
padding:0 20px 20px;
border:1px solid #222;
border-width:0 1px 1px;
font:78%/1.4em “Trebuchet MS”,Trebuchet,Arial,Verdana,Sans-serif;
text-transform:uppercase;
letter-spacing:.2em;
color:#777;
}
2. July 2006. a las 2:25 am
Hola!!!!
Sr. Helldres, Te envie un truco y lo deje en tú blog. Espero te funcione.
a la página de ayuda.
Gracias por no olvidar a los mortales que no dominamos el html, pero pude aportar algo que sea.
Éxito!!!!
25. July 2006. a las 7:53 pm
Voy a hacer lo mismo que el señor extraño; esta es mi plantilla, no puedo cambiar el color !!!, soy re cuadrada, no entiendo nada de esto, y se me estàn volando los pelos!!! jajaja…. AUXILIOOOO!
/* Header
———————————————– */
@media all {
#header {
padding:15px 0 10px 110px;
}
}
@media handheld {
#header {
width:100%;
padding:15px 0 10px 0;
}
}
#blog-title {
margin:0 0 .25em;
font-size:270%;
font-weight:normal;
color: #688 ;
}
#blog-title a {
color:#692;
text-decoration:none;
}
#description {
margin:0;
max-width:700px;
font-size:75%;
line-height:1.8em;
text-transform:uppercase;
letter-spacing:.2em;
color:#789;
}
26. July 2006. a las 12:25 am
debes especificar que color quieres cambiar!!!!!
No somos Adivinos…jajajajja
19. October 2006. a las 4:24 am
Hola patricia:
Me gustaría saber cómo puedo eliminar el titulo del blog, ya que no me deja hacerlo y quier solo dejar una imagen.
gracias!
ale
19. October 2006. a las 6:03 pm
ale eso esta en un post.
http://agregafotos.blogspot.com/2006/09/agregue-una-imagen-con-titulo-pero-se.html
2. November 2006. a las 1:23 am
alguien me tiene una plantilla sample blog y que halla puesto una imagen para que me explique como lo hizo …gracias felicitaciones patricia veo que tu blog tiene muchos cambios ..eres la mejor
15. February 2007. a las 11:58 pm
como puedo poner una imen en la cabecera de mi plantilla rounders ayuda por favor
31. July 2008. a las 10:50 pm
Gracias!! Pude centrar el titulo de un blog de wordpress con tu ayuda!Fantastico.
Caty
Jujuy, Argentina