El documento proporciona una guía sobre cómo crear y administrar un sitio web utilizando la plataforma Webmaker. Explica cómo agregar contenido como texto, imágenes y widgets; personalizar el diseño y configuración; agregar funcionalidades como una tienda en línea o áreas privadas; y administrar usuarios y permisos. El objetivo es ayudar a los usuarios a crear rápidamente un sitio web profesional para su negocio.

1. Sergio Arias
Webmaker a la carrera

2. Vamos a montar la
web de una
peluquería… a la
carrera

3. Al principio fue la
plantilla…

4. Empezamos…
 Las plantillas que elijas tienen una estructura de páginas y contenido relacionada
con el tipo de empresa para ayudarte a comenzar
 No te preocupes, se puede cambiar TODO, así que si te gusta una plantilla que no es
de la categoría de tu negocio, elígela
Esta va a ser la plantilla
para mi peluquería

6. Echamos un ojo al
panel

7. Menú superior
Menú izquierdo Área de trabajo

8. Moverse por el panel
 Menú izquierdo
o Panel – Información con estadísticas de visitas, mensajes de los formularios…
 Contenido – Aquí es donde creas el contenido de las páginas de tu sitio web
o Estructura – Crea nuevas páginas, determina quién puede acceder, oculta páginas…
o Acceso de usuarios – Gestiona zonas privadas y crea accesos para usuarios con permisos
o Configuración – Favicon, SEO, versionado, permisos de acceso…
 Menú superior #1
o Estilo / Detalles – Cambia el diseño, la plantilla, de tu web, elige colores, cambia las fuentes
o Administrar contenido – Widgets con funcionalidad, imágenes y vídeos…
 Menú superior #2
o Vista previa – Comprueba como queda tu web en los distintos dispositivos antes de publicar
o Guardar – Guarda sin publicar
o Publicar – Tu web ya está disponible para todo el mundo

9. Panel

10. Estructura del sitio web
 Por defecto la web viene con una estructura creada que se ajusta al tipo de negocio
asociado a la plantilla, pero puedes crear y eliminar páginas, crear submenús,
gestionar títulos, descripción…

11. Navegación entre páginas
 Para ir de una página a otra para modificar el contenido, puedes:
o Usar el menú del “Contenido del sitio web”
o Utilizar el propio menú del sitio: usa los enlaces como en cualquier web

12.  El contenido de las páginas es editable y puedes escribir directamente
o Pincha sobre el texto para comenzar a editarlo
o Algunos bloques, te mostrarán opciones de configuración que variarán según el tipo de
widget
Contenido
Psst… usa los distintos formatos de
encabezado; es bueno para el SEO

13. Pero, ¿qué es un
widget?

14. ¿Qué es un widget?
 Un widget es un bloque que contiene una funcionalidad completa:
o Una línea separadora
o Una galería de fotos
o Un formulario de contacto
o Una tienda online…
 Los widgets se muestran de una forma determinada y la funcionalidad se establece
a través de una configuración individual
 Para poner un widget en la página, vamos al menú superior de “Administrar
contenidos > Widgets”, elegimos el que queremos y lo arrastramos a la página
o Según arrastremos el widget nos mostrará si podemos soltarlo en una zona o no

16. Vamos a ver cómo
funciona alguno de
ellos

17. Imágenes > Galería de fotos
1
2

18. Formularios

19. Formularios

20. Mapa

21. Añadir contenido externo
 Hay widgets predefinidos para añadir contenido externo como:
o Twitter
o Cualquier blog con RSS
o Facebook
o YouTube…
 Además, tienes la opción de incrustar cualquier otro contenido directamente

22. …y muchos más, vete
probando

23. Diseño

24. Estilo / Detalles
 Desde esta sección podemos cambiar completamente el diseño del sitio web
escogiendo otra plantilla
 También podemos hacer adaptaciones modificando:
o Los colores de nuestro sitio web
o El tipo de letra (las fuentes) que se utilizan

26. Cambiando el diseño de tu sitio web
 Si te has cansado del diseño que has escogido, puedes elegir otro entre las opciones
que te damos. Lo más seguro es que tengas que adaptar tu web, así que recuerda:
o Guarda una copia de tu página actual (ver “Versiones”)
o Escoge una plantilla compatible: con el mismo número de niveles de menú que la actual
o Comprueba las distintas opciones que puedes mantener de la plantilla
 El contenido no se pierde, se traslada siempre

