WordPress – Diseño y personalización de temas

Manual sobre el diseño y personalización de temas de WordPress de Ediciones ENI publicado en septiembre de 2015 y basado en la versión 4.1 de este CMS. Requiere conocimientos de WordPress, HTML, CSS y PHP.

Actualmente, WordPress es el CMS más utilizado. Sus puntos fuertes son conocidos: instalación rápida, interfaz de administración fácil de usar, se adapta a cualquier tipo de contenido (blog, web corporativa, comercio electrónico, expedientes, etc.). Cada sitio creado con WordPress utiliza un tema: crear o personalizar un tema le permitirá administrar la visualización de su sitio web: diseño, ergonomía y la apariencia de todo el contenido.

Este libro es para aquellas personas que ya conocen WordPress y desean iniciarse en la creación de temas o en su personalización. Se ha escrito con la versión 4.1 de WordPress.

En primer lugar, aprenderá a administrar los temas de su web: buscar un tema, instalarlo y activarlo. También aprenderá a personalizar los temas en la interfaz estándar.

A continuación, analizaremos los conceptos básicos del lenguaje PHP, requisito necesario ya que los temas se crean con tres lenguajes «esenciales» de la web: HTML, CSS y PHP. Se recomienda tener conocimiento de HTML y CSS.

Después veremos cómo se estructuran los temas y qué archivos contienen. Aprenderemos a utilizar la jerarquía de las plantillas de página para conocer los archivos utilizados para todos los tipos de visualizaciones: página de inicio, entradas, páginas, archivos, etc.

Crearemos un tema muy sencillo para poner en práctica estos primeros conceptos básicos.

Después crearemos un tema completo, con todos los archivos necesarios para visualizar todo tipo de contenidos: página de inicio, entradas únicas, páginas, comentarios y archivos: categoría, etiqueta, autor, etc.

A continuación analizaremos la personalización de temas desde la interfaz estándar de WordPress, la API Customizer. De este modo los usuarios podrán modificar por sí mismos algunas opciones del tema.

Concluiremos analizando en detalle el tema predeterminado de WordPress, TwentyFifteen, para así entender su funcionamiento y utilizarlo como tema padre para crear temas hijos.

Libro: WordPress Diseño y personalización de temasPáginas

254
Fecha publicación
Septiembre 2015
ISBN
978-2-7460-9738-4
Editorial
Ediciones ENI
Colección
Objetivo Web

Contenido:Capítulo 1: Gestionar temas

A. Objetivos
B. Utilizar los temas
C. Seleccionar un tema desde el sitio oficial
1. Buscar un tema
2. Elegir un tema
3. Descargar un tema
4. Instalar un tema
5. Activar un tema
6. Gestionar temas
D. Seleccionar un tema desde la interfaz de administración
1. Buscar un tema
E. El tema Twenty Fifteen
1. Tema predeterminado
2. Personalizar el título y la descripción
3. Personalizar los colores
4. Personalizar la imagen de cabecera
5. Personalizar la imagen de fondo
6. Personalizar los widgets y la página de inicio

Capítulo 2: Conceptos básicos sobre el PHP

A. Objetivo
B. HTML y XHTML
C. Extensiones de los archivos dinámicos
D. Insertar código PHP
1. Etiquetas de inserción
2. Inserción en el HTML
E. Mostrar el contenido
1. Mostrar texto
2. Insertar HTML
F. El código generado
1. Páginas dinámicas
2. Añadir elementos HTML estructurales
G. Comentarios
1. Utilizar los comentarios
2. Comentarios en una sola línea
3. Comentarios en varias líneas
4. Comentarios HTML
H. Variables
1. Utilizar las variables
2. Los diferentes tipos de variables
3. Definir una variable de texto
4. Definir una variable numérica
5. Definir una variable booleana
6. Visualizar una variable
7. La concatenación
8. Cálculos aritméticos
I. Tablas
1. Utilizar las tablas
2. Tablas numeradas
3. Visualizar un valor de una tabla numerada
4. Tablas asociativas
5. Mostrar un valor de una tabla asociativa
J. Las constantes
1. Utilizar las constantes
2. Definir une constante
3. Visualizar una constante
4. Utilizar una constante
K. Las condiciones
1. Utilizar las condiciones
2. Definir un test para una condición
3. Los operadores en las condiciones
4. Los test múltiples
5. Test en las booleanas
6. Condiciones con incorporación de HTML
7. Condiciones múltiples
8. Muchas condiciones
L. El bucle Mientras
1. Utilizar el bucle Mientras
2. Crear un bucle
3. Ejecución del bucle
M. El bucle Para
1. Utilizar el bucle Para
2. Crear un bucle
3. Ejecución del bucle
N. Elegir un bucle
O. Las funciones
1. Utilizar las funciones
2. Funciones existentes
3. Crear una función
4. El alcance de las variables en las funciones
5. Las variables globales
P. Funciones útiles en las variables
1. Probar si una variable está definida
2. Comprobar si una variable está vacía
Q. Insertar archivos
1. Objetivo
2. Las partes de una página
3. El archivo de la cabecera
4. El archivo del área central
5. El archivo de pie de página
6. El archivo maestro
7. Simplificar la estructura

