Personaliza Wordpress y mejora el

Personaliza Wordpress
Creación y personalización de websites.
06 de Junio de 2015

1. Presentación
2. Introducción a WP 4.X
3. Instalación
4. Configuración e instalación del
profile
5. Wocommerce
6. Contact form 7
7. Wordpress SEO By Yoast
8. W3 Total Caché
9. Visual composer
10. Nuestro primer plugin
Índice

¿Quién soy?
Conoce Wordpress
1. Presentación
- Alberto Pérez
Twitter: https://twitter.com/albertozgz1
Google plus: https://plus.google.com/u/0/
Desarrollo proyectos a medida para todo tipo de clientes en el área de Internet de
Hiberus Tecnología.

Matt Mullenweg
Conoce Wordpress
2. Introducción a Wordpress

Qué es Wordpress
Conoce Wordpress
Wordpress es un Sistema de Gestión de Contenidos, CMS de las siglas en inglés, gratis y
con licencia Open Source usado para publicar y mantener cualquier tipo de sitio web
desde una página personal hasta una intranet corporativa.

Versiones
Conoce Wordpress
- Rama 0 (May 27, 2003) a la 0.72
- Versión inicial de Wordpress
- Rama 1.0 a la 1.5.2
- Rama 2.0 a la 2.0.11
- Rama 2.1 a la 2.1.3
- Rama 2.2 a la 2.2.3
- Rama 2.3 a la 2.3.3
- Rama 2.5 (11-jun-2008) a la 2.9
- Rama 3.0 a 3.9
- En la versión 3.7 lanzan una actualización que maneja las actualizaciones automáticas del
core de WP y que podemos desactivar añadiendo en el archivo wp-config.php la
siguiente sentencia: define( 'WP_AUTO_UPDATE_CORE', false ); En la página Codex de
Worpdress podremos obtener un listado de todas las actualizaciones que podemos
manejar: https://codex.wordpress.org/Configuring_Automatic_Background_Updates
- Rama actual 4.x

Características principales de Wordpress
Conoce Wordpress
- Su estructura modular altamente configurable es una de sus características más
importantes.
- Es administrable desde el propio navegador web.
- Es muy flexible a la hora de mostrar el contenido.
- Su apariencia es modificable y consistente en todo el sitio.
- GRAN COMUNIDAD DE USUARIOS
Su motivo principal de éxito es su gran flexibilidad, ofrece multitud de operaciones de
ampliación y personalización tanto para los maquetadores como para los
programadores.
Esto hace que sea la herramienta ideal para sitios que requieren un alto nivel de
personalización o para aquellos que necesitan desarrollar funcionalidades a medida.
Permite publicar y compartir artículos, imágenes o cualquier otro tipo de archivos y
servicios añadidos como foros, votaciones, blogs, ecommerce…

Estadísticas de uso
Conoce Wordpress
A Octubre de 2014, aproximadamente el 38% de todas las web que podemos
encontrar en internet son gestionadas por CMS. Considerando las webs generadas por
CMS, encontramos cifras como que WordPress es usado en un 61.1% de las veces,
Joomla un 7.8%, Drupal un 5.1%, Blogger un 2.8%, Magento un 2.7%.
Para hacernos una idea, el número de webs estimadas en Internet es
aproximadamente 1.095.440.000 a fecha de Octubre de 2014. Lo que quiere decir que
el número aproximado de páginas creadas en WordPress es 254.339.259, 32.468.841
en Joomla, 21.229.627 en Drupal, 11.655.481 en Blogger y 11.239.214 en Magento.
WordPress
61.1%
Joomla
7.8%
Drupal
5.1%
Blogger
2.8%
Magento
2.7%
Otros
20.5%
0

