-
Cómo codificar un diseño del blog
-
Ya sea que usted está codificando un diseño del blog de WordPress, Typepad, Blogger, u otra plataforma, se requieren conocimientos de HTML y CSS. El lenguaje de programación HTML Web controla la estructura de su blog, mientras que CSS controla el estilo. elementos de código que se encuentran típicamente en los diseños de blogs incluyen la imagen de cabecera tipo de documento HTML, hojas de estilo CSS,, navegación, contenido, barra lateral y pie de página. Aunque la forma de codificar un diseño del blog varía en gran medida dependiendo de la plataforma de publicación de blogs que está utilizando, algunos aspectos del código general siguen siendo los mismos, y se pueden utilizar para codificar cualquier tipo de blog.
Instrucciones
1 Inserte la declaración DOCTYPE en el archivo de índice o la cabecera de tu blog. La declaración DOCTYPE - que aparece antes de cualquier código HTML - le dice al navegador qué versión de HTML de su blog es el uso de:
<! DOCTYPE html PUBLIC "- // W3C // DTD XHTML 1.0 Transitional // EN"
"Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">2 Crear, dentro de Bloc de notas u otro editor de texto, una hoja de estilo CSS que contiene fuentes, colores y otras preferencias de estilo. Por ejemplo:
cuerpo {
background-color: #ffffff;
font-family: Tahoma, Verdana, Arial, sans-serif;
font-size: 12px; }envase {
Anchura: 800px;
color: # 000000;
fondo: #ffffff;
flotador izquierdo;
text-align: left; }{cabecera
Anchura: 800px;
altura: 20px;
background: url #ffffff (imágenes / headerimage.jpg); }contenido {
Anchura: 500px;
color: # 000000;
fondo: #ffffff; }{barra lateral
Anchura: 275px;
color: # 000000;
fondo: #ffffff;
flotar derecho; }h1 {
margin-top: 15px;
font-size: 15px;
color azul; }Guarde el archivo como "style.css" o reemplazar la hoja de estilos CSS actual con la que ha creado.
3 Introducir el principio de la estructura básica código HTML en un archivo de índice o la cabecera de tu blog.
<Html>
<Head>
<Title> Título de su blog </ title>
</ Head>El "<head>" es el lugar donde se va a insertar el código de hojas de estilo CSS. También puede insertar cualquier etiqueta META y los códigos de JavaScript. Su código de acabado debe parecerse a esto:
<Html>
<Head>
<Meta name = "distribución" content = "global" />
<Meta name = "description" content = "Describe tu blog." />
<Meta name = "keywords" content = "Añadir palabras clave separadas por comas en el blog." />
<Title> Título de su blog </ title>
<Link rel = "stylesheet" href = "style.css" type = "text / css">
</ Head>4 Inserte el cuerpo de la etiqueta y el contenido principal en el archivo de índice de su blog. El contenido principal incluye normalmente la imagen de su cabecera, menú de navegación, entradas de blog y la barra lateral. El cuerpo de la etiqueta es la etiqueta sólo se requiere en esta sección, los otros pueden variar en gran medida - por ejemplo:
<Body>
<Div id = "contenedor">
<Div id = "contenido">
<Div id = "header">
<H1> Entrada de blog título </ h1>
</ Div>
<Div id = "nav">
<H2> Navegación </ h2>
</ Div>
Blog post aparece aquí.
</ Div>
</ Div>o
<Body>
<Div id = "contenedor">
<Div id = "contenido">
<Div id = "header"> </ div>
<H1> Entrada de blog título </ h1>
</ Div>
<Ul id = "nav">
<Li> <a href="#"> Acerca de mí </a> </ li>
<Li> <a href="#"> Contacto </a> </ li>
</ Ul>
Blog post aparece aquí.
</ Div>
<Div id = "barra lateral">
contenido de la barra lateral, tales como enlaces, calendario y archivos aparecen aquí.
</ Div>
</ Div>5 Introduzca las etiquetas HTML de cierre en la parte inferior del archivo de índice o pie de página de su blog.
</ Body>
</ Html>Si desea insertar un código de pie de página con créditos, insertarlos antes de que el cuerpo de la etiqueta de cierre. Por ejemplo:
<Div id = "pie"> <center> Contenido nombre Blog. </ Div>
</ Body>
</ Html>