Capítulo 3: Estructura de los temas

A. Objetivo
B. Archivos de temas
1. Archivos obligatorios
2. Archivo de personalización
3. Archivos de estructura
4. Llamada a los archivos
5. Código y vista generada
6. Ubicación de los elementos HTML

Capítulo 4: Jerarquía de las plantillas

A. Objetivo
B. Jerarquía de plantillas
C. Las plantillas
1. Plantillas de variable
2. Plantillas secundarias
3. Plantillas primarias
4. Plantilla obligatoria
D. Páginas de inicio
1. Página de inicio tipo blog
2. Página de inicio de tipo sitio clásico
E. Plantillas de artículos
1. Tipos de visualización
2. Plantillas de archivos adjuntos
3. Plantillas de contenidos personalizados
4. Plantillas para artículos
F. Plantillas de páginas
1. Tipos de página
2. Plantillas de páginas
3. Plantillas específicas
4. Plantillas estándar
G. Plantillas de archivo
1. Tipos de página
2. Plantillas de los archivos de autores
3. Plantillas de los archivos de categorías
4. Plantillas de archivos de tipos de contenido personalizado
5. Plantillas de la taxonomía de tipos de contenido personalizado
6. Plantillas de archivos calendario
7. Plantillas de etiquetas
H. Otras plantillas
I. Etiquetas de plantilla
1. Utilizar etiquetas de plantilla
2. Información sobre el sitio
3. Autor de entradas
4. Categoría de entradas
5. Etiquetas de inclusión
6. Categorías de etiquetas de plantilla
J. Funciones de referencia

Capítulo 5: Un tema sencillo

A. Objetivo
B. La carpeta del tema
C. Cabecera del tema
1. Estructura HTML
2. Insertar la información del sitio
3. Título del sitio en la cabecera
4. Codificación de caracteres
5. Enlace a los estilos
6. El paso de parámetros
7. Cabecera del tema
8. Título del sitio en el cuerpo de la página
9. Barra de menús
10. Área de contenido
11. Código de la cabecera
D. Contenido de la página de inicio
1. El archivo index.php
2. Llamada a la cabecera
3. El contenedor para las entradas
4. Visualización de entradas
5. Bucle simple
6. Llamadas a la barra lateral y al pie de página
7. Código completo
E. Barra de menú
F. Barra lateral
1. El archivo de funciones del tema
2. Archivo sidebar.php
3. Utilizar los widgets predeterminados
G. Pie de página
H. Archivo de estilos
I. Miniatura del tema
J. Preparar el paquete del tema
K. Visualización del sitio
1. Instalación del tema
2. Visualización del sitio con el tema
3. Añadir un menú
L. Entradas únicas
1. Ver entradas únicas
2. Incluir la cabecera
3. Mostrar el contenido de la entrada
4. Incluir la barra lateral y el pie de página
5. Código para las entradas únicas
6. Mostrar una entrada única
M. Páginas
1. Utilizar las páginas
2. Incluir las demás plantillas
3. Mostrar el contenido deseado
N. Estilos CSS
1. Utilizar los estilos
2. Estilos generales
3. Estilo de la cabecera
4. Barra de menús
5. Parte central
6. Entradas en la página de inicio
7. Barra lateral derecha
8. Pie de página
9. Visualización de la página de inicio
10. Entradas únicas
11. Páginas
12. Hoja de estilo

Capítulo 6: Un tema completo

