Este documento proporciona instrucciones para realizar cinco modificaciones en las plantillas de Joomla 1.5: 1) eliminar un mensaje de bienvenida, 2) eliminar un logo, 3) modificar una imagen de cabecera, 4) reducir el alto del área de la imagen de cabecera, y 5) centrar el texto del nombre del sitio. Explica dónde encontrar los archivos relevantes y qué líneas de código modificar para lograr cada cambio deseado.
8. 8/30
¿Cómo lo hago?
● La plantilla con la que estamos trabajando permite ocultar
el logo desde su configuración
● Para acceder a ello
– backend, Extensiones/ Gestor de plantillas,
pinchamos sobre la plantilla
– Marcamos SÍ en “Hide Logo” (ocultar logo)
12. 12/30
¿Cómo lo hago?
● Esta imagen está ubicada bajo la carpeta images de
nuestra template
● Simplemente renombramos esta imagen (para no
perderla)
● Creamos una imagen a nuestro gusto, asegurándonos de
que tiene el mismo nombre que la original
● IMPORTANTE: Asegúrate también de que tiene
exactamente el mismo tamaño
13. 13/30
¿Cómo lo hago?
Carpeta de imágenes de
nuestra template
Copiamos aquí la imagen
que nos interese
justo con el mismo nombre que
la original
18. 18/30
Lo que quiero hacer
Eliminar espacio sobrante
19. 19/30
¿Cómo lo hago?
● El css de mi plantilla es quien controla los anchos y altos
de las áreas en las que se divide mi sitio web
● En el sistema de archivos, bajo la carpeta templates de mi
sitio Joomla, accedemos a la carpeta contenedora de la
plantilla que tenemos seleccionada, y luego a la carpeta
css
● Editamos el archivo template.css
20. 20/30
¿Cómo lo hago?
Ruta css de la plantilla
que estoyusando
Fichero .css que debemos editar
21. 21/30
¿Cómo lo hago?
● Aspecto de template.css
22. 22/30
¿Cómo lo hago?
● Desde el navegador, mostramos el código fuente de
nuestra página, e intentamos identificar qué región es la
que determina el alto de la imagen de cabecera
23. 23/30
¿Cómo lo hago?
● Sospecho que es el div h_area el que contiene esta
imagen de cabecera.
● En el fichero template.css, buscamos h_area y probamos
a modificar su altura
● De 338px a 270px
28. 28/30
¿Cómo lo hago?
● De nuevo tendremos que modificar el fichero template.css
● Desde el navegador, mostramos el código fuente de
nuestra página, y localizamos dónde se muestra el título
de mi sitio web.
● En mi caso, busco el texto “Maru Design”
29. 29/30
¿Cómo lo hago?
● Abrimos nuestro fichero template.css, y buscamos la clase
logo.
● Modificamos para que la alineación del texto sea centrada
– Añadimos la línea text-aling: center;