Por lo general todo lo referente al color se encuentra definido en las hojas de estilo (CSS), que es común a todas las plataformas de Blogs.
En el caso de betablogger la hoja de estilos es todo lo que se encuentra entre las etiquetas <b:skin><![CDATA[/* y ]]></b:skin>. 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
Ahora que he aclarado las dudas respecto a la hoja de estilos, voy a comenzar a explicar como cambiar el color en ella.
El color se puede definir de 4 formas:
Primera forma: #rrggbb (por ej., #00cc00)
Segunda forma: #rgb (por ej., #0c0)
Tercera forma: rgb(x,x,x) donde x es un entero entre 0 y 255 inclusive (por ej., rgb(0,204.0))
Cuarta forma: rgb(y%,y%,y%) donde y es un número entre 0.0 y 100.0 (por ej., rgb(0%,80%,0%))
Las 2 formas mas utilizadas que yo he visto en las plantillas de los blogs son la primera, que corresponde al código hexadecimal del color, y la tercera que corresponde al RGB (red, green, blue) que nos da cualquier programa.
Por ejemplo el paint de windows, cuando buscamos un color a nuestro gusto….se pueden ver los pasos de esto en la siguiente figura, nos entega el RGB.
Como pueden ver de paint, para el color seleccionado (ese verde), me entregó los siguientes números:
Red=R=83
Green=G=111
Blue=B=74
Este es el código de mi plantilla que define la mayor parte de las características del título:
- /* Header */
- #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;
- }
En donde color : #FFE es el color del título
Y este otro código define las características de la descripción del título:
- /* Header */
- #blog-header p {
- font-size: 110%;
- color: #ffe;
- text-align: left;
- padding: 3px 20px 10px 20px;
- margin: 0;
- line-height:140%;
- }
donde también color: #ffe es el color de la descripción (el texto que se despliega bajo el titulo, explicando en que consiste el blog)
Así que todos los cambios de color se hacen en estas dos lineas solamente.
Ahora para cambiar el color del título del blog (de la tercera forma) solo tienen que sustituir el color: #FFE o el que tengan ustedes por el color: rgb(83,111,74) como se muestra en la siguiente figura:
Si tienen el color en código hexadecimal, solo deben reemplazar el FFE por el valor de ustedes..
Todos los colores pueden ser cambiados, aquí les dejo algunos links, que tienen listas de colores con sus respectivos códigos hexadecimales,(por ejemplo:#FFFFFF)..
Tabla de Colores WIKI
Este programa para que lo descarguen si quieren, sirve para buscar colores y entrega el código hexa…funciona sin problemas ya lo comprobe..
Si quieren ingresar su color como codigo hexadecimal y solo tienen el RGB, este link que dejo a continuación les permite pasar de uno al otro..
Convertidor de RGB a Hexadecimal
Aquí dejo las imágenes de ejemplo..
En este caso si se dan cuenta el mismo color verde que saque del paint anteriormente con RGB (83,111,74) me entrega un codigo hexa de 536F4A y despues que tengo este codigo puedo reemplazar en mi plantilla el FFE por el 536F4A de la siguiente forma:
El resultado es el mismo aunque se haga de la primera o tercera forma, como se puede ver:
Artículos Relacionados
