1. Libros
  2. Joomla! - Diseño y personalización de plantillas - Versión online

Joomla! Diseño y personalización de plantillas - Versión online

  • Acceso ilimitado 24/7
  • Todos los libros online de ENI
  • Novedades todos los meses
  • Acceso 100% online
  • Consulta inmediata
  • Versión HTML online
  • Acceso ilimitado 24/7

Presentación

Joomla! Es uno de los CMS más utilizados en la actualidad. Su sólida base le permite adaptarse a todo tipo de proyectos: sitios institucionales, web de comercio electrónico, portales de empresa, etc. El diseño, la ergonomía, la navegación y la apariencia de todos los contenidos del sitio se elaboran a partir de plantillas.

Este libro va dirigido a cualquier persona con conocimientos de Joomla! que desee iniciarse en la creación de nuevas plantillas o en la personalización de plantillas ya existentes. Las plantillas creadas son válidas para las versiones 3.0 y superiores de Joomla!.

Se recomienda contar que conocimientos previos de HTML y CSS; se estudiarán las nociones de PHP requeridas para la puesta en práctica de las plantillas. 

Empezaremos estudiando la estructura  de las plantillas de Joomla!. Crearemos entonces una primera plantilla simple para poner en práctica las nociones aprendidas.

A continuación, proponemos al usuario crear una plantilla completa mostrando varias posibilidades para la colocación de los módulos en ubicaciones variadas.

La tercera plantilla que vamos a crear requerirá que utilicemos opciones y estilos; esas funciones permiten que los usuarios puedan personalizar la plantilla en la administración del sitio sin tener que modificar el código fuente.

Terminaremos analizando detenidamente la plantilla Protostar, que es la plantilla propuesta por defecto en Joomla!. Podrá así usarse como inspiración para crear plantillas personalizadas.