Requisitos para instalar Wordpress
Primeros pasos
2. Instalación y primeros pasos
Un sistema base, tiene que tener como mínimo 1 core de 1,5 GHZ a 64 bits, 2 GB de
RAM, disco en RAID 1 o superior por hardware
Bueno, aquí nos ceñimos a la información actual que ofrece WordPress a la hora de
definir los requisitos mínimos para instalar.
Estos son:
- PHP versión 5.2.4 o superior.
- MySQL versión 5.0 o superior.

Empezando a instalar wordpress
Primeros pasos
1 – Creación del entorno (Configuración host + vhost + descarga del aplicativo en
es.wordpress.org)
2 – Creación de la base de datos
3 – Empezando a instalar wordpress
1 – Revisar los permisos del directorio (755 para direct. y 644 para ficheros)
2 – Configurar nuestro wp-config.php e instalación de la BD
3 - ¿Te acuerdas de que la versión 3.7 trajo actualizaciones automáticas no?

Toda ha ido bien . Ya has instalado tu WP
Primeros pasos

Configuración e
instalación del
profile
4

4. Configuración y manejo
Primeros pasos tras la instalación
Manual Introducción
- ¿Qué hacer tras mi instalación?:
o Instalar mi profile (Es recomendable tener una carpeta en nuestro PC con todos los
plugins que solemos usar para «llegar y engranar»). Subiríamos la carpeta con
todos los plugins al directorio wp-content/plugins, iriamos a nuestro panel
de administración y actualizaríamos los plugins siempre mirando
previamente el «changelog» de cada uno de ellos. ¡SUPERIMPORTANTE! .
Lógicamente nuestros módulos previamente descargados deberían ir en
correspondencia a nuestra versión de WP.
o Configurar cada uno de los plugins en caso de no tener incluido en el profile
una .sql
o Configurar nuestras urls amigables desde ajustes > enlaces permanentes
o Si estamos en desarrollo … MUY IMPORTANTE habilitar la opción «Disuade a
los motores de búsqueda…» desde Ajustes > lectura. Deshabilitar, al subir la
web a producción
o Configurar usuarios y roles. Yo uso el plugin user role editor y frontend admin
menu

Primeros pasos tras la instalación
- ¿Qué hacer tras mi instalación?:
o Dejar configurado las cookies de nuestro sitio web. Yo uso el plugin Cookie
Law Info
o Configurar el envío de emails. Es posible que más de una vez hayáis instalado
un plugin de envío de emails y no os lleguen, es muy probable que sea por
motivos de configuraciones «SMTP», si hacéis envíos y no os llegan debéis
probar a instalar un plugin de SMTP, yo uso easy WP SMTP y poner vuestros
datos de configuración (vuestro hostings podrá ayudaros)
o Configurar XML Sitemap para dar a google todo mascado y evitar problemas
de indexación. Para esto tenemos varias opciones, a mi parece la mejor es
instalar el plugin Google XML Sitemap, pero si tenemos instalado el plugin de
«Wordpress SEO by Yoast» también nos ofrece esta posibilidad.
o MUY IMPORTANTE: Dejar configurado un sistema de backups, tenemos que
tener copias de seguridad mientras estamos trabajando para evitar sustos.

