Taller+de+wordpress+avanzado+2

WORDPRESSWORDPRESS
AVANZADOAVANZADOAVANZADOAVANZADO
@merchanjavier
jmerchan@mkg20.com
Skype: jmerchancorrea

Objetivos del curso
1.- Adquirir una visión estratégica sobre nuestra web como herramienta
de venta.
2.- Conocer los elementos básicos del entorno web: dominio, hosting,
bbdd.bbdd.
3.- Aprender a diseñar una página web atractiva y profesional, que
incorpore un gestor de contenidos fácilmente editable.
4.- Conocer los requisitos necesarios de instalación y seguridad para
mantener el sistema estable y a salvo de ataques.
5.- Adquirir conocimientos de personalización de plantillas y plugins.
6.- Saber implementar la web en varios idiomas, conociendo sus ventajas
e inconvenientes.
7.- Aprender técnicas de posicionamiento SEO a través de plugins.

1. INTRODUCCIÓN AL DISEÑO WEB Y CMS
Que son los gestores de contenido de código abierto.
CMS más usados y principales diferencias entre ellos: Joomla, Wordpress y Drupal.
El entorno web
Dominios y Hosting
Aspectos básicos del Diseño Web
2. WORDPRESS
Contenidos del Módulo
2. WORDPRESS
Instalación de Wordpress en un servidor remoto (hosting)
Instalación de Wordpress en local (banco de pruebas)
El panel de control de Wordpress
Uso de plantillas. Modificar la apariencia de nuestra web
Retoque de plantillas. El tema hijo
Plugins. Instalación y configuración de los más usuados.
Los idiomas en tu web. WP Multilingue.
Ajustes imprescindibles
Trucos para optimizar tu Wordpress
3. POSICIONAMIENTO SEO
Principios básicos del SEO
Configura tu Wordpress para posicionarte en los primeros puestos de Google

1. INTRODUCCIÓN AL DISEÑO WEB
Y CMSY CMS
CMS: CONTENT MANAGEMENT
SYSTEM
GESTOR DE CONTENIDOS

GESTORES DE CONTENIDO DE
CÓDIGO ABIERTO
Un CMS o Sistema de Gestión de Contenidos es
según la wikipedia...
según la wikipedia...
“…programa que permite crear una estructura de soporte
(framework) para la creación y administración de contenidos,
principalmente en páginas web, por parte de los
administradores, editores, participantes y demás roles…”
“…controla una o varias bases de datos donde se aloja el
contenido …”

Porqué un CMS
• Los que vamos a ver son Software libre de
código abierto mejor que opciones privadas.
• Facilidad de gestión.• Facilidad de gestión.
• Ahorro de costes de diseño y mantenimiento
• Cantidad de posibilidades.
• Apoyo profesional (themes, plugins,etc..)
• Soporte inigualable.

CMS MÁS USADOS Y DIFERENCIAS
• Webs y Blogs: Wordpress, Drupal, Joomla
Un Sistema de Gestión de Contenido Web es una herramienta que permite crear,
editar, modificar y publicar contenidos Web, especialmente portales Web, ya estén
dirigidos a una audiencia interna o externa. Suele incluir gestión de usuarios, permisos,
búsquedas, entornos colaborativos, etc.
• Foros: FluxBB, Vanilla2, Simpleboard• Foros: FluxBB, Vanilla2, Simpleboard
• Wikis: Wikia, Mediawiki
Foros y Wikis facilitan la participación de diferentes usuarios y equipos de trabajo para
trabajar de forma colaborativa. Permiten el acceso y la gestión de contenidos a
diferentes tipos de usuarios.
• E-learning: Moodle
Permiten la gestión de un sistema de formación online de manera fácil.
• Comercio electrónico: Prestashop, Opencart, Magento
Son sistemas de gestión de venta online con facilidad para actualizar productos, precios,
promociones, tipos de pago, etc..

Elección de un CMS
Elegir un CMS requiere un estudio de posibilidades
Existen cientos de soluciones disponibles con
características diferenciadas.características diferenciadas.
CMS orientados a:
La facilidad de administración
La simplicidad de Instalación.
Estándares implantados
Usuarios técnicos o sin conocimientos
Mayor Flexibilidad pero también Complejidad

Preguntas para decidirte por un CMS
Objetivos del portal: Informar, vender, gestionar,
formar, etc..
Complejidad de la estructura: portal sencillo,
integración de multitud de aplicaciones y
herramientas, etc..
integración de multitud de aplicaciones y
herramientas, etc..
Usuarios del CMS: Habilidad Informática, numero de
usuarios, cantidad y tipos de funciones y tareas,
frecuencia de actualización, etc..
Seguridad
Cumplimiento de estándares de usabilidad
Multilenguaje: Idiomas en los que irá el contenido

