Bakery Website WB Tutorial - SpanishVersion

Hola, hoy les voy a mostrar cómo podemos hacer una website para una panadería. Vamos a seleccionar Bakeries. Como bien ven acá, podemos seleccionar esta o si ustedes prefieren pueden llenar este formulario para sus propios requerimientos. Una vez que lo recibimos nos pondremos en contacto con usted. Vamos a presionar Edit, que nos llevará directamente a nuestra template. Voy a comenzar tomando el logo que ya está integrado en la template y lo voy a achicar y moverlo de lugar. Simplemente desde los laterales y presionando el botón Drag puedo achicarlo y moverlo hacia donde más nos guste. Lo mismo con el texto, que es el título. Este título es editable, como todos los textos en template, podemos cambiarle el color, el tamaño, la tipografía. Voy a buscar una letra que nos guste y se adhiera a nuestro diseño. Así que acá voy a elegir la letra, por ejemplo, si ven que es muy grande la podemos achicar un poquito. Ahí va y nos queda en un solo renglón. Una vez que terminamos, vamos a las imágenes. Aquí podemos seleccionar la cantidad de imágenes que nosotros queremos para nuestro banner. Simplemente desde las imágenes que tenemos guardadas hacemos clic en Add Image, seleccionamos, abrimos y esta misma ya se adhiere al tamaño seleccionado. Lo que va a hacer que yo elija varias imágenes es crear una galería de imágenes. Entonces cuando los usuarios ingresen a nuestra web van a ser capaces de ver varias imágenes a la vez, como si fuera un carrusel de imágenes. Y también podemos seleccionar el tiempo que queremos que transcurra entre imagen e imagen. Acá tengo 5 segundos por ejemplo, pero puedo subir o bajar. También podemos seleccionar el orden de ellas. Acá por ejemplo voy a reubicar esto y seleccionar el tiempo y lo voy a guardar. Ahí vemos cómo queda. Bajamos un poco y como vemos esta template ya tiene un texto que es de relleno pero sin sentido, entonces lo podemos o eliminarlo por completo o editarlo. Yo voy a tomar la página que estamos tomando de referencia para copiar y pegar los textos y la voy a volcar aquí. Voy a agrandar el área y voy a alinear mi texto al centro. Simplemente voy a copiar y pegar lo que tenemos en nuestra página de referencia. Muy bien, y una vez que están contentos con su texto, recuerden que pueden desde Settings aplicarle color al fondo o bien a la letra. En este caso voy a aplicar un rosa para el fondo y voy a aplicar un blanco para la letra. Voy a buscar una tipografía que nos guste, voy a buscar un tamaño adecuado para el mismo y como verán el blanco y el rosa nos permite resaltar el texto. Esto quedó muy grande, entonces lo voy a achicar un poquito con la opción Drag puedo ubicarlo a donde más nos guste, ahí lo voy a centrar un poquito y listo. Acá simplemente voy a ajustar el color de fondo, así hace juego con el texto anterior. La letra la voy a poner en blanco también y lo mismo voy a hacer con este texto de abajo. Muy bien, recuerden que pueden agregar su Instagram simplemente haciendo clic en Edit y ahí mismo vamos a agregar Instagram Widget. Yo voy a tomar el Instagram de esta página que estamos tomando como referencia para aplicarla en nuestra template, simplemente para ver cómo queda. Entonces vamos al Instagram de la página que estamos tomando como referencia, vamos a copiar el nombre y pegarlo aquí mismo en nuestro Website Builder. Ahí vamos a presionar Preview. Este code lo vamos a copiar, volvemos a nuestro Website Builder y lo pegamos aquí, guardamos. Una vez que pongamos Preview o apliquemos la página va a aparecer aquí mismo. Aquí abajo tenemos el footer. Lo que voy a hacer es editar esta información, podemos dejar el resto de la info, pero si quieren editarla también pueden hacerlo, por supuesto. Vamos ahora a editar la About Page desde nuestro sitemap elegimos About. El sitemap contiene todas nuestras páginas. Aquí por ejemplo tenemos este texto, lo voy a editar. Recuerden que todos los textos en la template son editables, ya sea para editar el tamaño, el color, la tipografía, la separación, el alineado, lo puedo centrar, lo puedo alinear a la izquierda, a la derecha. Si esto me quedó muy grande voy a achicar un poquito, vamos a ver otra y ahí va. Ahora vamos cambiar el color siguiendo con el estilo del Homepage, voy a hacer lo mismo aquí aplicando color de fondo desde Settings, seleccionando Una vez que completamos el texto lo centramos y recuerden que pueden cambiar la imagen. Vamos a Edit Image y vamos a seleccionar. Yo voy a tener una imagen guardada ya en mi computadora, la voy a seleccionar aquí vamos a ver dónde está y por ejemplo esa y la abrimos y apretamos Save, Perfecto. Continuamos ahora con la otra desde Edit Image Select File seleccionamos por ejemplo esta y ahí la guardamos. Ven cómo va cambiando y tomando forma a la medida que nosotros queremos. Este texto predictivo que ya les dije antes es de relleno para las templates, podemos modificarlo o simplemente borrarlo. Le voy a dar color este también vamos a nuestra página de referencia y copiamos y pegamos el texto color de fondo y listo, simplemente luego hacemos clic en Save para guardar todos los cambios adheridos hasta el momento. Una vez que terminamos vamos ahora a nuestra página de contacto, podemos simplemente dejar esto como está o adaptarlo a nuestro gusto. Aquí podemos también agregar una imagen. Acá vamos a agregar nuestra información ya que es la página de contacto y está bueno que nuestros clientes nos puedan contactar desde aquí brindándole nuestra información de contacto. Acá también podemos editar el texto. Vamos a centrar, vamos a continuar con la tipografía que venimos utilizando hasta ahora en las demás páginas. Desde acá, desde Design Elements simplemente arrastro el icono de Image y seleccionamos una foto o una imagen para agregar una nueva imagen. Quizás hay lugares donde no hay imagen y quiero agregar una nueva imagen, por ejemplo en este caso simplemente desde Design Elements arrastramos el icono de Image y lo agregamos, adaptamos el tamaño y ven que simple es, Ahí desde los laterales voy a ajustar el tamaño. Una vez que estamos contentos con nuestra página vamos a hacer clic en Save para guardar los cambios que hicimos hasta el momento. Como verán se pueden agregar links a las páginas que queramos. Simplemente vamos al sitemap y desde estos dos puntitos ponemos Putting Footer. Voy a agregar un par, le iba a aparecer el Blog Book Terms and Conditions. Estas son páginas que vamos a poder redirigir al usuario. Si quieren crear un eShop, les voy a mostrar cómo podemos hacerlo. Cargar nuestros productos y vender online Entonces desde nuestro sitemap hacemos clic en Shop, vamos acá Product, Add Product y se va a abrir esta ventana donde vamos a poder cargar fotos de nuestros productos. En este caso voy a seleccionar una imagen que tengo guardada, Abrimos, recuerden que pueden poner más de una imagen o bien no poner ninguna. Continuamos con los campos que tienen asteriscos, estos son obligatorios siempre. Entonces tenemos el nombre del producto, el precio, una descripción si queremos, vamos abajo, seleccionamos la categoría donde vamos a ubicar este producto, podemos crear una categoría cada vez que adherimos un producto nuevo, o bien agregarla a una categoría existente. Muy bien, ahí bajamos, voy a hacer clic en Save and Add New porque voy a agregar más productos a nuestra lista y continuamos directamente. Vamos a hacer el segundo agregamos una imagen o varias, o ninguna. Voy a seleccionar, abrimos, hacemos clic en Close, agregamos el nombre, el precio, insertamos este producto en una nueva categoría, simplemente escribiendo el nombre y haciendo clic en Add. Voy a guardar y agregar otro más. Una vez más selecciono una imagen, agrego el nombre del producto, el precio, podemos agregar también una breve descripción si queremos, si no, no. Aquí agregamos una nueva categoría, seleccionamos y vamos a agregar uno más, es el mismo proceso para todos. Ahí tenemos la imagen, unos macarons, la subimos, agregamos el nombre del producto, lo ubicamos en una nueva categoría. Acá podemos agregar Modifiers, ¿Qué significa esto? Cada categoría puede tener diferentes grupos, en este caso van a ser separados por el tamaño de las cajas, por ejemplo Box of 6 o Box of Twelve, que a su vez van a tener un extra cost o van a costar diferentes cuando el usuario realiza la compra, este extra cost será reflejado al final de la compra, en el momento del checkout. Entonces ahí dividimos los grupos y cada uno va a tener un costo diferente. En este caso podemos también agruparlos por colores, por tamaños, eso dependerá de cada producto. Una vez que terminamos, vamos a agregar uno más, el mismo proceso para todos, copiamos el nombre, el precio, lo insertamos al producto dentro de una categoría, en este caso voy a adherir una nueva, vamos a seleccionar un nuevo grupo de modifiers, podemos customizar este grupo, en este caso lo vamos a dividir por tamaños, en este caso vamos a dividir el precio por porción, ya que es una torta que puede venderse o entera o por porciones. Continuamos y vamos a agregar otro más. De esta forma luego cuando publiquemos nuestra página vamos a ver todos nuestros productos en la lista de Shop y estaremos listos para vender. Para este producto tenemos varios modificadores, se pueden agregar la cantidad que necesitemos para cada producto, se pueden agregar, luego borrar nuevamente, se pueden customizar cada uno de ellos y agregar productos dentro de cada grupo. Hacemos clic en Save, Ahí tenemos el botón de Customize, vamos a agregarle un costo extra, esto no es obligatorio, puede tener o no. Una vez que finalizamos de agregar productos simplemente hacemos clic en Save. Próximamente si estamos contentos con nuestra página y listos para publicar, simplemente hacemos clic en la ruedita. Website Settings Vamos a agregar nuestro propio dominio haciendo clic en Switch to on Domain Aquí van a encontrar las instrucciones de cómo linkear nuestro dominio con nuestra página. Aquí tenemos nuestra página de dominio que ya lo hemos comprado, vamos a hacer clic en DNS con el IP que salesview nos brindó, vamos a copiar y pegarlo aquí en este numerito, lo vamos a copiar y lo vamos a pegar aquí en nuestro dominio, lo agregamos y vemos cómo aparece. Una vez que estamos listos ponemos el nombre de nuestro dominio Key y lo guardamos. OK y tenemos nuestra página lista para ser publicada. Vamos a hacer clic en Publish. Aquí vamos a poner nuevamente el nombre de nuestra página, o sea nuestro dominio, vamos a hacer clic en Publish, esto puede tardar alrededor de dos horas o puede ser inmediato. Una vez que estamos listos vamos a ir a un buscador en una nueva ventana y vamos a abrir nuestra página. Ahí vemos cómo tenemos nuestra página desarrollada desde nuestro website Build There de salesview. Com Ahí vemos todos los cambios que hemos hecho con los productos, con el contact. Esperamos que este tutorial les haya servido, cualquier consulta no duden en contactarnos por nuestra página web salesview. Com y con gusto nos pondremos en contacto con usted para ayudarlo por cualquier consulta. Muchas gracias.