A. Objetivo
1. Un tema completo
2. Arquitectura del tema
3. Diseño de los elementos
4. Arquitectura de los archivos
5. Carpeta del tema
B. Archivo style.css
C. Archivo functions.php
1. Ubicación de los menús
2. Ubicación de las barras laterales
3. Código completo
D. Cabecera de la página
1. Archivo header.php
2. Inicio del elemento 3. Título de las páginas 4. Enlaces 5. Código completo de la cabecera 6. Cuerpo de la página 7. Caja de la cabecera 8. Primera barra de menú 9. Título y descripción 10. Segunda barra de menú 11. Caja de contenido 12. Código completo para el cuerpo 13. Código completo E. Barras laterales 1. Archivos de las barras laterales 2. Formato de las barras laterales F. Pie de página 1. Archivo footer.php 2. Cierre de la caja de contenido 3. Caja del pie de página 4. Llamada al pie de página 5. Final de página 6. Código completo del pie de página G. Página de inicio 1. Archivo index.php 2. Cabecera y pie de página 3. Bucle de WordPress 4. Visualización de las barras laterales 5. Se utilizan las dos barras laterales 6. Solo se utiliza la barra lateral izquierda 7. Solo se utiliza la barra lateral derecha 8. No se utiliza ninguna barra lateral 9. Código completo 10. Vistas H. Entradas 1. Archivo single.php 2. Archivos de los formatos 3. Plantilla Estándar 4. Formato de la plantilla Estándar 5. Plantilla Minientrada 6. Otras plantillas de formatos de entradas I. Páginas 1. Archivo page.php 2. Archivo content-page.php 3. Plantillas de página J. Archivos 1. Archivo author.php 2. Archivo archive.php K. Buscar 1. Archivo search.php 2. Archivo content-search.php 3. Archivo content-none.php L. Páginas no encontradas

Capítulo 7: Personalización de los temas

A. Objetivo
B. Personalización predeterminada
C. Crear una personalización
D. Personalizar un color
1. Objetivo
2. Crear la personalización
3. Añadir una sección
4. Añadir un ajuste
5. Añadir un control
6. Código completo
7. Aplicar la personalización
8. Vista previa en vivo
9. Aplicar el color al tema
E. Personalizar un texto
1. Objetivo
2. Sección
3. Añadir un ajuste
4. Añadir el control
5. Código para el campo de texto
6. Visualización en el pie de página
7. Visualización de la personalización
F. Personalizar la visualización del texto
1. Objetivo
2. Añadir el ajuste y el control
3. Visualización en el pie de página
4. Visualización de la personalización
G. Personalizar la alineación del título del sitio
1. Objetivo
2. Añadir el ajuste y el control
3. Visualización en la cabecera
4. Visualización de la personalización
H. Personalizar la imagen de fondo de la cabecera
1. Objetivo
2. Añadir el ajuste y el control
3. Visualización como fondo de la cabecera
4. Visualización de la personalización

Capítulo 8: El tema Twenty Fifteen

A. Objetivo
B. Archivos del tema
1. Archivos
2. Carpetas
3. Otros archivos
C. Estructura del tema
1. Visualización del tema
2. Archivos de estructura
3. Archivo header.php
4. Archivo footer.php
5. Archivo sidebar.php
D. Visualización de contenidos
E. Página de inicio
1. Archivo index.php
2. Archivo content.php
3. Archivo content-link.php
F. Entradas en página única
1. Archivo single.php
2. Archivo content.php
3. Archivo author-bio.php
4. Archivo comments.php
5. Estructura del archivo single.php
G. Páginas
1. Archivo page.php
2. Archivo content-page.php
H. Archivos
1. Archivo archive.php
2. Archivo content-none.php
I. Buscar
1. Archivo search.php
2. Archivo content-search.php
3. Archivo content-none.php
J. Otras plantillas
1. Archivo 404.php
2. Archivo image.php

Capítulo 9: Los temas hijos

A. Objetivo
B. Carpeta del tema hijo
C. Miniatura del tema hijo
D. Hoja de estilo del tema hijo
1. Archivo CSS
2. Importar estilos padres
3. Crear estilos hijos
E. Otros archivos
F. Archivo functions.php
1. Apertura de archivos
2. Añadir una función
G. Instalar el tema hijo

Capítulo 10: Los temas starter

A. Objetivo
B. Temas starter
C. El tema starter underscores
1. Utilizar el tema
2. Crear un tema propio
3. Archivos disponibles
D. Tema starter Bones
1. Utilizar el tema
2. Archivos disponibles
E. Tema starter Quark
1. Utilizar el tema
2. Archivos disponibles
índice

En caso de estar interesado como técnico elearning puedo desarrollar/montar un curso basado en el contenidos de este manual en modalidad teleformación así como impartirlo/tutorizarlo. En este sentido aquellas empresas y/o profesionales interesados pueden contactarme sin ningún compromiso.

En caso de estar interesado en organizar un curso elearning basado en los contenidos de este libro no dudes en contactarme.