Aspectos diferenciadores de un CMS
Licencia: Gratuita / Premiun
Posicionamiento en el mercado: Cuantos más mejor.
Valoración por los expertos: Cual es el mejor en su
rangorango
Características funcionales:
Requisitos del sistema
Seguridad
Soporte
Facilidad de uso
Modelo comercial y de negocio.
Rendimiento (servidores)
Administración
Interoperabilidad entre sistemas
Flexibilidad

Principales CMS para DISEÑO WEB
PHP
MYSQL
APACHEAPACHE

DRUPAL
• CMS muy flexible pero a la vez más complejo.
• Muy recomendado para grandes proyectos
• Requiere de buenos conocimientos.
Muy bien valorado por sus usuarios 70 % +• Muy bien valorado por sus usuarios 70 % +
• 65 libros impresos sobre Drupal (13 del 2011)
• Permite una personalización de hasta el mínimo
detalle.
• Seguro, escalable y de buen rendimiento.
• Ejemplos: WHITE HOUSEy CAMPER

JOOMLA
• En 2011 2º CMS más descargado..
• Potente CMS que permite crear sitios Web
elegantes, dinámicos e interactivos de forma
simple.simple.
• Bien valorado por sus usuarios 50 % +
• Proyectos WEB Medios / Grandes
• Requiere especialización
• Comunidad muy amplia y participativa.
• Ejemplos: GUGGENHEIM y NACIONES UNIDAS

WORDPRESS
• CMS más descargado y conocido.
• Orientado a Blogs en sus origenes, muy completo en la actualidad.
• Instalación y administración muy simple.
• Proyectos pequeños y medios sencillo
• Proyectos grandes exige conocimientos y experiencia• Proyectos grandes exige conocimientos y experiencia
• Mejor valorado por los usuarios 75 % +
• Actualizaciones constantes, + amplia variedad de temas, plugins,
etc..
• Mejor herramienta para Comunicación 2.0 (comentarios, enlaces,
compartir, etc..)
• Ejemplos: ANGEL CAMACHO, FIBES, CNN ESPAÑOL

¿Porqué WORDPRESS?
• WordPress es el CMS del presente y del futuro
• Más utilizado para DISEÑO WEB:
– Está en desarrollo continuo y muy activo. Mejor
soportesoporte
– Mayor información en Internet.
– Actualizaciones constantes
– Mayor numero de complementos.
• Facilidad de uso
• Gran capacidad de Posicionamiento SEO
• La tecnología antispam de Akismet

ENTORNO WEB

Que necesitamos para empezar
Hosting – Alojamiento
1 Dominio1 Dominio
Archivos – Core: PHP Y JS
Base de datos: MYSQL
Cliente FTP

Hosting/ Alojamiento web
• Una web está compuesta de archivos que necesitan
un espacio.
• Un espacio en un ordenador remoto gestionado por
un administrador.un administrador.
• Alojamiento compartido vs dedicado.
• La importancia de un buen alojamiento (No
Gratuito): capacidad, velocidad, seguridad
• Alojar multimedia en terceros
• Un hosting puede albergar infinitas webs

Dominio
• Es el identificador único de un sitio web.
Registramos un dominio para dar una dirección
donde encontrar mi web: www.dominio.com
• Un dominio traduce una IP (192.0.32.10 ) para• Un dominio traduce una IP (192.0.32.10 ) para
que sea fácilmente reconocible y memorizable.
• La extensión nos proporciona información:
.es
.com
.org
.edu
.gov
.xxx ,etc…

Archivos - CORE
Wordpress 3.2 Descargar y subir al
Hosting

Base de Datos
• Web 2.0 es básicamente una Web basada en
las bases de datos
Formato Vs
Contenido
El Contenido se
indexa en BBDD
MYSQL
PHPMyAdmin

Cliente FTP
• File Transfer Protocol = Protocolo Transferencia
de Archivos
• Lo usaremos para “gestionar”archivos
• Un cliente FTP se conecta a un servidor para
subir/ descargar archivos.
• Necesitamos:
o Dirección servidor
o Usuario
o Contraseña

ASPECTOS BÁSICOS DEL DISEÑO WEB

¿Québuscamos?
LAS 4 PATAS DEL DISEÑO WEB
Twitter/MKG20 - Javier Merchán
¿Québuscamos?

ACCESIBILIDAD
ASPECTOS BÁSICOS DEL DISEÑO WEB
El sito web pueda verse correctamente en
todos los entornos y en la mayoría de los
usuarios
→ Dispositivos Sistemas operativos y
navegadores
→ Velocidades de conexión
→ Resoluciones de pantalla

USABILIDAD
Nuestro objetivo el usuario:
Aspecto relacionado con la facilidad que
un usuario (nuestro usuario) podrá
navegar por la web, encontrar lo que
busca, descargar archivos sin dificultad,
completar procesos de forma sencilla:
Formularios, Carros de compra,… Uso
Intuitivo de nuestra web.

INDEXABILIDAD
Nuestro objetivo: los buscadores.
Generación de tráfico
INDEXABILIDAD

SOCIABILIDAD
Nuestro objetivo: La comunidad
Establecer vínculos de relación con
clientes, colaboradores,
profesionales, amigos, etc...

