Introducción
Ya tienes tu cuenta gratis en WordPress.com y has elegido importar los contenidos demo de la plantilla Maywood. Ahora te enseñaremos a editar la página a tu gusto, siguiendo nuestro caso de estudio de una peluquería local.
Entramos en el escritorio de WordPress y vamos a la pestaña “páginas”. Verás que hay dos páginas llamadas “inicio”, elimina la más antigua, porque ha sido sustituida por la que hemos importado. En caso de confusión, conserva la que indica “Página de inicio”
Consejos para Trabajar Online
Te recomendamos que trabajes con tres pestañas en tu navegador:
- Una pestaña con la página del curso
- Una pestaña con el escritorio de WordPress
- Una pestaña que te se abrirá cuando cliques en “Vista Previa” en el menú de cabecera del editor. Y donde podrás visualizar los cambios.
En el menú de cabecera del editor verás a la izquierda unas flechas. Si te equivocas y quieres retroceder al paso anterior, con estas flechas lo podrás hacer, tanto al paso anterior como al original.
Cuando acabes de editar la página recuerda siempre clicar en el botón Publicar / Actualizar que está en el menú de cabecera.
Sección 1: Cambiar imagen de fondo
Lo ideal es que la primera imagen que ve el usuario que entra por primera vez en tu sitio web sea evocadora de lo que haces. Si la imagen es original mejor que mejor, en este caso elegiremos una imagen gratis de pexels ya que nosotros no tenemos una peluquería.
Clicamos en la foto del fondo y en la barra de herramientas clicamos “Reemplazar” y nos saldrá un menú con las fuentes de imágenes como se muestra en el siguiente vídeo.
Resultado del cambio
Ahora tenemos un nuevo fondo que evoca lo que hacemos. Vamos a modificar el texto y el color del texto para que sea más visible el mensaje.
Opacidad de la imagen: Si quieres oscurecer o aclarar la imagen de fondo para que el texto resalte más, selecciona la imagen y regula la opacidad desde la barra lateral.
Sección 1: Editamos el Texto y el Color
Ya tenemos el fondo, toca cambiar el texto con un mensaje de lo que somos y el color del texto para que sea visible en el fondo oscuro. Puede ser confuso ya que en el editor se ve el texto en blanco, pero hay que cambiarlo de todos modos.
En nuestro caso hemos decidido poner como título nuestro slogan (como vimos en capítulos anteriores) y un texto que resuma lo que somos y lo que ofrecemos.
Resultado del cambio
Hemos editado el texto con el mensaje que queremos transmitir y los colores. En el botón pondremos “Reservar Hora”, más adelante explicaremos cómo hacer la página de reservas (si has decidido que no quieres hacer la página de reservas, entonces elimina el botón). El color del botón lo puedes cambiar con el mismo proceso que con el texto, selecciona el botón y cambia el color desde la barra lateral.
Sección 1: Cambiamos el tipo de Texto
Ya que estamos aquí elegimos una tipografía que se adapte a nuestro sector. Como verás en el siguiente vídeo, es muy fácil. Puedes elegir entre múltiples tipos de letra, tanto para los encabezados como para el texto básico. Además WordPress te ofrece una serie de combinaciones de tipografía para que aún sea más fácil. Recuerda que este cambio se aplicará a todo el sitio web. Siempre podrás editar los texto de una manera individual si quieres hacer alguna sección o página con una tipografía diferente.
Sección 2: Sobre Nosotros
Ya hemos editado la primera sección de nuestra página de inicio con éxito. Ahora vamos a la siguiente sección que habla sobre nosotros. Como ya vimos en anteriores capítulos (Un poco de Marketing), hay que redactar un texto de defina nuestra empresa, donde expliquemos quiénes somos, qué hacemos y, lo más importante, por qué deberían contratarnos o comprar nuestros productos.
Reducimos el espacio entre secciones
Nos parece que hay demasiado espacio entre secciones así que vamos a eliminar o por lo menos reducir un poco el espacio entre secciones como se muestra en el siguiente vídeo.
Editamos el texto con nuestra historia y cambiamos las fotos por fotos reales o por fotos demo como se muestra en el vídeo siguiente.
Editamos la Sección
Sección 3: Productos y Servicios
Como ya explicamos en la sección primera, hacemos lo mismo con la sección tratamientos. Y este es el resultado.
Esta sección está asociada a la siguiente donde se muestran algunos tratamientos o servicios y productos más populares. El botón que enlaza con la página de Servicios y Productos es opcional. El enlace a la página lo pondremos más adelante cuando creemos la página de Servicios y Productos.
En su lugar también podemos poner una oferta o un servicio que nos diferencie de la competencia.
Editamos la sección de “Servicios y Productos Destacados o Populares” . Es una sección de 3 columnas, con tres lugares donde poner tus servicios o productos más populares. El botón es opcional.
Sección 4: Reservar Hora
En esta sección animaremos al visitante a contactar con nosotros, ya sea reservando hora a través del formulario o a través de nuestro número de teléfono.
Al igual que en la primera sección tendremos que editar el color del texto a blanco, en el caso que el fondo sea oscuro. Recuerda que puedes editar la opacidad de la imagen de fondo para resaltar los textos.
Formulario de Reserva
En esta sección editaremos el formulario adaptándolo a nuestras necesidades.
- Eliminamos el campo “Party Size”. Seleccionas el campo y en el menú de tres puntos a la derecha clicas la última “eliminar sección”
- Traducimos algunos campos que están en inglés.
- Ponemos las horas de nuestro negocio, en la muestra sale el horario de un restaurante.
- Duplicamos el campo de las horas, seleccionamos el campo y en el menú clicamos en “duplicar”.
- Cambiamos el título del campo duplicado por “Servicios Solicitados” y modificamos los campos con nuestros servicios tal como se muestra en la imagen.
Editar Campo horas
Crear Campo Servicios
Cuando te envíen el formulario te llegará a tu correo Gmail con el que has abierto la cuenta de WordPress.com. No olvides hacer un test y enviarlo a ver qué tal funciona.
Ya hemos terminado de editar la página así que por último, en la esquina superior derecha clica en Publicar/Actualizar para que se guarden los cambios.
Aprovechando que estamos editando la página, no salgas del editor que en el siguiente capítulo editamos el pie de página o footer.