Manual Paso a Paso Para Crear Un Sitio Web Con Wix (Parte 1)

MANUAL PASO A PASO PARA CREAR UN SITIO WEB CON WIX JHON ALCIDES CAMPO URRIAGA FUNDACIÓN UNIVERSITARIA DEL ÁREA ANDINA

Views 57 Downloads 0 File size 3MB

Report DMCA / Copyright

DOWNLOAD FILE

Recommend stories

  • Author / Uploaded
  • lili
Citation preview

MANUAL PASO A PASO PARA CREAR UN SITIO WEB CON WIX

JHON ALCIDES CAMPO URRIAGA FUNDACIÓN UNIVERSITARIA DEL ÁREA ANDINA

Contenido PASOS PARA INICIAR CON WIX ...................................................................................................2 INICIO CON WIX ...........................................................................................................................4 CREAR UN SITIO CON WIX ......................................................................................................10 SELECCIONAR PLANTILLA .....................................................................................................12 CREACION DE PAGINAS Y SUBPAGINAS .............................................................................17 PERSONALIZAR EL ENCABEZADO ........................................................................................22 Vamos a insertar la fecha y la hora a mi sitio web.........................................................................38 Vamos a insertar buscador en nuestro sitio web ..........................................................................48 Contador

de visitas......................................................................................................................52

Redes Sociales ...................................................................................................................................60

Elementos que debo tener en cuenta 1. Tener una cuenta de Gmail valida

PASOS PARA INICIAR CON WIX Ingreso a cualquier navegador de internet de su gusto, e ingreso a google, así como me lo muestra la ventana siguiente

En google escribo WIX asi:

Seleccionar la opción llamada Wix: Páginas web gratis | Cómo crear una página web gratis

Clic sobre la opción Wix: Páginas web gratis | Cómo crear una página web gratis Y nos muestra la siguiente ventana

INICIO CON WIX

Para ingresar podemos ingresar dando clic en el botón en la parte superior derecha, o en el botón en la parte central

ubicado

y nos muestra la siguiente ventana

