Cómo crear un Sub-theme paso a paso con Drupal 7

Blog oct 15, 2011 2 Comentarios

La creación de sub-themes es muy útil para desarrollar sitios en Drupal. Dominarlo te permitirá desarrollar tus sitios más rápidos y efectivos. Los Sub-themes te permiten configurar themes que ya existen sin necesidad de estar modificando el código del original, así, se podrá comenzar tomando como base uno y construir partiendo de él ahorrando mucho tiempo.

Para aquellos que son nuevos en Drupal puede que el concepto de sub-theme sea un poco nuevo, por lo que se lo simplificaremos en dos puntos:

- ¿Qué es un sub-theme? Un sub-theme es simplemente un Theme que está basado en otro theme.
- ¿Por qué es un concepto tan potente? Por dos razones: Primero, Los sub-themes heredan propiedades del theme original (conocido como Theme Base). Esto quiere decir que se puede crear un Theme que utilice las funcionalidades y los estilos de un Theme ya existente sin tener que crear todas esas funcionalidades y estilos nuevamente desde cero. Segunda razón: Todos los cambios o cosas nuevas que se le añadan al sub-theme estarán por encima del theme base, quiere decir, los sub-themes te permiten usar lo que necesites del theme base sin limitar tus habilidades para configurar y modificar el nuevo sub-theme.

Llevándolo a un terreno más cercano, se puede decir que un Theme y un Sub-theme son como un padre y un hijo, donde el hijo hereda atributos del padre pero también tiene su propia personalidad.

Cuando se empezó a trabajar con Drupal 6, el trabajo con sub-themes adquirió gran importancia como estrategia de desarrollo. Drupal 7 amplía esta tendencia y para la mayor parte de nosotros los sub-themes son ahora la respuesta a la creación de Themes y su personalización. Como todos los sub-themes son creados sobre un theme base, la selección del theme principal es el primer punto que usted tendrá que considerar. Si su intención es hacer la menor parte de cantidad de trabajo posible, entonces usted deberá seleccionar un theme base que sea el más cercano a lo que quiere, así solo tendrá que hacer pocas modificaciones. Por otra parte, si usted quiere construir algo completamente fresco, deberá seleccionar un theme base que imponga pocas limitaciones (y la menor parte de complicaciones). Los themes base se pueden encontrar desde minimalistas a otros cargados por estilos y funcionalidades que se pueden utilizar en su sub-theme. El número de themes bases útiles ha aumentado considerablemente desde que se sabía que saldría Drupal 7 y hay ahora un número de opciones muy buenas que se pueden descargar en el sitio de drupal.org.

Para crear un sub-theme deberemos seguir los siguientes pasos:

1. Hacer una copia del directorio del theme base y sus contenidos.
2. Renombrar el directorio del theme base.
3. Borrar los ficheros no deseados del directorio.
4. Actualizar el nombre del theme en el interior de los ficheros que quedaron.
5. Crear una nuevo hoja de estilos.
6. Actualizar el fichero .info

Trabajemos basados en un ejemplo paso a paso.

Asumimos que queremos modificar el theme que viene por defecto con Drupal 7, Bartik. Como es sabido, es una mala idea modificar los ficheros del Cor de Drupal, por lo que crearemos un nuevo sub-theme basado en Bartik y haremos nuestras modificaciones ahí.

Paso 1: Crear una copia
Lo primero es realizar una copia del directorio /themes/Bartik
Paso 2: Renombrar el directorio
Copia el directorio del theme base en el directorio /sites/all/themes y renómbralo. Para este tutorial, utilizaremos el nombre newsub. En otras palabras, en este punto debes tener el set de themes localizados en /sites/all/themes/newsub
Paso3: Borra los ficheros que no necesites
El sub-theme heredará casi todo del theme base (las excepciones son el fichero .info y el fichero del logo del sitio). Tomando como norma esos elementos heredados, se pueden eliminar todo del sub-theme que no se plantee modificar, en otras palabras, si no se piensa modificar un fichero específico, se puede borrar del sub-theme.

La mayoría de la gente pensará en mantener una o varias de las plantillas y el archivo template.php, pero esto depende de sus proyectos. Si usted tiene la intención de personalizar cualquiera de las plantillas existentes, o crear sugerencias de plantilla, mantenga las plantillas relevantes. Si usted quiere modificar cualquiera de las funciones del theme o crear nuevas, necesitará el archivo template.php.

Abrid el directorio newsub y elimine todo lo que no necesita. Sea cual sea su proyecto, debe mantener el archivo .info – su sub-theme tiene que tener el archivo .info – y mantener los directorios /css y /templates, aunque usted pueda eliminar el contenido si no piensa modificarlos.
Paso 4: Cambie nombre de theme en todas partes
Después, debe cambiar el nombre de tema dentro de todos los archivos que hemos mantenido. Tenemos que cambiar donde aparezca el nombre “bartik” por “newsub”.
Paso 5: Cree su hoja de estilo
A continuación debemos crear un nuevo fichero .css. Esto es un requerimiento para un sub-theme válido; es necesario al menos una hoja de estilo propia. Se puede crear una hoja de estilo vacía, nombrarla newsub.css y guardarla dentro del directorio /css.
Paso 6: Actualizar .info
Asegúrese de que su archivo .info se llame ahora newsub.info. A continuación abra el archivo y realice las siguientes operaciones en le contenido:

1. Asegúrese de que el nombre del archivo ha sido actualizado para que muestre el nombre del sub-theme.
2. Actualice la línea de descripción como considere. Tenga en cuenta que esta información es la que aparecerá en el panel de administración describiendo el sub-theme.
3. Elimine las líneas para el paquete y la versión.
4. Añada una nueva línea: Base Theme = Bartik.
5. Declare la nueva hoja de estilo añadiendo esta línea: stylesheets[all] [] = css/newsub.css.
6. Elimine todas las otras declaraciones de la hoja de estilo.
7. Salve el archivo.

Tenga en cuenta que los sub-themes no heredan regiones establecidas por defecto del theme base. Por lo tanto si se quiere usar cualquier región establecidas por defecto en el theme base, habrá que especificarlos de nuevo en el archivo .info del sub-theme. En el ejemplo acabamos de hacer, simplemente hemos copiado el archivo Bartik .info, entonces ya tenemos la lista entera de regiones de encargo en el archivo newsub.info.
Esto es todo, hemos creado un nuevo sub-theme funcional. Si todo ha ido correctamente el nuevo sub-theme podrá ser visualizado en la sección de Themes Desactivados en el panel de control de nuestro sitio.

2 Comentarios para “Cómo crear un Sub-theme paso a paso con Drupal 7”

  1. Responder Machu Picchu says:

    Sencillo pero práctico, funcionó cuando lo probe, y esto es solo un adelanto a lo que podrías hcaer con Drupal, muy flexible y sencillo.

    Saludos,
    C.

Deje una respuesta