Evita estas configuraciones con un profile
- Todas estas configuraciones anteriores podemos evitarlas si tenemos un profile
con todos nuestros plugins y una .sql de nuestro wordpress la cual tendrá ya las
configuraciones de estos plugins. (URL para descargar plugins:
http://es.wordpress.org/plugins/)
- ¿Qué profile estoy usando yo?. Para la vesión de Wordpress 4.2.x yo estoy usando
los siguientes plugins en cualquier instalación básica de wordpress (Sin tener en
cuenta woocommerce)
1. Contact form 7
2. Contact form DB extension
3. Cookie law info
4. Custom login
5. Disable comments
6. Easy WP SMTP
7. Embed any document
8. Frontend admin menu
9. Google sitemap XML
10. Visual Composer
11. LayerSlider
12. Meta Box
13. Post duplicator
14. Really simple captcha
15. Redirection
16. WPML
17. TinyMce
18. User Role Editor
19. Wordpress SEO by Yoast
20. WP Migrate DB

5. WooCommerce
¿Qué es woocommerce y cómo usarlo?
- Es una herramienta muy sencilla e intuitiva que permite montar una tienda online
“pequeña”. Y está traducida al castellano. También tiene una buena batería de
plugins que complementan las funcionalidades básicas de WooCommerce, además
se integra con “WPML” y esto nospermite tener una tienda multilingüe, traduciendo
todo el contenido y productos a los idiomas que se establezcan, incluso puedes
tener productos diferentes para cada idioma.

5. WooCommerce
Notición
- WordPress ha comprado WooThemes, la empresa detrás del popular plugin
WooCommerce.

5. WooCommerce
Paypal – modo sandbox
- https://developer.paypal.com/developer/accounts

5. WooCommerce
Otros plugins
- Jigoshop: https://www.jigoshop.com/
- WP eCommerce: https://wordpress.org/plugins/wp-e-commerce/
- TheCartPress: https://wordpress.org/plugins/thecartpress/

6. Contact form 7
¿Qué es contact form 7 y cómo usarlo?
- Contact form 7 es un potente plugin de creación de formularios para envío de emails
a través de nuestra página web. Es muy flexible y permite configurar nuestro
formulario libremente. Además cuenta con alguna extensión como es Contact form 7
database que guarda todos nuestros envíos en una BD y permite gestionarlos
mediante shortcodes

6. Contact form 7
Analítica en contact form 7
- Para añadir una analítica sobre la página de «Gracias» de nuestro formulario
podemos añadir en la configuración adicional lo siguiente:
on_sent_ok: "location.replace('http://www.webquesea.com/paginadegracias'); "
Esta página contendrá el js del evento.

6. Contact form 7
SMTP
- Si el email no os llega acordaros de
revisar la configuración SMTP.
- Aconsejo el plugin: Easy WP SMTP

6. Contact form 7
Otros plugins
- Cforms. Es mucho más completo pero más complejo.
- Contact form builder
- Custom Contact Forms
- https://wordpress.org/plugins/search.php?q=contact

7. Wordpress SEO
¿Qué es Wordpress SEO y cómo usarlo?
- Wordpress SEO by Yoast es un plugin muy potente y que tenemos libre en el propio
repositorio de Wordpress. Cuenta con numerosas funciones de configuración SEO, las
más destacadas puedan ser el cambio de Titulos y metas a nivel general y a nivel
particular, configuración del sitemap XML, enlaces permantentes…

7. Wordpress SEO
Otros plugins
- All in one SEO Pack https://wordpress.org/plugins/all-in-one-seo-pack/
- SEO Ultimate https://wordpress.org/plugins/seo-ultimate/

8. W3 Total Cache
¿Qué es W3 Total Cache y cómo usarlo?
- W3 Total Cache es uno de los plugins más útiles de WordPress. Su principal función es
almacenar en cache las páginas, objetos y consultas a la base de datos para dar una
respuesta mas rápida

8. W3 Total Cache
Otros plugins
- WP Super Cache, es potente y sencillo de usar e incluso a veces mucho más efectivo
que W3 Total Cache. Pertenece a Automatic, empresa de Wordpress.
https://wordpress.org/plugins/wp-super-cache/
- Quick cache https://wordpress.org/plugins/quick-cache/

9. Visual composer
¿Qué es visual composer?
- Visual composer es un plugin, que nos agiliza el trabajo enormemente ya que con
este módulo podemos realizar plantillas desde cero con un gran diseño tanto para
desktop como para móviles y tablets.
- Es un módulo que dispone de números «componentes» y es muy flexible
- La parte «mala» es que algo tan potente no puede ser gratis, y es que este
módulo es de pago, cuesta 33$ en codecanyon.net
- Otras ventajas es que de cara el usuario es muy
cómodo ya que puede editar el contenido desde el
propio frontend como si de una hoja word se tratara
(Ahora wordpress ha desarrollado un modulo que realiza
esto pero esta todavía en BETA ->
http://es.wordpress.org/plugins/browse/beta/)
- Esta disponible para wordpress 3.5 en adelante

9. Visual composer
Empezando con visual composer
- Vamos a ver el potencial que puede llegar a tener visual composer.

10.Nuestro primer plugin
Empecemos a desarrollar
- A continuación vamos a desarrollar un módulo de suscripción de usuarios. Antes
de comenzar a meter mano en las tripas de wordpress es fundamental conocer la
guía del programador o mejor dicho la codex de Wordpress.
- La codex de wordpress, es como la wiki que nos ayuda desde dar los primeros
pasos con wordpress ha estar día tras día en ella buscando funciones que se
adapten a lo que necesitamos.
- La url de la codex es: https://codex.wordpress.org/

Estructura de un módulo
- Archivo principal en el raiz. En este
caso frontend-admin-menu.php,
además debe llamarse como el
módulo.
- El raíz debe contener un Readme.txt y
una License.txt en caso de que
queramos subirlo al repositorio de WP
- Deberemos diferencia los archivos en
«backend» y «frontend», en este caso
se ha separado el backend en la
carpeta «admin» mientras que el
frontend es ejecutado todo desde el
raiz

Archivo principal del raiz
- Para que nuestro módulo aparezca en la pestaña de «Plugins» de nuestro
Wordpress debe estar dentro de wp-content/plugins y además el archivo
principal del raíz empezar de la siguiente forma (En este caso el módulo es
frontend admin menu)

Añadir row metas debajo de la descripción
- Los row metas suponen una ayuda para el usuario. Si queremos usarlo
deberemos usar el siguiente hook: miplugin_row_meta ( $links, $file )
- Más información:
https://codex.wordpress.org/Plugin_API/Filter_Reference/plugin_row_meta

Hooks de activación, desactivacion y desinstalación
- Debemos registrar nuestras funciones de activación y desactivación mediante
un register_action_hook, mientras que la desinstalación de un modulo
podemos realizarla mediante un archivo en el raíz llamado uninstall.php
- https://codex.wordpress.org/Function_Reference/register_activation_hook
- https://codex.wordpress.org/Function_Reference/register_deactivation_hook

Añadir menú en la administración
- Usaremos el siguiente add_action: admin_menu
- 1 parámetro: Titulo de la página
- 2 parámetro: Título del menú
- 3 parámetro: Permisos
- 4 parámetro: Slug o URL a donde tiene que apuntar
- 5 parámetro: Función callback
- 6 parámetro: Icono
- Más información: https://codex.wordpress.org/Administration_Menus

Añadir JS y CSS en backend y frontend
- Como bien hemos visto en la estructura del módulo separamos los css y jss
tanto del frontend como del backend. Es innecesario cargarlos si no vamos a
usarlos. Por lo tanto vamos a cargar por un lado css y js del admin con el
add_action «admin_enqueue_scripts» y por otro lado los del frontend con el
add_action «wp_enqueue_scripts»
https://codex.wordpress.org/Plugin_API/Action_Reference/admin_enqueue_s
cripts
- https://codex.wordpress.org/Plugin_API/Action_Reference/wp_enqueue_scri
pts

Añadir JS y CSS en backend y frontend

www.hiberus.com
info@hiberus.com

Personaliza Wordpress y mejora el

Recomendados

Recomendados

Más contenido relacionado

La actualidad más candente

La actualidad más candente (18)

Destacado

Destacado (20)

Similar a Personaliza Wordpress y mejora el

Similar a Personaliza Wordpress y mejora el (20)

Más de Hiberus Tecnologia

Más de Hiberus Tecnologia (12)

Último

Último (16)

Personaliza Wordpress y mejora el