LoQueMeSaleDelRatón

By David Miralles

Uso de código HTML y CSS en un blog WordPress

Qué és HTML y CSS?

HTML es un lenguaje de diseño web interpretado por los navegadores y CSS es un lenguaje de formato visual para páginas web. Prácticamente la mayoría de las páginas web contienen código de estos dos lenguajes que son los que le dan vida y formato a un espacio web.

¿Porqué utilizarlo y donde?

El uso de estos dos tipos de código nos dá más libertad en nuestro blog puesto que se puede personalizar un poco más, entonces, ¿Porqué no utilizarlo?

WordPress permite la inserción de este tipo de código en dos sitios, la redacción de nuestros posts y en el widget de texto que nos ofrece wordpress nada más instalar el blog.

¿Que podemos hacer?

Empezaremos por el código HTML, ya que el CSS complementa a este. Este código se basa en etiquetas que dentro llevan nombres que de forma estandarizada interpretan todos los navegadores de internet igual. Algunas de las más interesantes para aplicarlas en nuestro blog pueden ser:

Escribir un parrafo

<p>Para introducir un texto o parrafo</p>

Escribir texto corto

<a>Para introducir un texto corto</a>

Introducir una imagen

<img src=”ubicación” alt=”descripción de la foto” />. La ubicación la podremos obtener yendo a “Media” en el menú izquierdo seleccionando la fotografía que quermos o subiendola al blog y a continuación obteniendo su URL o ubicación en la parte derecha de la pantalla.

Introducir texto con hipervinculo (enlace a una página):

<a href=”http://loquemesaldelraton.com”> Blog de loquemesaledelraton.com</a>

Introducir imagen con hipervinculo (enlace a una página):

<a href=”http://loquemesaldelraton.com”><img src=”ubicacion” alt=”descripción de la foto”>loquemesaledelraton</a>

Contendor de contenido

<div>                                                                                                                                                                                                             <a href=”http://loquemesaldelraton.com”> Blog deloquemesaledelraton.com</a>                                                       <p>Para introducir un texto o parrafo</p>                                                                                                                                  </div>

A continuación, mejoraremos el formato con CSS. Primero que nada decir que el lenguaje CSS se introducirá siempre empezando por style=”" y dentro de las comillas el código que queramos, el código se introduce por etiquetas seguidas de dos puntos(:), el valor que le asignamos y finalmente, un punto y coma(;), paso a detallar algunas posibilidades:

Fondo de un color (Enlace para conseguir colores en HTML)

background-color:#000000;

Fondo de imagen

background-image:url(‘ruta_a_la_imagen’);

Cambiar el tamaño de la letra

font-size:12px;

Tamaño de un div (ancho, altro)

width:500px;height:500px;

Mi consejo es que se empiece por un div o contenedor (símil con una caja) que nos permitirá dentro incluir párrafos, textos e imágenes. Una vez tengamos introducidos los campos y etiquetas que deseemos, daremos formato en la etiqueta div con CSS de la siguiente forma:

<div style=”background-color:#000000;font-size:10px;”></div>

 

El post de hoy ha sido una breve introducción a estos dos tipos de códigos que nos pueden dar utilidades muy interesantes en nuestro blog. Si teneis cualquier duda acerca de HTML o CSS no dudeis en consultarme.

¿Que sabes hacer para WordPress en HTML y CSS?

 

3 thoughts on “Uso de código HTML y CSS en un blog WordPress

Leave a Reply

Your email address will not be published. Required fields are marked *


*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Current month ye@r day *