Muestra claramente el objetivo de tu web: vender, informar, comprar,
exportar ,franquiciar, contactar
No hagas esperar: rápida carga
Atrae la atención y dirígela
Pon primero lo que te define
A tener en cuenta
Pon primero lo que te define
Navegación Intuitiva Mapa Web
Diseño sencillo , elegante y que respete y trasmita tu imagen corporativa.
Lenguaje orientado al target.
Formato de texto y contraste que facilite la lectura
Comentarios: control y moderación
Seguridad: contraseñas, actualizaciones y protecciones
Optimización SEO: Robots, enlaces amigables, titulos y descripciones
Aviso Legal

EL CÓDIGO ES POESÍA
WordPress es una avanzada plataforma semántica deWordPress es una avanzada plataforma semántica de
publicación personal orientada a la estética, los
estándares web y la usabilidad. WordPress es libre y,
al mismo tiempo, gratuito.
2. WORDPRESS

La mayoría de los CMS funcionan de la siguiente manera:
→Necesitamos un servidor web con capacidad de procesado PHP y un
servidor de Base de Datos MYSQL.
ARCHIVOS PHP BBDD
Que hace falta saber para instalar Wordpress
+

2.1 INSTALACIÓN EN LOCAL
1. Porqué y para qué se instala en local.
2. Xampp: Convertir nuestro PC en un servidor
3. Instalar WP en nuestro PC3. Instalar WP en nuestro PC
2. WORDPRESS/LOCAL

Porque usar un servidor local:
Podemos trabajar sin conexión
a internet.
Podemos hacer infinitas
pruebas.
Podemos hacer infinitas
pruebas.
La instalación y gestión es más
rápida.
Podemos tener una copia de
nuestra web para probar
actualizaciones o plugins.
Es gratis

Para trabajar en local se instala en nuestro PC o Portátil:
Instalación en Local
Un programa que permite instalar Apache, PHP y MySQL en
un solo paso y de manera sencilla en sistemas Windows, Mac
OS
Es capaz de interpretar paginas dinámicas
WORDPRESS, JOOMLA, PRESTASHOP, MAGENTO
2. WORDPRESS/LOCAL

¿Porqué Xampp?
Más usado del mercado
Rápido y Seguro
Instalación en Local
Rápido y Seguro
Más versátil
Enlace Xampp:
http://www.apachefriends.org/es/xa
mpp.html
XAMPP para Windows o MAC

Instalación de Xampp
• En estos ordenadores están instalados.
• Se adjunta el tutorial para la instalación en
casa o en tu portátil.casa o en tu portátil.
2. WORDPRESS/LOCAL

Busca Xampp en Google y pincha en este
enlace

Elige tu sistema operativo
PARA EL USO EN WINDOWS
PARA EL USO EN MAC

Instalación en MAC
Instrucciones para la instalación en MAC
• http://www.apachefriends.org/en/xampp-• http://www.apachefriends.org/en/xampp-
macosx.html#849
Para instalar en Windows
2. WORDPRESS/LOCAL

Instalación en Windows
• El enlace de descarga esta en la
HOME. Como se ve en la
imagen está al final.
• Éste es el link para Windows
http://sourceforge.net/projects
/xampp/files/XAMPP%20Windo
ws/1.7.7/xampp-win32-1.7.7-
VC9-installer.exe/download
2. WORDPRESS/LOCAL

El Link a utilizar es INSTALLER

Pinchamos en el Archivo descargado con un icono
naranja y ejecutamos en la versión ENGLISH

Aviso para los Windows Vista
• Para los windows vista hay que deshabilitar el
control de usuario. AQUÍ explica como. Para
XP y Siete no hay problemas. Pulsa AceptarXP y Siete no hay problemas. Pulsa Aceptar
2. WORDPRESS/LOCAL

Dejar tal como aparece. INSTALL

Aparece una pantalla en MS-DOS.
Es Normal y desaparece sola
2. WORDPRESS/LOCAL

Instalar Wordpress
1. Preparamos nuestro entorno Xampp
2. Descargamos los archivos WP en HTDOCS
6 Sencillos pasos!
2. Descargamos los archivos WP en HTDOCS
3. Creamos una base de datos
4. Buscamos nuestra web en el navegador
5. Seguimos los pasos: Unir la BBDD a los
archivos.
2. WORDPRESS/LOCAL

Activar los entornos:
APACHE: Start
PREPARAMOS EL ENTORNO XAMPP
: Start
MySQL: Start
Los archivos se descargan de la web oficial del gestor de
contenidos y se suben tal cual a nuestro espacio web.
Una vez ya tenemos el servidor virtual en nuestro ordenador,
descargamos el software de Wordpress.

Descarga: http://es.wordpress.org/

Ir a carpeta Htdocs que es donde
ubicar los archivos
Normalmente está en EQUIPO/DISCO LOCAL C:/XAMPP/HTDOCS

