DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es
Transcript of DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es
![Page 1: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/1.jpg)
PRODETUR
DISEÑO DE PÁGINAS WEB – parte 2 - wordpress
Mairena del aljarafe, 18 de abril de 2016
[email protected] Telf.: 954 486 800
![Page 3: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/3.jpg)
PRODETUR
PANEL DE CONTROL: ESCRITORIO
![Page 5: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/5.jpg)
PRODETUR
Descubriendo el Escritorio
Twitter/MKG20 - Javier Merchán
![Page 6: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/6.jpg)
PRODETUR
Descubriendo el Escritorio
Pulsando en el nombre dela web arriba a la izquierdanos lleva al
Front End
![Page 7: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/7.jpg)
PRODETUR
El Escritorio
Así es al principio nuestra web o blog
![Page 8: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/8.jpg)
PRODETUR
Visión del Escritorio
Twitter/MKG20 - Javier Merchán
![Page 9: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/9.jpg)
PRODETUR
• Lo usamos para el contenido de actualización periódica como noticias, novedades, artículos, promociones, etc…
• Entran con fuerza pero se diluyen
Entradas
![Page 10: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/10.jpg)
PRODETUR
• 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
Categoría
![Page 11: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/11.jpg)
PRODETUR
• Lo usamos para publicar contenido estático y descriptivo.
• Se trata de páginas HTML reales• Se puede publicar prácticamente cualquier
contenido
• Está siempre a la vista.
• Ej: Acerca de, Aviso Legal, Quienes somos, nuestros productos
Páginas
![Page 12: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/12.jpg)
PRODETUR
Twitter/MKG20 - Javier Merchán
Gestión de Entradas
![Page 13: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/13.jpg)
PRODETUR
Entradas: Tienen un editor de contenidos muy intuitivo. Las
entradas se ordenan por categorías. PodemosAñadir entradas o
modificar una existente.
Edición de entradas
![Page 14: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/14.jpg)
PRODETUR
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
Twitter/MKG20 - Javier Merchán
Tipos de Entrada
![Page 15: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/15.jpg)
PRODETUR
Categorías
![Page 16: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/16.jpg)
PRODETUR
Es aquí donde se almacenan y se gestionan las
imágenes, pdf, videos y otros documentos
subidos.
Librería Multimedia
![Page 17: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/17.jpg)
PRODETUR
•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
Agregar multimedia
![Page 18: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/18.jpg)
PRODETUR
Organización páginas
![Page 19: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/19.jpg)
PRODETUR
Páginas: Indice, organización y edición rápida de las páginas
Organización de páginas
Twitter/MKG20 - Javier Merchán
•En Páginas podemos ordenarlas por autor, fecha u orden alfabético.
•Podemos buscar por palabras o tags.
•Podemos editar rápidamente algunas modificaciones.
![Page 20: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/20.jpg)
PRODETUR
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.
Edición de páginas
![Page 21: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/21.jpg)
PRODETUR
Características de páginas
Publicar• Para publicar, programar o
guardar borrador. Permite crear entradas privadas.
• Aquí también permite enviarla página a la papelera
Atributos de página
• Ubicación de la página en elmenú.
• Posición que irá en el menu
Imagen destacada• La imagen que se usa para
presentar la página.• En algunos temas sirve
para las miniaturas
![Page 22: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/22.jpg)
PRODETUR
IMAGEN DESTACADA
Descubriendo el Escritorio
![Page 23: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/23.jpg)
PRODETUR
Relación de comentarios y gestión de los mismos
Comentarios
![Page 24: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/24.jpg)
PRODETUR
Menús: La barra de Navegación
• Los Menús Personalizados te permiten colocar las páginas ycategorías que deben aparecer en el Menú de Navegación, yordenar su posición en el mismo.
![Page 25: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/25.jpg)
PRODETUR
Apariencia > Menu
•Para crear un menú personalizado dale un nombre y haz clic enCrear menú.•Después elige objetos como páginas, categorías o enlacespersonalizados de la columna izquierda para añadirlos a estemenú.•Después de añadir tus objetos, arrastra y suéltalos en el ordenque desees.•También puedes hacer clic en cada objeto para ver opciones deconfiguración avanzadas.•Cuando hayas terminado de crear tu menú personalizado,asegúrate de hacer clic en el botón Guardar menú.
![Page 26: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/26.jpg)
PRODETUR
Apariencia > Menu
Crear Menu
![Page 27: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/27.jpg)
PRODETUR
Apariencia > Menu
Selecciona elementos Menu
![Page 28: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/28.jpg)
PRODETUR
Apariencia > Menu
Ordenalos y Ubícalos en el tema
![Page 29: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/29.jpg)
PRODETUR
Aquí damos de alta a los administradores, Editores,
Autores, Colaboradores o suscriptores
Usuarios
![Page 30: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/30.jpg)
PRODETUR
Publicar esto: Nos permite “coger prestado” facilmente texto de otras
fuentes. Funciona insertando en la barra de marcadores el enlace
PUBLICAESTO
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…
![Page 31: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/31.jpg)
PRODETUR
USO DE PLANTILLAS
![Page 32: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/32.jpg)
PRODETUR
TEMAS – THEMES – PLANTILLAS - TEMPLATES
![Page 33: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/33.jpg)
PRODETUR
Apariencia > TEMAS
• 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
• 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.
![Page 34: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/34.jpg)
PRODETUR
Plantillas Gratuitas
![Page 35: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/35.jpg)
PRODETUR
Subir una plantilla vía Escritorio
1 2
![Page 36: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/36.jpg)
PRODETUR
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
![Page 37: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/37.jpg)
PRODETUR
Ejemplo Plantilla Premiun
![Page 38: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/38.jpg)
PRODETUR
Elegir una buena plantilla
• Adaptada a objetivo de la web
• Diseño versátil: Multitud de posibilidades
• Shortcodes
• Responsive Design
![Page 39: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/39.jpg)
PRODETUR
¿Cuál es el objetivo de la web?
![Page 40: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/40.jpg)
PRODETUR
versátil
![Page 41: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/41.jpg)
PRODETUR
shortcodes
• Los shortcodes de WordPress son pequeños códigos que puedes añadir en el editor de WordPress. Se usan para añadir funciones al contenido de tus entradas y páginas sin tener que escribir un script cada vez que necesites hacer esa tarea.
• Son como tags HTML que usan corchetes ([ ]) en vez de los símbolos de “mayor y menor qué” (< >). Vamos, algo así:
[youtube id=“xxxxxxxxx" ancho="600" alto="450"]
![Page 42: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/42.jpg)
PRODETUR
Responsive
![Page 43: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/43.jpg)
PRODETUR
Opciones del Tema: Dependen del tema instalado
![Page 44: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/44.jpg)
PRODETUR
Opciones del Tema: Configuración
![Page 45: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/45.jpg)
PRODETUR
Herramienta de apoyo
INSPECTOR DE ELEMENTOS DE CHROME
![Page 46: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/46.jpg)
PRODETUR
PLUGINS: INSTALACIÓN Y + USADOS
![Page 47: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/47.jpg)
PRODETUR
Son aplicaciones que instalamos y que amplían las funciones de
Wordpress.
Plugins y Widgets
![Page 48: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/48.jpg)
PRODETUR
Búsqueda de plugins y widgets
Se pueden buscar por palabras o tags
Se pueden subir si lo tenemos en nuestro PC
Ejemplo: SEO
![Page 49: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/49.jpg)
PRODETUR
Antes de instalar un Plugin
• Tener en cuenta si se actualiza frecuentemente
• 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 acualquier tipo de ataque.
![Page 50: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/50.jpg)
PRODETUR
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 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?
![Page 51: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/51.jpg)
PRODETUR
Repositorio de Plugins
![Page 52: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/52.jpg)
PRODETUR
Los Mejores Plugins
• Akismet
• All in One SEO vs SEO
by YOAST
• WPML
• WP Super Cache
• Nexgent Gallery
• WooCommerce
• Contact Form 7 + Really
Simple Captcha
• Google XML Sitemaps
• Google Map for Wordpress
• Twitter Facebook Social
Share – Sexy Bookmarks
• Buddy Press
![Page 53: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/53.jpg)
PRODETUR
Vamos a configurarplugins
• Contact Form 7
• Nexgen Gallery
![Page 54: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/54.jpg)
PRODETUR
Plugins Premiun Interesantes
Existen plugins fuera del repositorio por que son de pago, pero que ofrecen un resultado muy profesional.
![Page 55: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/55.jpg)
PRODETUR
WP Sticky
![Page 56: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/56.jpg)
PRODETUR
Foobar
![Page 57: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/57.jpg)
PRODETUR
Social Image Hover
![Page 58: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/58.jpg)
PRODETUR
Pop Up Ninja
![Page 59: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/59.jpg)
PRODETUR
Widgets
Widgets: Los usamos para mostrar en nuestra web las funcionalidades de wordpress, del tema o de los plugins.• Tenemos widgets preinstalados• Generalmente van en el sidebar
o en el Footer.• Se arrastran para activarlos.
![Page 60: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/60.jpg)
PRODETUR
WP MULTILINGÜE: IDIOMAS
![Page 61: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/61.jpg)
PRODETUR
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 instalación independiente para cada idioma
• Esta opción tiene la desventaja del doble trabajo y el doble mantenimiento
![Page 62: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/62.jpg)
PRODETUR
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…
• Traducción: Tener el texto y los metas en varios idiomas en la misma base de datos
![Page 63: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/63.jpg)
PRODETUR
Localización
• Codestyling Localization
• WPML: Incluye todo
![Page 64: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/64.jpg)
PRODETUR
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
![Page 65: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/65.jpg)
PRODETUR
Traducción Automática
![Page 66: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/66.jpg)
PRODETUR
Traducción Automática
![Page 67: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/67.jpg)
PRODETUR
AJUSTES EN WP
![Page 68: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/68.jpg)
PRODETUR
Ajustes Generales
Twitter/MKG20 - Javier Merchán
![Page 69: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/69.jpg)
PRODETUR
Ajustes Generales
Twitter/MKG20 - Javier Merchán
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
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.
![Page 70: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/70.jpg)
PRODETUR
Ajustes Generales
Twitter/MKG20 - Javier Merchán
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.
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 surtanefecto
![Page 71: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/71.jpg)
PRODETUR
Ajustes Generales
Twitter/MKG20 - Javier Merchán
IMPORTANTE:
Dar de alta un buen Título y Descripción (SEO)
Visibilidad del sitio: Permitir que el Blog sea indexado
Enlaces permanentes: Colocar en NOMBRE DE ENTRADA(SEO)
Siempre Guardar Cambios antes de salir
![Page 72: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/72.jpg)
PRODETUR
Seguridad: Recomendaciones I
1. Mantener WordPress actualizado a la última versión, única garantía de control de vulnerabilidades conocidas.
![Page 73: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/73.jpg)
PRODETUR
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.
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.
![Page 74: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/74.jpg)
PRODETUR
Seguridad: Algunos consejos
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.
3. Realiza comprobaciones de seguridad del prefijo de la basede datos, seguridad del fichero wp-config.php así como delas carpetas del núcleo de WordPress y ficheros.htaccess.
4. ANTIVIRUS: http://wordpress.org/extend/plugins/antivirus/
![Page 75: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/75.jpg)
PRODETUR
OPTIMIZACIÓN WP
• ENLACES PERMANENTES
• COPIAS DE SEGURIDAD
• TRASLADO DE LOCAL A SERVIDOR
• SOPORTE: TIRA DE FOROS
![Page 76: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/76.jpg)
PRODETUR
Enlaces permanentes
![Page 77: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/77.jpg)
PRODETUR
Como hacer copias de seguridad
1. Hacer copia de los archivos
2. Hacer copias de las BBDD
• Existen Plugins que facilitan la tarea
![Page 78: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/78.jpg)
PRODETUR
Traslado de Local a Servidor
• Trasladar carpeta con archivos via FTP o comprimido en ZIP
• 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
![Page 79: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/79.jpg)
PRODETUR
Exportar BBDD
1.- Marcar todos2.- Exportar
![Page 80: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/80.jpg)
PRODETUR
Importar BBDD
![Page 81: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/81.jpg)
PRODETUR
Modificar Siteurl y Home (WP_OPTIONS)
![Page 82: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/82.jpg)
PRODETUR
WP CONFIG
![Page 83: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/83.jpg)
PRODETUR
Soporte: Busca en la red
• Si tenemos problemas con nuestra web:
o
![Page 84: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/84.jpg)
PRODETUR
3.SEO PARA WP
![Page 85: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/85.jpg)
PRODETUR
¿Qué es el SEO?
SEM
SEO
![Page 86: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/86.jpg)
PRODETUR
• 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.
![Page 87: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/87.jpg)
PRODETUR
Como funcionan los buscadores
• Índice (o catálogo) que clasifica a partir de las palabras significativas que encuentra en las páginas web
![Page 88: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/88.jpg)
PRODETUR
![Page 89: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/89.jpg)
PRODETUR
¿Cómo sabemos en que puesto estamos?
Whatsmyserp
![Page 90: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/90.jpg)
PRODETUR
Mide tus Progresos
![Page 91: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/91.jpg)
PRODETUR
Añade Google Analytics a WP
![Page 92: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/92.jpg)
PRODETUR
Esquema SEO a seguir
1. Optimización de la web2. Optimización del contenido
3. Incrementar las visitas y la interacción con el exterior
4. Conseguir enlaces
![Page 93: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/93.jpg)
PRODETUR
Arquitectura
![Page 94: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/94.jpg)
PRODETUR
Optimiza tus Metas
• Asegurate que cada página tiene su propio<title>
• Deben ser descriptivos y concisos
• Evita el Keyword Stuffing (repetición innecesaria y pedante con varias formas)
• Utiliza tu marca o tu producto
![Page 95: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/95.jpg)
PRODETUR
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 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
![Page 96: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/96.jpg)
PRODETUR
SEO by YOAST
![Page 97: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/97.jpg)
PRODETUR
![Page 98: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/98.jpg)
PRODETUR
Estilos básicos
•H1
•Title
•Meta
•SiteMap
![Page 99: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/99.jpg)
PRODETUR
Secciones del Plugin
1. Titles & Metas
2. Social
3. Sitemaps XML
4. Enlaces permanentes o permalinks
5. Enlaces Internos
6. RSS
7. Importar y Exportar
8. Editar Archivos
![Page 100: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/100.jpg)
PRODETUR
![Page 101: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/101.jpg)
PRODETUR
Titles & Metas
• La etiqueta <title> y la etiqueta <meta name=”description”>
– 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
![Page 102: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/102.jpg)
PRODETUR
Optimiza cada página o entrada
![Page 103: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/103.jpg)
PRODETUR
Social
![Page 104: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/104.jpg)
PRODETUR
XML SitemapGenera automáticamente un resumen de las páginas, entradas, categorías, autores de tu sitio y envíaselas a los principales buscadores.
![Page 105: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/105.jpg)
PRODETUR
Optimiza tu web
• Velocidad de Carga
– WP Cache
– P3- Profiler
• Analiza la velocidad que pierde Wp por los plugins
• BBDD Limpia
– WP CleanFix
![Page 106: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/106.jpg)
PRODETUR
Webmaster Tool
![Page 107: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/107.jpg)
PRODETUR
HTML 5HTML 5 indexa mejor y esta mejor estructurado
Responsive design + tráfico moviles y tablets
![Page 108: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/108.jpg)
PRODETUR
Link Building
“Dime quien te enlaza y te diré quien eres”
•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
![Page 109: DISEÑO DE PÁGINAS WEB parte 2 - wordpress - prodetur.es](https://reader035.fdocument.pub/reader035/viewer/2022072910/62e323eef3f0505cdd7444ef/html5/thumbnails/109.jpg)
PRODETUR
PARA CUALQUIER CUESTIÓN RELACIONADA CON ESTA SESIÓN PUEDES DIRIGIRTE A:
[email protected] (Dpto. formación)
www.prodetur.es