15/Actualización de temas

Nota: Pendiente de Traducir. ¡Anímese a traducir esta página!.     ( y otras páginas pendientes)

Desde la versión 1.5 de Moodle y posteriores, el soporte CSS se ha extendido a través de Moodle para eliminar los difíciles códigos de estilo como p.e. fuentes o colores, del código HTM. Como resultado, los temas de Moodle son mucho más flexibles y accesibles, pero esto significa que los temas personalizados escritos para la versión de Moodle 1.4 y anteriores no funcionarán correctamente.

La mejor forma cuando se actualiza es reconstruir su tema otra vez usando trozos de su viejo tema, compartiendo imágenes y estilos según sea necesario. Con esta solución conseguirá un tema más robusto y resistente a futuras actualizaciones de Moodle.

Las intrucciones indicadas abajo se aplicarán tanto si usted está actualizando como si no.

Actualizar o instalar Moodle 1.5 o superior

Intale Moodle normalmente. Si está actualizando, el directorio de su viejo tema se mantendrá, pero el proceso de instalación establecerá el tema de su sitio al nuevo tema por defecto standardwhite.

Crear un nuevo directorio de tema

Los Temas son almacenados en el directorio theme de Moodle. Cada tema se almacena en un directorio particular.

Para crear un nuevo directorio de tema, haga una copia del directorio standardwhite (o cualquier otro tema) y nómbrelo apropiadamente.

Dentro de este nuevo directorio encontrará los siguientes archivos.

config.php - edite este archivo para ajustar los parámetros de su tema

favicon.ico - el icono del sitio que se muestra en la barra de direcciones o favoritos del navegador

header.html - un trozo de HTML que define el encabezamiento de sus páginas.

footer.html - un trozo de HTML que define el pie de sus páginas.

gradients.css - una hoja de estilos actual que contiene estilos para añadir a su tema.

gradient.jpg - una archivo de imágen, usted puede añadir tantos como desee.

styles.php - el script actual que llama Moodle, no hay necesidad de que usted lo cambie.

Crear un nuevo archivo CSS

Su tema puede tener tantos archivos CSS como quiera. Crear un nuevo, por ejemplo misestilos.css, e incluirlo en su tema editando el archivo config.php y cambiando $THEME->stylesheets. Debe quitar gradients.css si no lo quiere.

Este nuevo archivo CSS es donde va a añadir estilos que reemplazaran las hojas de estilo estándar o que establecerán otras nuevas.

Mientras está en config.php, revise su contenido para hacerse una idea de otros cambios que puede realizar.

Haga que su tema sea el activo

Escoja su nuevo tema de la lista en Administración >> Configuración >> Temas.(Alternativamente, un usuario o tema de sesión pude ser configurado para realizar pruebas.)

Changing the header and footer files

The header and footer files define the layout for the top and bottom of pages.

The first thing most people want to do is to add a logo to the front page. The easiest way to do this is to edit the header file. Look closely at the code in header.html and you'll see there is different code for different parts of Moodle. Adding a logo to the theme header contains further information.

Warning: If upgrading from 1.4, don't just copy your old header and footer files over as they have changed substantially.

Start adding new CSS styles

Start adding classes to your CSS file, one by one. The best way to find out what styles you want to change is by using one of the following tools:

• Andrew Walker's CSS Inspector - this enables you to easily view details of an element, including its ancestors and any class and id attributes
• Web Developer Extension for Firefox

Clear your browser cache

Please remember that browsers usually cache CSS files, so a forced refresh (Ctrl+F5) is required in order to see any changes. For a detaled description look at how-to-clear-your-browser-cache

See also

• Theme basics
• Moving Title Text in Sideblocks forum discussion
• Themes forum