C:/XAMPP/HTDOCS/WORDPRESS
Pegar y Descomprimir el ZIP en la
carpeta RAIZ

Abrir el navegador y Escribir en la
URL: localhost/wordpress

Crear archivo de configuración

Crear “archivo de configuración”. Este archivo es nuestra unión
entre los archivos y la BBDD. Pulsar Vamos a ello!

Es el momento de: Crear una base de datos
I.- Abrir el navegador e ir a localhost/phpmyadmin
II.- Pulsar en Base de Datos
Si el idioma sale en Alemán, cambiar aquí

III.- Poner un nombre descriptivo y pulsar CREAR
Nuestros datos son:
Nombre de la Base de datos: “elnombrehemosescritoarriba”
Usuario: ROOT
Contraseña: “ninguna”

Volvemos al navegador localhost/wordpress e
introducimos los datos de la BBDD de esta
manera:

+
Wp-config
ENVIAR: Se unen la BBDD con los archivos
+

Escribir en algún sitio las contraseñas de
entrada y el nombre de usuario si no queremos
dejar inutilizado el portal
INSTALAR WORDPRESS y luego ACCEDER
Ahora se están escribiendo las tablas en la BBDD

Acceder = localhost”nombrecarpeta”/wp-admin
Acceder en remoto = www.midominio.com/wp-admin

2.2 INSTALACIÓN EN SERVIDOR
1. Porqué y como se instala en servidor.
2. Mismo procedimiento que en local
3. Importante usar un cliente FTP:3. Importante usar un cliente FTP:
FILEZILLA
2. WORDPRESS/LOCAL

Porqué Instalar en Servidor
• Es el lugar donde se alojan los portales que se ven en
Internet.
• Hace visible y accesible nuestra web a los• Hace visible y accesible nuestra web a los
navegantes.
• Aporta velocidad, capacidad, seguridad y 24 H de
funcionamiento.
• Servidor: APACHE (php – MySQL)
• Compartido, la solución para empezar.

Requisitos para Wordpress
Linux
1 Base de datos1 Base de datos
MySQL 5.0 o superior
PHP 5.2.4 o superior
Espacio web + de 500 MB

Para Instalar en Servidor, haremos los mismos pasos
pero en nuestro Alojamiento contratado.
Para facilitaros la tarea hemos desarrollado un manual
de instalación en el servidor 1 & 1.
de instalación en el servidor 1 & 1.

2.3 PANEL DE CONTROL: ESCRITORIO

ACCESO A WORDPRESS
www.midominio.com/wp-admin

Descubriendo el Escritorio

Pulsando en el nombre de
la web arriba a la izquierda
nos lleva al
Front End

Así es al principio
nuestra web o blog

1.- Escritorio
Elementos de
ayuda
• Ahora mismo
• Publicación rápida
• Comentarios recientes
• Últimos borradores
• Enlaces entrantes
Personalizable
en
Opciones de
Servidor de
Noticias
• Blog oficial de Wordpress
• Plugins
• Otras Noticias de Wordpress
2.- Actualizar
•Versión de WP
•Plugins
•Temas
Para actualizar SIEMPRE debemos tener una copia de seguridad
de nuestro Wordpress.
Opciones de
Pantalla

Entradas, Categorías, Páginas
Entradas:
• Lo usamos para el contenido de actualización
periódica como noticias, novedades, artículos,
promociones, etc…
• Entran con fuerza pero se diluyen

Entradas
Categorías:
• Lo usamos para ordenar y clasificar las entradas.
• Pueden dividirse según diferentes criterios que elije
el autor: tema, localización, segmento, etc…
• Ej: Futbol,Baloncesto, Motor,
• Ej: Web, SMM, LOPD

Entradas, Categorías, Páginas
Páginas:
• Lo usamos para publicar contenido estático y
descriptivo.
• Está siempre a la vista.
• Ej: Acerca de, Aviso Legal, Quienes somos, nuestros
productos

Entradas
Para gestionar el contenido dinámico

Entradas: Tienen un editor de contenidos muy intuitivo. Las
entradas se ordenan por categorías. Podemos Añadir entradas o
modificar una existente.

Añadir una Entrada:
•Vista Visual o HTML para conocedores de código.
•Texto en negrita, cursiva, tamaño, viñetas, gramática, …
•Botón para ver más opciones
•Hipervinculos
•Linea de leer más
•Linea de leer más
•Comilla de Cita
•Pegar desde un word u otra web.
•Subir o insertar imágenes, videos u objetos.
•Integrarla en una categoría
•Publicar o Guardar como borrador
•Programar su publicación.
•Establecer contraseña: Entrada privada

IMAGEN DESTACADA

Dependiendo del tema instalado tendremos más o menos funciones
para las entradas. También los plugins que instalamos muestran sus
herramientas de trabajo en esta pantalla, que se regula en OPCIONES
DE PANTALLA