28. Configuración

29. Configuración
 General. Configura la política de cookies o el favicon
 Opciones de SEO. Configuración del título del sitio y opción de añadir
código Javascript, p.ej. el de Google Analytics
 Móvil. Opciones adicionales para la visualización desde dispositivos móviles
 Versiones. Guarda versiones de tu página y publícalas cuando quieras
 Acceder. Define páginas de acceso restringido y asigna los permisos adecuados

30. Configuración > General

31. Configuración > Móvil

32. Configuración > Versiones
Puedes trabajar con las versiones manteniendo la
página web actual. Crea versiones para ocasiones
especiales, prueba diseños nuevos, añade funcionalidad…

33. Extras

34. Tienda Online

35. Widget > Tienda
 Aunque tu web no sea una tienda, Webmaker proporciona una serie de widgets para
que puedas empezar a vender online
o Widget de tienda. Crea tus productos por categoría y permite pagos por Paypal o
contra reembolso. Sencillo pero suficiente en muchos casos
o Si vendes a través de eBay o Amazon (afiliado)…
• Añade productos de Amazon y asocia tu identificador de afiliado
• Integra eBay en tu sitio web
 Si lo que necesitas es realmente una tienda con funcionalidades avanzadas
o Tienes la opción de integrar tu tienda Ecwid (contratable aparte)
o O quizá lo que querías era una solución como la Tienda Online de Arsys

36. Widget > Tienda - Configuración

37. Widget > Tienda - Configuración

38. Widget de tienda

39. Usuarios y zona
privada

40. Zona privada.
Se pide un usuario / contraseña
para acceder. Dependiendo de los
permisos asignados, el formulario
de acceso puede variar.

41. Usuarios
 Si necesitas que parte de tu sitio web sea privado, tienes la opción de indicar que
determinadas páginas solo estén accesibles para algunos usuarios
o Accesos usuarios
o Configuración > Acceder
o Estructura de páginas > Ajuste de página
o Widget de Acceso (para añadir el formulario de usuario/contraseña)

42. Usuarios
 Hay distintas formas de asignar permisos:
a) Permitir que cualquiera se registre en la página
• Configuración > Acceder > Ajustes de acceso
b) Invitar a una serie de usuarios
• Acceso de usuario
c) Asignar permisos a usuarios específicos
• Estructura de páginas > Ajuste de página

43. a) Permitir el registro a la zona privada
 Vamos a Configuración > Acceder
 Se nos muestran una serie de tarjetas con opciones de configuración
o Ajustes de registro. Marcamos que los visitantes se puedan registrar como usuarios
o Ajustes de notificación. Configuración de los emails que se envían
o Campo de entrada personalizado. Si nos interesa solicitarle información adicional
 Una vez solicitan el registro,
el usuario lo debe confirmar y el
propietario debe activarlo

44. a) Permitir el registro a la zona privada

45. a) Permitir el registro a la zona privada
Los datos de registro son fijos,
por ahora, no se puede elegir lo
que se solicita
1
2 3
4

46. a) Permitir el registro a la zona privada
5
6
7
8
FIN (por fin)

47. b) Invitar a usuarios
 Vamos a Acceso usuarios
 Creamos los usuarios que vayamos a activar
 Les enviamos una invitación
o El proceso a partir de aquí es el de activación de una cuenta

48. b) Invitar a usuarios

49. c) Permisos a usuarios específicos
 Desde la Estructura de página, podemos permitir el acceso a Usuarios o Grupos de
Usuarios que ya están creados
Estos usuarios no reciben email y deben crearse una contraseña a través del enlace de
“Reestablecer contraseña”

50. Gracias

51. Psst… pistas y
recursos que te
pueden ser útiles

52. Pistas, pistas, pistas
 No manipules el tamaño y el color de los
textos para crearte tus títulos; utiliza
Encabezado1, Encabezado2… es bueno
para el SEO
 Usa botones para llamar a la acción
 Separa el contenido en columnas
 No te olvides del favicon ni de
completar la información de cookies en

53. Algunos recursos externos
 Bancos de imágenes que puedes utilizar:
o unsplash.com
o pexels.com
o pixabay.com
 Comprime las imágenes antes de subirlas con…
o tinypng.com
 Edita las imágenes, crea efectos online
o fotoram.io