Para el ingreso lo podemos realizar por tres formas ( 1. Registrándome

2. O Ingresando por una cuenta de FACEBOOK

3. O Ingresando una cuenta de GMAIL

valida

Valida

Nota (La cuenta de Mi correo Institucional del Área Andina funciona porque es de Gmail o si no tengo una puedo crear una)

Por eso es importante para no complicarnos utilizar una cuenta de GMAIL valida

Para ello clic en el botón muestra la siguiente ventana

, nos

Introduzco la cuenta de correo valida de Gmail (o puedo trabajar con mi cuenta institucional del área andina)

Diligencio los datos de la cuenta de correo a utilizar

Clic botón

y muestra la siguiente ventana

Diligencio mi contraseña valida de mi correo ingresado

Clic botón

y muestra la siguiente ventana

************************************** O puedo utilizar mi cuenta de correo del Área Andina si no tengo cuenta de Gmail

Pero si UTILIZO LA CUENTA DEL AREA ANDINA Ingreso la cuenta de correo

Nos pide confirmar

Me muestra el inicio de la cuenta institucional

Clic en

y nos muestra la siguiente ventana

CREAR UN SITIO CON WIX Cuando nos encontramos en Wix una vez registrados

Clic en las opciones imagen a continuación

como se muestra en la siguiente

Si deseo ingresar clic en

Una vez que damos clic en crear un nuevo sitio aparecerá la siguiente venta

Clic en la opción

Clic en el botón ventana

y nos muestra la siguiente ventana

y nos aparecerá la siguiente

SELECCIONAR PLANTILLA Lo primero que se debe realizar es seleccionar objeto de mi sitio web

una plantilla

según el

Al lado izquierdo vamos encontrar plantillas por categorías y están divididas en dos grupos 1. SEGÚN CATEGORIAS

Plantillas Nuevas; las más populares o iniciar desde cero platillas en blanco 2. TODAS LAS CATEGORIAS

Según su sitio web van a seleccionar una plantilla la que más se adecue a su necesidad Si soy una empresa puedo irme por la categoría Negocios Asesoría Servicios, productos

Si soy una empresa de turismo puedo irme por la categoría Viajes y Turismo

Si soy una institución educativa puedo irme por la categoría Comunidad y Educación

Vamos a escoger una plantilla para el ejercicio y cada equipo utilizara la plantilla que más desee para su sitio recuerde que llevaremos un hilo de diseño

Para este ejercicio trabajaremos con la categoría Comunidad y Educación para los otros sitios SELECCIONAN SU PLANTILLA realizaremos lo mismo sin importar la plantilla seleccionada según el objeto del sitio funciona para cualquier plantilla

Entonces vamos a la categoría activan unas opciones

Clic en la opción plantillas para esta categoría

doy clic y se

y nos muestra al lado derecho todas las

Selecciono la que más me gusta (igual para el resto de categorías)

Para seleccionar plantilla

la plantilla que desea pasa el mouse sobre la imagen de la

Se activan 2 botones para iniciar clic en el botón nos muestra la plantilla seleccionada

Si deseo guardar clic en botón en la parte superior derecha la siguiente ventana

y

y aparece

Le doy un nombre que tenga que ver con el sitio así ( el sitio es para una institución educativa)

Y al final clic ventana

en el botón

y nos muestra la siguiente

Seleccionamos

y clic botón

CREACION DE PAGINAS Y SUBPAGINAS Vamos adecuar nuestra plantilla seleccionada para nuestra empresa o institución educativa

Lo primero que vamos a realizar es adecuar las páginas y subpáginas de nuestro mapa de contenido creado

Para adecuar nuestras páginas o subpáginas a nuestra plantilla seleccionada vamos a ir a la parte izquierda donde encontraremos nuestro menú

MENUS Y PAGINAS

FONDO

AGREGAR

AGREGAR APPS

MIS CARGAS

COMIENZA TU BLOG

RESERVAS

Vamos a ingresar al primer opción o seleccionada

y nos muestra

clic en el icono

las páginas y subpáginas de la plantilla

Vamos a justarla a nuestra propuesta Damos doble clic a la primera página y nos muestra lo siguiente

Y empezamos a cambiarla

Cambiamos el nombre de deseamos y al final clic botón

Cada página tiene unas opciones podemos dar clic en el icono de cada página y nos muestra estas opciones

Renombrar cambiar de nombre Duplicar la pagina Ocultar la pagina Crear una Subpágina de una página principal Eliminar

Una vez creada la primera página de nuestro sitio web podemos crear una subpágina de esta primera página y para crear una página nueva

clic en la opción al final llamada

Si utilizamos esta opción me creara lo siguiente

Le doy un nombre (según lo que necesite)

Convertiremos la página creada en una subpágina de la página principal QUIENES SOMOS En la página activan las opciones

Clic en QUIENES SOMOS

me voy al icono

doy clic y se

para convertirla en subpágina de la página principal

Empiezo a construir las páginas y subpáginas de su sitio web con respecto al mapa de contenido propuesto Recordar que también puedo convertir una subpágina en página principal El ejercicio es crear todas las páginas y subpáginas de su sitio web (SIN CONTENIDO POR AHORA)

Una vez creado todas las páginas y subpáginas de nuestro sitio web clic en la opción

o

Si queremos ver cómo va quedando lo realizado derecha encontramos una opción llamada

en la parte superior

Nos muestra que las páginas y subpáginas creadas funcionan Si deseamos volver a editar o área de trabajo nuevamente clic en el botón

ubicado en la parte superior derecha

PERSONALIZAR EL ENCABEZADO

Nos ubicaremos en el encabezado del sitio web

Eliminaremos toda información de textos imágenes del encabezado y lo personalizamos a nuestro sitio Para eliminar cada objeto clic sobre el objeto Suprimir( Supr)

y oprimimos la tecla

Iniciaremos personalizando nuestro sitio en el encabezado 1. Debemos buscar un logo de la institución o empresa y dejarlo guardado en el escritorio

Lo vincularemos

a nuestro sitio web

Estando en nuestro sitio web vamos al mùnu principal ubicado al lado izquierdo clic en la opción opciones

Agregar y se nos activa las siguientes

Clic en la opción

y nos muestra las siguientes opciones

Clic

en la opción

Y se activa una ventana

Clic en el botón nos muestra la siguiente ventana

o en el link

Clic en el botón ventana de cargar el archivo que necesitamos

y

y nos muestra la

Seleccionamos nuestro archivo

Clic en el botón

nos muestra que carga el archivo

Se evidencia el cargue del archico seleccionado

Cuando agregamos el archivo y pasamos el mouse sobre el se activan 2 opciones Agregar a favoritos Opciones

Debemos tener en cuenta que la imagen este seleccionada en un recuadro azul

Clic en la opción

y nos muestra la ventana

Nos agregó la imagen con el clic sostenido sobre la imagen la ubicaremos en la parte superior o encabezado del sitio web

Como es un poco grande la podemos reducir de los puntos esquina de la imagen

en cada

Vamos agregar un título o el nombre del sitio web Para agregar un título nos dirigimos al menú principal ubicado al lado izquierdo y seleccionamos el icono opciones

Agregar y se nos activa las siguientes

Necesitamos vincular un texto y debemos tener la certeza que estemos ubicados en la opción

y nos muestra las siguientes opciones

Esta opción de textos tenemos múltiples opciones ustedes seleccionan el que más les guste para su título con la barrita de desplazamiento (arriba – abajo) puedo seleccionar el tipo de texto que deseo

Para el ejercicio voy a darle clic en activa en la pantalla

y se

Con el clic sostenido sobre el texto lo ubico en la parte superior del encabezado

Doy doble clic sobre el texto

Se Activan las opciones del texto

Cambiaremos el titulo

Empezamos a jugar con las opciones del texto cambiar color activa la paleta de colores

se

Selecciono el que más me gusta (según los colores institucionales)

Puedo trabajar Alineación del texto donde encontramos las siguientes opciones (derecha, izquierda, centro y justificado)

Podemos explorar y trabajar con nos muestra las siguientes opciones donde podemos aplicar al texto según el gusto

Podemos agregar debajo del texto la resolución de creación del ministerio de educación si es una institución educativa o el Nit si es una Empresa y fecha de creación

Continuaremos agregaremos 3 elementos ( buscador ; contador de visitas y un reloj)

Vamos a insertar la fecha y la hora a mi sitio web Vamos a darle clic al siguiente link http://www.timeanddate.com/clocks/free.html o lo copiamos en nuestro navegador de internet y nos muestra la siguiente ventana

En la parte inferior de la página hay un botón

Clic en el botón

y se muestra la siguiente ventana

Seleccionaremos la opción data & time

En la parte inferior clic en el botón ventana

Cambiaremos

por

solamente

y se muestra la siguiente

el

lenguaje

Clic en el botón

y se muestra la siguiente ventana

No cambaremos nada (si lo desea lo puede hacer) Clic en el botón

y se muestra la siguiente ventana

Clic en el botón

y se muestra la siguiente ventana

En la opción

Selecciono

En la parte inferior nos muestra el código HTML del reloj

Sombreamos el código así

Clic derecho y se activa una ventana clic en la opción copiar como se muestra en la página a continuación

Me voy para mi editor de wix

Clic al botón

Clic en la opción

agregar y nos muestra la siguiente ventana

y nos muestra la siguiente ventana

Con el Clic Sostenido sobre la opción arrastro la opción al área de trabajo y aparece el siguiente recuadro en el área de trabajo

Clic en el botón la siguiente ventana

en el recuadro que se nos incorporó y nos muestra

Pegaremos el código que se nos formó en la selección de la fecha y hora en el recuadro así (si no lo pego vamos y lo copiamos y lo pegamos)

Y nos aparece la fecha y hora actual

Clic en el botón

y nos muestra la siguiente ventana

Cerramos la ventanita clic en

Subimos el recuadro de fecha y hora y lo ubicamos en el encabezado en el lugar que usted considere ( se ajusta )

Vamos a insertar buscador en nuestro sitio web

Clic al botón

agregar y nos muestra la siguiente ventana

Clic en la opción

y nos muestra la siguiente ventana

En la parte inferior desplazamiento arriba o abajo

Seleccionamos Nos muestra la siguiente ventana

puedo buscarlo con la flecha de

Clic en el botón Nos muestra la siguiente ventana

Y se carga en el sitio web

Lo ubicaremos en la parte superior lugar que deseen

Vamos

a colocar un contador de visitas

Contador de visitas

Clic al botón

Agregar Apps y nos muestra la siguiente ventana

Clic en la opción de apps que podemos tener

Clic en la opción

nos muestra todas las categorías

y nos muestra las siguientes opciones

Clic

en la opción

y nos muestra la siguiente ventana

Clic botón No lo muestra en la ventana de trabajo

Doy doble clic sobre el contador y se activa las siguiente venta

Clic en siguiente información

y me muestra la opción

con la

Cambio la opción

por

resto lo dejo igual

pasamos a la opción

y nos muestra los formatos

Elijo un formato el que mas me guste

Paso a

y cambio el diseño

Cambio La Fuente delos dígitos a mi gusto

Puedo revisar las opciones ( las ajusto al gusto del equipo)

el

Cambio el color de los dígitos a mi gusto

Cambio el color de fondo a mi gusto

Cuando cuadro todo cierro la ventana

Puedo reducir el tamaño de los puntos y lo ubico en la parte superior (encabezado)

Agregaremos un texto al lado del contador de visitas así

Que nos quede así

Redes Sociales Nos ubicaremos en la parte inferior

Para personalizarlo doble clic sobre los logos y se muestra la siguiente ventana

Puedo agregar más iconos dando clic sobre el botón muestra la siguiente ventana

Puedo cargar según las siguientes opciones

Pero si deseo personalizar las redes sociales con mi información

Clic sobre el logo de facebook

y me

En la parte izquierda aparece la siguiente opción

Mue muestra al lado derecho las siguientes opciones

Puedo cambiar el icono clic en el botón personalizar al Facebook de cada uno clic en

, y necesito y aparece la siguiente ventana

Cambio la URL de Facebook (el de cada uno) como se muestra acontinuación

El resto de información no la cambio clic botón Cambio los demás hago el mismo procedimiento y si no tengo mas los elemino

Cuando le pasa el mouse sobre la imagen la puede eliminar o agregar otras

Una vez cambiados a todos los iconos de redes clic botón Que la barra le quede personalizado así (con su información)

Personalizar Los Textos Inferiores con datos reales y de los integrantes del grupo Ejemplo Llámanos: 3124568974 / [email protected] / Av. Los Rosales 12- 34, Bogotá. © 2019: Integrantes Pablo Ruiz; Oscar Martínez; Olga Perilla ( Esp. Informática Educativa) Creado con Wix.com

Una vez terminado todo clic en el enlace en la parte superior después clic en el botón

y

Me muestra el link del sitio web

lo puedo copiar para mi evidencia

FELICITACIONES SI SE PUEDE LOGRAR