Entradas y más contenido dinámico
• Eventos: EVENTS MANAGER
• Portfolio: THEMES CON GALERIA• Portfolio: THEMES CON GALERIA
• Productos: E-COMMERCE

Categorías: Organiza tus entradas

Librería Multimedia
• Es aquí donde se almacenan y se gestionan las
imágenes, pdf, videos y otros documentos
subidos.

Añadir nuevo archivo Multimedia
•Podemos subir archivos desde aquí o desde la
entrada o página donde irá publicado. Arrastra el
archivo y suelta.
•Puedes subir varios archivos a la vez
•Puedes subir varios archivos a la vez

Enlaces
• Aquí damos de alta enlaces a otros blogs/webs
relacionadas.
• El intercambio de enlaces es vital en el SEO

Tipos de enlaces
• _blank — nueva ventana o pestaña.
• _top — ventana o pestaña actual, sin marcos.
“Usaremos Blank para enlaces a otras webs externas
y Top para enlaces propios, ya que seguiremos
teniendo al visitante en nuestra web”

Lo subimos a nuestro blog a través de los WIDGETS
Enlaces

Páginas: Organización del contenido
Estático

Páginas: Indice, organización y edición rápida de las páginas
•En Páginas podemos ordenarlas por autor, fecha u orden alfabético.
•Podemos buscar por palabras o tags.
•Podemos editar rápidamente algunas modificaciones.

Páginas: La edición es igual a la de una entrada. Se le puede asignar una
plantilla predeterminada, que según el TEMA tendrá más variedad.

Páginas
Publicar
Para publicar, programar o guardar
borrador. Permite crear entradas
privadas.
Aquí también permite enviar la página
a la papelera
Atributos de página
Ubicación de la página en el menú.
Posición que irá en el menu
Tipo de página que queremos publicar.
Premium.
Imagen destacada
La imagen que se usa para presentar
la página.
En algunos temas sirve para las
miniaturas

Relación de comentarios y gestión de los mismos
Comentarios

Menús: La barra de Navegación
• Los Menús Personalizados te permiten colocar las páginas y
categorías que deben aparecer en el Menú de Navegación, y
ordenar su posición en el mismo.

Apariencia > Menu
•Para crear un menú personalizado dale un nombre y haz clic en
Crear menú.
•Después elige objetos como páginas, categorías o enlaces
personalizados de la columna izquierda para añadirlos a este
menú.menú.
•Después de añadir tus objetos, arrastra y suéltalos en el orden
que desees.
•También puedes hacer clic en cada objeto para ver opciones de
configuración avanzadas.
•Cuando hayas terminado de crear tu menú personalizado,
asegúrate de hacer clic en el botón Guardar menú.

Selecciona elementos Menu
Apariencia > Menu

Ordenalos y Ubícalos en el tema
Apariencia > Menu

Usuarios
• Aquí damos de alta a los administradores, Editores,
Autores, Colaboradores o suscriptores

Publicar esto: Nos permite “coger prestado” facilmente texto de otras
fuentes. Funciona insertando en la barra de marcadores el enlace
PUBLICA ESTO
Herramientas
Importar y Exportar: Muy útil para trasladar los contenidos
(entradas, comentarios, …) de un blog a otro.
Por ejemplo de WP.COM a WP.ORG, de BLOGGER a WP, etc…

TEMAS – THEMES – PLANTILLAS - TEMPLATES

Apariencia
• El diseño que tendrá nuestra web lo define el TEMA que tengamos
instalado.
• El tema por defecto que nos viene en Wordpress es el TwentyTen
y TwentyEleven
Apariencia > TEMAS
y TwentyEleven
• Existen miles de temas diferentes y cada tema tiene sus propias
opciones de personalización.
• Los temas gratuitos dan muy poco juego y NO dan un aspecto
profesional.
• Los temas Premium nos proporcionan una web bonita y con
muchas posibilidades por poco dinero.

Plantillas Premium
• Las principales empresas que diseñan plantillas
Premium para Wordpress son las siguientes.
• WOO Themes
• Studio Press
• Theme Forest
• Elegant Themes
• Natty WP

Ejemplo
Plantilla
Premiun

Elegir una buena plantilla
• Adaptada a objetivo de la web
• Diseño versátil: Multitud de posibilidades• Diseño versátil: Multitud de posibilidades
• Shortcodes
• Responsive Design

[two_third] Your content here...[/two_third]
shortcodes

Usa los Shortcodes de ET en cualquier
Tema

Apariencia: Administrar Temas
Apariencia > TEMAS

Apariencia: Instalar temas
Para instalar temas
Apariencia > TEMAS
Para instalar temas
podemos usar el
buscador de
Wordpress o subir
un archivo que
tengamos en
nuestro PC.

Subir una plantilla vía Escritorio
1 2

Subir una plantilla via FTP
• Seleccionar archivos de la plantilla
• Extraer archivos innecesarios si los hubiera
(tipo PSD)(tipo PSD)
• Copiar los archivos en la carpeta THEMES
• Ir a Escritorio y activar el tema

