Hero

Cómo crear un tema para Drupal 7

Junio 20, 2013

estebanvalerioh
Drupal
Tematización

Si alguna vez se ha preguntado como comenzar con un tema propio para Drupal 7, les presento una forma simple de hacerlo.

Primeramente debemos saber que cuando creamos temas, hay una carpeta específica en el cual debemos poner los archivos de thema el cual es sites/all/themes, si no existe, debemos crearlo. La estructura seria como se describe a continuación:

sites
sites/all
sites/all/themes
sites/all/themes/custom
sites/all/themes/custom/mi_tema

Dentro de la carpeta mi_tema vamos a colocar los archivos de estilo, javascript e información del tema.

Es buena idea tomar un tema base existente, y a partir de ahí empezar con la adaptación del mismo. Lo anterior se realiza con la idea de reutilizar el código y estructura base ya creada.

En mi caso, lo que hago es copiar el tema Bartik que se encuentra dentro de la carpeta themes de la raíz de Drupal, y lo copio a la carpeta custom, como se menciono anteriormente.

Ahora seguimos los siguientes pasos:

  1. Renombrar la carpeta,

Cambio el nombre de la carpeta que copié, colocándole el nombre que quiero asignar a mi tema, en mi caso, le voy a llamar mi_tema.

  1. Renombrar el archivo con extensión info.

Entro a la carpeta y busco el archivo con extensión .info, el cual sustituyo usando el mismo nombre que le puse a la carpeta en el paso 1.

  1. Asigno el nombre y descripción del tema.

Luego de renombrar el archivo en el paso 2, lo abrimos para asignarle el nombre y descripción del tema, como vemos a continuación:

name = Mi Tema
description = Tema customizado para el sitio de Pruebas (Bartik Modificado).
package = Core
version = VERSION
core = 7.x

El resto del código no es necesario cambiarlo por ahora.

4- Remplazamos la imagen del tema.

Podemos sustituir la imagen llamada screenshot.png con una imagen propia que muestra la forma en como se va a ver nuestro tema, es importante saber que debemos mantener el nombre del archivo.

  1. Habilitar Mi Tema.

Realizados los pasos anteriores, me va a permitir ir a la sección de Appearance de Drupal, para habilitar y usar nuestro tema, como vemos en la siguiente imagen:

tema01

Debemos hacer clic en el enlace “Enable and set default” para empezar a utilizar nuestro tema, y de esta manera ir revisando las modificaciones que vamos realizando.

  1. Modificar los archivos.

Dentro de la carpeta de nuestro nuevo tema encontraremos las siguientes sub-carpetas:

mi_tema
mi_tema/css
mi_tema/images
mi_tema/templates

Según nuestras necesidades, podemos eliminar, modificar o agregar archivos dentro de la carpeta del tema, para empezar, sería bueno utilizar el archivo style.css y hacer las modificaciones en ese lugar.

El HTML lo encontraremos en los archivos dentro de la carpeta templates, los cuales también podemos modificar.

A partir de este punto, el tema ya está habilitado y es responsabilidad de nosotros cambiarlo, hasta hacerlo ver, como necesitemos.

Espero les haya servido, y se diviertan conociendo y modificando las opciones de como crear un tema personalizado para Drupal 7.

Recibe consejos y oportunidades de trabajo 100% remotas y en dólares de weKnow Inc.