Post on 02-Oct-2018
Taller creación de web presencial con
wordpress
Carlos Pérez Ximénez de Embún
Cámara Zaragoza
Indice
1. ¿Qué son wordpress.com y wordpress.org?
2. Ejemplos de web hechas con wordpress
3. Instalación de wordpress
4. Principales funcionalidades
• Tipos de contenidos y taxonomías: posts y páginas, categorías y
etiquetas.
• Editor visual
• Gestión de media
• Comentarios
5. Personalización:
• Búsqueda de temas visuales e instalación
• Cómo editar un tema visual
6. Plugins:
• Dónde buscar y cómo instarlos
• Los más usados: analítica web, seo, gestión de tipos de contenido y
posts, etc.
7. Práctica
¿Qué son wordpress.com
y wordpress.org?
Wordpress
¿Qué es Wordpress?
• Es un gestor de contenidos (CMS)
• Enfocado inicialmente a la creación de blogs
• Tecnologías abiertas (PHP, MySQL)
• Código libre
Wordpress
¿Por qué su éxito?
• Fácil de usar
• Muy flexible
• Gran comunidad de desarrolladores y diseñadores
Todo ello lo ha convertido en el CMS más usado en el mundo.
Wordpress
Distinguir Wordpress
• www.wordpress.org web del proyecto de desarrollo del software (código)
de wordpress.
• es.wordpress.org web del proyecto en español, permite la descarga de
las distintas versiones de wordpress con la traducción y configuración al
idioma español ya realizadas.
• www.wordpress.com servicio online para que los usuarios creen su blog,
tiene versión gratuita y de pago. Frente al wordpress que nosotros podemos
instalarnos cuenta con una serie de limitaciones, y por el lado contrario con
algunas herramientas adicionales preinstaladas.
Wordpress
Wordpress.com Planes: https://store.wordpress.com/plans/
Ejemplos de web
Instalación
Instalación
¿Qué necesitamos?
• Disponer de un alojamiento web con:
• acceso FTP
• Versión de PHP 5.6 o superior
• Disponer de una base de datos MySQL
• Versión de MySQL 5.5 o superior
Dónde encontrar alojamiento
Todos los proveedores de alojamiento cuentan con tipo de soluciones orientadas a
PYMEs.
Paquetes habituales:
• Personal/starter: sólo se puede tener un dominio+ftp+mysql configurado, recursos
limitados (suficientes para empezar)
• Profesional/Unlimited: múltiples dominios, ftps, bases de datos y cuentas de correos
electrónicos. Mayor cantidad de recursos.
• Performance/Plus: Garantiza más recursos al alojamiento que el
profesional/unlimited.
Ejemplos de proveedores:
• https://dinahosting.com
• http://www.arsys.es
• http://www.1and1.es
• https://www.ovh.es y muchos más… google
Instalación
Descargar Wordpress en español
• Existen muchos proveedores de alojamiento que permiten preinstalar
wordpress desde sus paneles de gestión.
• Si tenemos o queremos hacerlo nosotros iremos a es.wordpress.org y
descargaremos la última versión disponible.
Instalación
Descomprimir y subir
Una vez descargado deberemos:
1. Descomprimir la carpeta wordpress del archivo comprimido
2. Subir el contenido de la carpeta wordpress en la ruta que deseemos de
nuestro alojamiento web, normalmente la raíz de la web
(www.midominio.com) o la carpeta blog (www.midominio.com/blog/).
Instalación
Permisos de carpeta y archivos
La mayoría de alojamientos están preparados actualmente para no tener que
configurar permisos adicionales a las carpetas y archivos para el correcto
funcionamiento de nuestro wordpress.
Pero si necesitamos modificarlos aquí podemos ver la información detallada:
http://codex.wordpress.org/Changing_File_Permissions
Wordpress y muchos de sus plugins incluyen un sistema de aviso a través del
panel de administración para advertirnos que es necesario modificar permisos
de archivo.
Instalación
Instalando Wordpress
Una vez que hemos subido nuestro wordpress accederemos a la dirección web
en que estará nuestro blog (Ej: www.midominio.com).
Deberá salirnos el asistente de instalación de Wordpress, en caso contrario
deberemos revisar todos los pasos realizados y la configuración del dominio.
Instalación
Paso 1
Introduciremos los datos de conexión a la base de datos mysql.
Esto creará un archivo wp-config.php que se grabará en la raíz de nuestro sitio
e incluirá la información de conexión a la base de datos, paquete de idioma y
otras variables de carácter general.
Instalación
Paso 2
Completamos la información para
crear el usuario administrador de
nuestro panel de gestión.
Instalación
Paso 6
¡Ya tenemos nuestro wordpress!
Principales funcionalidades
Acceso al Panel de Administración
www.midominio.com/wp-admin/
www.midominio.com/wp-login.php
El panel y su funcionamiento
El panel y su funcionamiento
Conceptos básicos
Tipo de contenido
Entrada
Página
Taxonomía
Categorías
Etiquetas
Más Info:
• https://codex.wordpress.org/Post_Types
• https://codex.wordpress.org/Taxonomies
El panel y su funcionamiento
Crear / Editar una entrada
El panel y su funcionamiento
Crear / Editar una página
Personalización
El theme y la configuración de nuestro sitio
Paso 1: configuraciones generales de nuestro wordpress
El theme y la configuración de nuestro sitio
Paso 2: instalar o configurar mi tema
Apariencia > Temas
El theme y la configuración de nuestro sitio
Paso 2: configurar el menú de navegación
Apariencia > Menús
El theme y la configuración de nuestro sitio
Paso 3: configurar las zonas de widgets
Apariencia > Widgets
Dónde Encontrar Themes
Gratuitos:
• https://wordpress.org/themes/ (también accesible en Apariencia>Temas)
• https://colorlib.com/wp/free-wordpress-themes/ (recopilación de themes de
wordpress.org)
De pago:
• http://themeforest.net/category/wordpress
• http://www.templatemonster.com/es/temas-wordpress-tipo/
• http://www.elegantthemes.com/gallery/
A la hora de buscar theme:
• Definir primero las necesidades (presencial, blog, gallería imágenes, etc)
• Definir estructura aproximada y temática para realizar la búsqueda
Plugins
Plugins
Formularios de contacto, páginas de contacto:
• Contact Form 7
• Fast Secure Contact Form
• Simple contact form
• …
Plugins
Editor visual, videos
• TinyMCE Advanced (más opciones editor visual)
• Black Studio TinyMCE Widget (más opciones editor visual)
• Vixy YouTube Embed and Download (insertar videos y canales youtube)
• TablePress (manejar tablas)
• …
Plugins
Google Maps:
• WP Google Maps
• Comprehensive Google Map Plugin
• …
Google Analytics:
• Google Analytics for WordPress
• Google Analyticator
• …
Plugins
SEO:
• All in One SEO Pack (paquete seo completo)
• WordPress SEO by Yoast (paquete seo completo)
• SEO Ultimate (paquete seo completo)
• Google XML Sitemaps (sitemap)
• Yet Another Related Posts Plugin (YARPP) (posts relacionados)
• Related Posts (posts relacionados)
• …
Plugins
Social Media:
• Share Buttons by AddToAny (botones de compartir)
• ShareThis
• AddThis
• Pinterest "Pin It" Button (compartir imágenes en pinterest)
• WP MashSocial Wigdet (widget con todos los perfiles en redes sociales)
• Social Media Widget (widget con todos los perfiles en redes sociales)
• Floating Social Media Icon (widget con todos los perfiles en redes sociales)
• …
Plugins
Imágenes, galerías y publicidad:
• NextGEN Gallery (galerías de imágenes)
• Lightbox Plus ColorBox (zoom imagen y galerías)
• Gallery (galerías de imágenes)
• AdRotate (publicidad)
• Smooth Slider (Slider de imágenes)
• Meta Slider (Slider de imágenes)
• …
Plugins
Seguridad y rendimiento:
• WP Super Cache (sistema de cache)
• W3 Total Cache (sistema de cache y minificación)
• WP-DB-Backup (backup base de datos)
• UpdraftPlus Backup and Restoration (backup ha distintos servicios
externos: Dropbox, Drive, FTP, etc.)
• Better WP Security (paquete integral seguridad)
• Acunetix WP Security (paquete integral seguridad)
• All In One WP Security & Firewall (paquete integral seguridad)
• …
Plugins
Otros:
• bbPress (foros)
• BuddyPress (red social)
• WooCommerce (ecommerce)
• WP-PageNavi (mejora navegación posts)
• All-in-One Event Calendar (Calendario de eventos)
• The Events Calendar (Calendario de eventos)
• …
Proyecto ejemplo
Proyecto ejemplo
Tienda de cocinas.
Menú:
• Inicio (slide fotos y breves con acceso a otros apartados)
• La Empresa (video y texto sobre la empresa)
• Trabajos realizados (galería de imágenes con breve descripción)
• Ofertas (utilizaremos las entradas)
• Solicitar presupuesto (formulario con datos básicos para contactar)
• Localización y contacto (google maps, info contacto y formulario)
Pie:
• Enlace a perfiles social media
• Repetir menú
• Info de contacto
Proyecto alumno
1. Define la estructura del sitio
2. Estudia como abordar tus necesidades usando:
1. Tipos de contenido y Formatos de entrada
2. Taxonomías
3. Configuraciones de Wordpress
4. Plugins o funcionalidades necesarias
3. Busca un theme acorde a tus necesidades y Proyecto
4. Parametriza wordpress
1. Configuración
2. Menús
3. Zonas de Widgets
4. …
5. Carga contenido
¡Y pregunta lo que necesites!
gracias