Opciones del Tema: Dependen del tema
instalado. Dos ejemplos
Twenty Eleven Elegant Themes

Hagamos una web con una Plantilla

Desgranando una Plantilla
• PAGE: Plantilla de página
• BLOG: Plantilla del Blog
• SINGLE: Plantilla de entrada simple• SINGLE: Plantilla de entrada simple
• SIDEBAR: Barra lateral
• GALLERY: Plantilla de porfolio imágenes
• HEADER: Cabecera
• HOME: Página de Inicio

2.5 RETOQUES DE PLANTILLAS. TEMA HIJO

Por qué crear un tema “hijo”, child theme
1. Los temas hijos vienen a complementar un tema
original, el tema padre.
2. Mantienen seguros nuestros cambios. Cuando
se actualiza un tema por seguridad, se reseteanse actualiza un tema por seguridad, se resetean
nuestras modificaciones. El tema hijo
permanece.
3. Permite personalizar un sitio sin tener que crear
un tema desde cero, ya que lo que no se defina
en el tema hijo, lo heredará del tema padre.

Donde se encuentran los archivos
Gestiona Archivos:
-Vía Escritorio-Vía Escritorio
APARIENCIA> EDITOR
-Vía FTP
WP-CONTENT/THEMES/

Modificación: Archivos más comunes
• Sobre todo Style.css
• Header.php
• Footer.php• Footer.php
• Page.php
• Single.php
• Atención: El Functions.php crea conflictos por
lo que no pueden existir dos archivos.

Crear Tema Hijo
1. Crear un directorio nuevo en la carpeta wp-
content/themes (nunca dentro de la carpeta
del tema padre)
2. Ponemos el nombre que queramos.
3. Creamos dentro de él un archivo style.css.
4. En el style.css, indicar cual es un tema hijo y
quién es su padre. (ver prox diapo)
5. Activamos el tema hijo.

FUNDAMENTAL: Indicar que el tema es
hijo de su padre: TEMPLATE
1. /*
Theme Name: Tema hijo
Theme URI: http://nuestraweb.com/Theme URI: http://nuestraweb.com/
Description: Tema hijo de NOMBRE TEMA para
WordPress
Author: TU NOMBRE
Author URI: http://mkg20.es
Template: NOMBRE TEMA PADRE
Version: 0.1.0
*/

Indica donde esta el resto
Podemos copiar todo el style.css y modificar lo
que necesitemos.
Si solo queremos redefinir unos cuantos ySi solo queremos redefinir unos cuantos y
heredar el resto, tenemos que hacer
una llamada a la hoja de estilos del parent
theme para incluir sus estilos:
• 2. @import url('../temapadre/style.css');

Herramienta de apoyo
INSPECTOR DE ELEMENTOS DE CHROME

2.6 PLUGINS: INSTALACIÓN Y + USADOS

Son aplicaciones que instalamos y que amplían las funciones de
Wordpress.
Plugins y Widgets

Plugins Instalados
Plugins y Widgets

Plugins
Plugins y Widgets
Se pueden buscar por palabras o tags
Se pueden subir si lo tenemos en nuestro PC
Ejemplo: Buscar SEO
Ejemplo: Buscar SEO

Antes de instalar un Plugin
• Tener en cuenta si se actualiza
frecuentemente
• Los Plugins pueden hacer nuestro WP más• Los Plugins pueden hacer nuestro WP más
lento o crear errores de funcionamiento.
• Pueden abrir agujeros de seguridad en la web,
haciendo nuestro sitio vulnerable y expuesto a
cualquier tipo de ataque.

Pregúntate antes de instalar un Plugin
1. ¿Necesito instalar este plugin?
2. ¿Puedo hacer lo que necesito sin este plugin?
3. ¿Es este plugin mejor que otros similares? ¿Cuál autor3. ¿Es este plugin mejor que otros similares? ¿Cuál autor
cuenta con mejor reputación?
4. ¿Cuál de los plugins lleva el mejor registro de
actualizaciones?
5. ¿Cuál de los plugins ha sido instalado más veces?

Añadir nuevo
• Buscar, subir o instalar manualmente

•Akismet
•All in One SEO vs SEO by
YOAST
•Q-Translate vs WPML
Algunos de los mejores Plugins son:
•Contact Form 7 + Really Simple
Captcha
•Google XML Sitemaps
•Google Map for Wordpress•Q-Translate vs WPML
•WP Super Cache
•Nexgent Gallery
•Google Map for Wordpress
•Twitter Facebook Social Share –
Sexy Bookmarks
•Buddy Press

Vamos a configurar plugins
• Contact Form 7
• Nexgen Gallery

Plugins Premiun Interesantes
Existen plugins fuera del repositorio por que son
de pago, pero que ofrecen un resultado muy
profesional.profesional.

Widgets
Widgets: Los usamos para mostrar en nuestra
web las funcionalidades de wordpress, del
tema o de los plugins.
Tenemos widgets preinstaladosTenemos widgets preinstalados
Generalmente van en el sidebar o en el Footer.
Se arrastran para activarlos.

