Joomla 1.5: modificaciones en las plantillas (II)

1,053
-1

Published on

Published in: Education
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
1,053
On Slideshare
0
From Embeds
0
Number of Embeds
7
Actions
Shares
0
Downloads
9
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Joomla 1.5: modificaciones en las plantillas (II)

  1. 1. 1/30Joomla 1.5: modificaciones en las plantillas (II)
  2. 2. 2/301. Eliminar mensaje “Bienvenidos a la portada”
  3. 3. 3/30Lo que quiero hacer Queremos eliminar este mensaje
  4. 4. 4/30 ¿Cómo lo hago?● En Menús/ Menú Principal, – marcamos NO en “Mostrar el título de la página”
  5. 5. 5/30Resultado
  6. 6. 6/302. Eliminar logo que acompaña al nombre del sitio
  7. 7. 7/30Lo que quiero hacerQueremos eliminar este logo
  8. 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)
  9. 9. 9/30Resultado
  10. 10. 10/303. Modificar imagen de cabecera
  11. 11. 11/30Lo que quiero hacer Queremos modificar esta imagen
  12. 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. 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
  14. 14. 14/30Resultado
  15. 15. 15/30Resultado
  16. 16. 16/30 Resultado● No he respetado el tamaño de la imagen, ahora es más estrecha● Vamos a hacer algunos cambios más para mejorar el aspecto
  17. 17. 17/30 4. Reducir alto delárea de la imagen de cabecera
  18. 18. 18/30 Lo que quiero hacerEliminar espacio sobrante
  19. 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. 20/30 ¿Cómo lo hago?Ruta css de la plantilla que estoyusando Fichero .css que debemos editar
  21. 21. 21/30 ¿Cómo lo hago?● Aspecto de template.css
  22. 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. 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
  24. 24. 24/30Resultado Hemos eliminado el espacio de separación
  25. 25. 25/30 Resultado● No he respetado el tamaño de la imagen, ahora es más estrecha● Vamos a hacer algunos cambios más para mejorar el aspecto
  26. 26. 26/30 5. Centrar el textodel nombre del sitio
  27. 27. 27/30Lo que quiero hacer Centrar el título
  28. 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. 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;
  30. 30. 30/30Resultado El texto aparece centrado

×