Índice

  • Capítulo 1: La administración de las plantillas
    • A. Objetivos
    • B. Usar las plantillas
    • C. La plantilla predeterminada
    • D. Administrar las plantillas
      • 1. Instalar u na plantilla
      • 2. Listas de plantillas y estilos
      • 3. Filtrar las plantillas y los estilos
      • 4. Desactivar una plantilla
      • 5. Desinstalar una plantilla
      • 6. Gestionar los estilos
    • E. Vista previa de las plantillas
      • 1. Activar la vista previa
      • 2. Vista previa de las demás plantillas
    • F. La configuración de las plantillas
      • 1. Los archivos de constitución
      • 2. Opciones de estilo de las plantillas
      • 3. La asignación de menús
  • Capítulo 2 : La estructura de las plantillas
    • A. Objetivos
    • B. La carpeta de la plantilla
      • 1. Las plantillas de Joomla!
      • 2. Los archivos de una plantilla
    • C. El archivo descriptivo
      • 1. Objetivos
      • 2. El encabezamiento
      • 3. El diseñador
      • 4. Los archivos de instalación
      • 5. Lista de posiciones
      • 6. Idiomas disponibles
      • 7. Opciones de la plantilla
    • D. Las inclusiones JDOC
      • 1. Objetivos
      • 2. Encabezado
      • 3. Componentes
      • 4. Mensajes
      • 5. Depuración
      • 6. Carga de los módulos
      • 7. Vista de los módulos
    • E. Posición de los módulos
    • F. Las clases de CSS de Joomla!
      • 1. Clases predeterminadas
      • 2. Conocer las clases predeterminadas
  • Capítulo 3: Una plantilla simple
    • A. Objetivos
    • B. La estructura de la plantilla
      • 1. La carpeta
      • 2. El archivo index.html
      • 3. Los estilos CSS
      • 4. Las imágenes
      • 5. El archivo de descripción
      • 6. El archivo maestro
      • 7. Las viñetas
      • 8. La carpeta de la plantilla
    • C. El archivo descriptivo
      • 1. Objetivos
      • 2. El encabezado
      • 3. La declaración de extensión
      • 4. La información sobre la plantilla y el diseñador
      • 5. Los archivos de la plantilla
      • 6. Las posiciones
      • 7. Los demás parámetros
      • 8. El código completo
    • D. Los contenedores
    • E. El inicio del archivo index.php
      • 1. Objetivos
      • 2. Limitación del acceso directo
      • 3. Las declaraciones HTML
      • 4. El elemento <head>
      • 5. Los metadatos
      • 6. Las hojas de estilos predeterminadas
      • 7. La hoja de estilos
      • 8. El final del encabezado
      • 9. El código completo
    • F. El cuerpo del archivo index.php
      • 1. El cuerpo de la página
      • 2. Los contenedores
    • G. El diseño CSS
    • H. El contenedor principal
    • I. El encabezado de la página
      • 1. Las cajas de vista
      • 2. La imagen de fondo del encabezado
      • 3. El logo
      • 4. El módulo de búsqueda
    • J. La barra de menús
      • 1. Diseño
      • 2. Insertar la barra de menús
    • K. La zona central
      • 1. Las cajas de vista
      • 2. Las condiciones de vista
      • 3. La composición de la página
      • 4. Las reglas CSS
    • L. El pie de página
    • M. El código completo
      • 1. Para el archivo index.php
      • 2. Para el archivo template.css
    • N. La vista del sitio
      • 1. La plantilla
      • 2. Los módulos
      • 3. La vista
  • Capítulo 4: Una plantilla completa
    • A. Objetivos
    • B. Estructura de la plantilla
      • 1. La carpeta
      • 2. El archivo index.html
      • 3. Los estilos CSS
      • 4. Las imágenes
      • 5. El archivo descriptivo
      • 6. El archivo maestro
      • 7. Las viñetas
      • 8. El archivo de la plantilla
    • C. El archivo descriptivo
      • 1. Objetivos
      • 2. El encabezado
      • 3. La declaración de extensión
      • 4. La información sobre la plantilla y el diseñador
      • 5. Los archivos de la plantilla
      • 6. Las posiciones
      • 7. El código completo
    • D. La estructura de la plantilla completa
    • E. El inicio del archivo index.php
      • 1. Objetivos
      • 2. El código
    • F. El cuerpo del archivo index.php
    • G. Los contenedores
      • 1. El diseño
      • 2. Los estilos CSS de las tablas
    • H. La cabecera
      • 1. La vista
      • 2. Los estilos CSS
      • 3. El contenido
      • 4. El código generado
    • I. La barra de menús
      • 1. La vista
      • 2. Los estilos CSS
      • 3. El código generado
    • J. Los cuadros de noticias
      • 1. La vista de las noticias en las posiciones
      • 2. Los estilos CSS y la vista
      • 3. La vista condicional
      • 4. Los estilos CSS para las noticias
      • 5. La vista de las noticias
      • 6. Los estilos CSS de los módulos incluidos
    • K. La zona central
      • 1. La vista en las posiciones
      • 2. Las condiciones de vista
      • 3. Adaptar los anchos de las columnas
      • 4. Los estilos CSS para las columnas
      • 5. La vista
      • 6. Los estilos CSS de los módulos incluidos
    • L. El hilo de Ariadna
      • 1. La vista
      • 2. Los estilos CSS
      • 3. Los estilos del módulo
    • M. El cuadro de informaciones
      • 1. La vista en las posiciones
      • 2. Las condiciones de vista
      • 3. Los estilos CSS parta las informaciones
      • 4. La vista
      • 5. Los estilos de los módulos
    • N. El pie de página
      • 1. La vista en las posiciones
      • 2. Las condiciones de vista
      • 3. Los estilos CSS
      • 4. La vista
      • 5. El código generado
    • O. El código de la plantilla
      • 1. El código completo del archivo index.php
      • 2. El código completo del archivo template.css
    • P. El sitio con la plantilla completa
      • 1. Instalar la plantilla completa
      • 2. Los módulos del sitio Joomla!
      • 3. El encabezado del sitio
      • 4. La zona central
      • 5. La zona de informaciones
      • 6. El pie de página
      • 7. La vista del sitio
  • Capítulo 5: Opciones y estilos de plantillas
    • A. Objetivos
    • B. El archivo descriptivo
    • C. Las opciones de plantilla
      • 1. La descripción XML
      • 2. Las opciones disponibles
    • D. Un selector de color
      • 1. La creación de la opción
      • 2. La vista de la opción
      • 3. Modificar los estilos CSS
      • 4. Utilizar la opción
    • E. Añadir una imagen
      • 1. Crear la opción
      • 2. La vista de la opción
      • 3. Modificar el código
      • 4. Utilizar la opción
    • F. Un campo de texto
      • 1. La creación de la opción
      • 2. La vista de la opción
      • 3. Modificar el código
      • 4. Utilizar la opción
    • G. Insertar una única elección
      • 1. La creación de la opción
      • 2. La vista de la opción
      • 3. Modificar el código
      • 4. Utilizar la opción
    • H. El código completo
      • 1. El archivo templateDetails.xml
      • 2. El archivo index.php
    • I. Los estilos de las plantillas
      • 1. Objetivos
      • 2. Cambiar el nombre de un estilo
      • 3. Crear un nuevo estilo
      • 4. Utilizar el nuevo estilo
    • J. Las sustituciones
      • 1. Los objetivos
      • 2. Crear una sustitución
      • 3. Modificar el archivo del módulo
  • Capítulo 6: La plantilla Protostar
    • A. Objetivos
    • B. La estructura de la carpeta
    • C. El archivo templateDetails.xml
      • 1. El encabezamiento
      • 2. La declaración de extensión
      • 3. La información de la plantilla
      • 4. La lista de archivos
      • 5. Las posiciones
      • 6. Los archivos de traducción*
      • 7. Las opciones de la plantilla
      • 8. La opción de color general
      • 9. La opción de color de fondo
      • 10. La opción de selección de archivo
      • 11. La opción del título del sitio
      • 12. La opción de descripción del sitio
      • 13. La opción fuentes de Google
      • 14. La opción de selección de fuente
      • 15. La opción de la vista fluida
    • D. El archivo index.php
      • 1. El comentario inicial
      • 2. La configuración de la plantilla
      • 3. Editar artículos
      • 4. Incorporar bibliotecas
      • 5. Las fuentes de Google
      • 6. El color general
      • 7. Los archivos opcionales
      • 8. La configuración del ancho
      • 9. La vista del logotipo o del título
      • 10. El final del PHP
      • 11. El encabezado HTML
      • 12. El tamaño de las pantallas
      • 13. La inclusión del encabezado
      • 14. El cuerpo de la página
      • 15. La estructura de las cajas <div>
      • 16. Las estructuras principales
      • 17. El elemento del encabezado
      • 18. El elemento para la navegación
      • 19. La zona central
      • 20. La caja del pie de página
    • E. Las composiciones de página específicas
      • 1. La composición fluida
      • 2. El diseño del encabezado
      • 3. El diseño del pie de página
      • índice

Autor

Christophe AUBRYMás información

Responsable pedagógico en un centro de formation y formador en las tecnologías Web y las Artes Gráficas durante más de quince años, Christophe Aubry es hoy directivo de la sociedad netPlume especializada en la redacción pedagógica y creación de sitio en internet. Autor de numerosos libros y vídeos de Ediciones ENI (HTML/CSS, RWD, WordPress, Drupal, Joomla…), siempre está al corriente de las novedades en relación a la concepción de sitios Web gracias a su atenta mirando del entorno tecnológico.

Características

  • Nivel Iniciado a Medio
  • Publicación septiembre 2018
    • HTML
    • ISBN: 978-2-409-01563-2
    • EAN: 9782409015632
    • Ref. ENI: LNOWT2TEMJOO

Descargas

Al completar este formulario, acepta recibir información y comunicaciones comerciales sobre nuestros productos y servicios. Puede darse de baja de nuestra newsletter en cualquier momento. Si desea conocer más información acerca de nuestra política de protección de datos, pulse aquí.
  • Descargar los ejemplos del libro (209 Ko)