El punto débil de WP: los idiomas
• El mayor quebradero de cabeza de WordPress
han sido siempre los sitios multilingües.
• Una alternativa muy usada ha sido crear una• Una alternativa muy usada ha sido crear una
instalación independiente para cada idioma
• Esta opción tiene la desventaja del doble
trabajo y el doble mantenimiento

Localización y traducción
• Localización es la traducción de los archivos de
código: traducir un plugin, una plantilla, un
formulario, etc…formulario, etc…
• Traducción: Tener el texto y los metas en
varios idiomas en la misma base de datos

Localización
• Codestyling Localization
• WPML: Incluye todo

Traducción personalizada
• Qtranslate:
– Gratis
– El mejor para webs sencillas o blogs.
– Ensucia el código y hay que usar etiquetas
• WPML:
– El más completo y mejor plugin de idioma hasta el momento.
– Más complejo
– Mejor para SEO
– Más limpio
– De pago

Ajustes Generales

1. Los campos en esta pantalla determinan algunas configuraciones
básicas de tu sitio.
2. La mayoría de los temas muestran el título del sitio en la parte
superior de cada página, en la barra de título del navegador, y
como nombre identificativo para los feeds. La descripción corta
Ajustes Generales
como nombre identificativo para los feeds. La descripción corta
también se muestra en muchos temas.
3. La URL de WordPress y la URL del sitio pueden ser las mismas
(ejemplo.com) o diferentes; por ejemplo, puedes tener los archivos
del core de WordPress en un subdirectorio
(ejemplo.com/wordpress) en vez de en el directorio raíz.

4. Si deseas que los visitantes se puedan registrar en tu sitio, en vez
de que el administrador del sitio deba registrarlos, marca la casilla
de miembros. Se otorgará un perfil predeterminado a cada nuevo
usuario. Da igual que se registren ellos mismos o que les registre
el administrador del sitio.
Ajustes Generales
5. UTC quiere decir Hora universal coordinada (Coordinated
Universal Time)
6. Recuerda hacer clic en la parte inferior de la pantalla sobre el
botón Guardar cambios para que los nuevos ajustes surtan efecto

IMPORTANTEIMPORTANTE::
Dar de alta un buen Título y Descripción (SEO)
Ajustes Generales
Visibilidad del sitio: Permitir que el Blog sea indexado
Enlaces permanentes: Colocar en NOMBRE DE ENTRADA (SEO)
Siempre Guardar Cambios antes de salir

Seguridad: Recomendaciones I
1. Mantener WordPress actualizado a la última
versión, única garantía de control de
vulnerabilidades conocidas.vulnerabilidades conocidas.

Seguridad: Recomendaciones II
2. Instalar solamente plugins seguros, a ser posible
desde el repositorio oficial.
3. Instalar solamente temas seguros, a ser posible
desde el repositorio oficial.desde el repositorio oficial.
4. Revisar la sección de seguridad de Ayuda
WordPress para comprobar que has realizado
todas las acciones de seguridad necesarias.
5. Suscribirte al feed de Ayuda WordPress para
estar informado de las alertas de seguridad.

Seguridad: Algunos trucos
1. Cambiar el prefijo de la BBDD
2. Bulletproof security Este plugin ofrece un entorno de
seguridad muy completo, protegiendo tu WordPress de
inyecciones de código y ataques a SQL.inyecciones de código y ataques a SQL.
3. Realiza comprobaciones de seguridad del prefijo de la base
de datos, seguridad del fichero wp-config.php así como de
las carpetas del núcleo de WordPress y ficheros.htaccess.
4. ANTIVIRUS: http://wordpress.org/extend/plugins/antivirus/

2.9 TRUCOS PARA OPTIMIZAR WP
• ENLACES PERMANENTES
• COPIAS DE SEGURIDAD
• TRASLADO DE LOCAL A SERVIDOR• TRASLADO DE LOCAL A SERVIDOR
• SOPORTE: TIRA DE FOROS

Como hacer copias de seguridad
1. Hacer copia de los archivos
2. Hacer copias de las BBDD
• Existen Plugins que facilitan la tarea• Existen Plugins que facilitan la tarea

Traslado de Local a Servidor
• Trasladar carpeta con archivos via FTP o
comprimido en ZIP
• Exportar BBDD de PHPMyadmin local.• Exportar BBDD de PHPMyadmin local.
• Crear nueva BBDD en servidor e Importar BBDD.
• Modificar archivo WP-CONFIG
• Modificar entrada BBDD WP_OPTIONS:
– SITE URL y HOME
• Revisar links metidos a mano

Exportar BBDD
1.- Marcar
todos
2.- Exportar

Modificar Siteurl y Home (WP_OPTIONS)

Soporte: Busca en la red
• Si tenemos problemas con nuestra web:
o

Ahora ya entendemos más características

3.SEO PARA WP
Principios básicos del SEO
Configura tu WP para posicionarte
en GOOGLE

• Más cara la inversión pero más económico a
medio/ largo plazo.
• Se amortiza más porque permanece en el
tiempo.
• Es más fiable para los navegantes.

Como funcionan los buscadores
• Índice (o catálogo) que clasifica a partir de las palabras
significativas que encuentra en las páginas web

¿Cómo sabemos en que puesto estamos?
• Free Monitor for Google

Esquema SEO a seguir
1. Optimización de la web
2. Optimización del contenido
3. Incrementar las visitas y la interacción con el
exterior
4. Conseguir enlaces

Arquitectura
• “Google no mira, Google únicamente lee”.
• ¿Qué significa esto? Que tu blog puede lucir muy
bien estéticamente (ante los ojos humanos) pero
esto poco interesa a Google.esto poco interesa a Google.
• Lo que Google adora es el texto y las páginas
sencillas de interpretar (páginas que tengan
configurado un título, descripción, alt en las
imágenes, etc) puesto que le ahorran trabajo de
rastreo y facilitan el trabajo.

Optimiza tu web
SNIPPETS
• Titulo del sitio y
descripción
• URL (Dominio y
Slug)
Obviamente acciona
el rastreo y las
permanlinks

Las palabras claves han muerto

Optimiza tus Snippets
• Asegurate que cada página tiene su propio
<title>
• Deben ser descriptivos y concisos• Deben ser descriptivos y concisos
• Evita el Keyword Stuffing (repetición
innecesaria y pedante con varias formas)
• Utiliza tu marca o tu producto

Snippets
•
BUENOS TÍTULOS EXPLICACION
Nudo de corbata: ¿cómo hacer un nudo
de corbata?
La palabra clave al principio de la frase
(relevancia) y se repite dos veces con
manera naturalmanera natural
Colchones de látex: colchón de látex
NATURA
Plural y singular cuando se comprueba
que ambas son muy demandadas
Instalación de césped sintético o artificial
Onlygarden
Título descriptivo. El nombre de la
empresa no es relevante para SEO, por lo
que va al final
Maleta Spinner 4 ruedas 82cm American
Tourister
Título descriptivo y específico para
ecommerce
Fuente: Jose B. Moreno

Vamos a empezar por Ajustes Generales

Vamos a apoyarnos en un Plugin
• SEO by YOAST • All in One SEO

Pongámosle las cosas fáciles a Google
•H1
•Title•Title
•Meta
•SiteMap

Secciones del Plugin
1. Titles & Metas
2. Social
3. Sitemaps XML3. Sitemaps XML
4. Enlaces permanentes o permalinks
5. Enlaces Internos
6. RSS
7. Importar y Exportar
8. Editar Archivos

Titles & Metas
• La etiqueta <title> y la etiqueta <meta
name=”description”>
– General: Fuerza la reescritura de <titles>– General: Fuerza la reescritura de <titles>
– Portada: Títulos Generales. :
– Tipo de Entradas:Plantilla de Pg, Post, MM, ..
– Taxonomías: Plantilla de Categorías, Etiquetas, ..
– Otro: Autor, archivo

Optimiza cada página o entrada

XML Sitemap
• Genera automáticamente un resumen de las
páginas, entradas, categorías, autores de tu
sitio y envíaselas a los principales buscadores.sitio y envíaselas a los principales buscadores.

Optimiza tu web
• Velocidad de Carga
– WP Cache
– P3- Profiler– P3- Profiler
• Analiza la velocidad que pierde Wp por los
plugins
• BBDD Limpia
– WP CleanFix

Optimiza tu contenido
Google Penaliza:
• Contenido de baja calidad
– Alto rebote
– Baja permanencia
HTML Pobre– HTML Pobre
– Crear contenido para el usuario y para Google
• Contenido duplicado
• Sobrecarga publicitaria
• Sobrecarga de Keywords (2012)
• Que los enlaces no sean de calidad

HTML 5
HTML 5 indexa mejor y esta mejor estructurado
Responsive design + tráfico moviles y tablets

Link Building
“Dime quien te enlaza y te diré quien eres”
•Cómo debe ser un enlace <a href=“url” title=“kw”>kw</a>•Cómo debe ser un enlace <a href=“url” title=“kw”>kw</a>
•Dónde conseguir enlaces
– Inclusión en directorios (gratis y de nicho)
– Altas en foros y blogs
– Notas de prensa
– Redes sociales
– Intercambio de enlaces
• Enlaces rotos: Broken link checker

GRACIAS
JAVIER MERCHAN
MKG 2.0 | www.mkg20.es
@merchanjavier

Taller+de+wordpress+avanzado+2

Recomendados

Recomendados

Más contenido relacionado

La actualidad más candente

La actualidad más candente (19)

Similar a Taller+de+wordpress+avanzado+2

Similar a Taller+de+wordpress+avanzado+2 (20)

Último

Último (6)

Taller+de+wordpress+avanzado+2