Mdulos: Creacin y publicacin de Sitios Web

Paso a Paso

Editar pginas con plantillas

En este tutorial usted encontrar toda la informacin necesaria para crear y publicar un sitio web. Cada uno de los pasos descritos en este tutorial est basado en la creacin del sitio web del Colegio El Aromo, que corresponde al ejemplo revisado en la etapa Demostracin del presente mdulo. 1.- Creacin de sitios web Para comenzar el trabajo, es necesario que usted abra una cuenta en gmail (si no tiene es recomendable abrir una), con el correo abierto debes entrar en otra ventana en esta direccin www.wix.com , de esta manera podrs acceder al sitio en espaol. Presiona el botn Regstrate y completa con los datos que te piden en la pestaa Regstrate. 2. Desde el men superior, clic en 'Crear'.

En la parte izquierda de la seccin Crear puedes ver las categoras que hemos creado para ti. Esto te ayudar a elegir una plantilla segn tus necesidades. 3. Desde el lado izquierdo de la pgina de 'Crear', elige una Categora y navega por nuestras plantillas. 4. Una vez encuentras un diseo que te gusta, pasa el cursor por la plantilla.

Mdulos: Creacin y publicacin de Sitios Web

Paso a Paso

5. Haz clic en 'Editar' para abrir la plantilla en tu Editor. 'Puedes elegir una plantilla para verla o editarla. "Ver" abre la plantilla en una pgina web y te permite explorarla ms a fondo. "Editar" abre la plantilla en tu editor y te da un control total y el acceso a cambiarla, aadir, o eliminar elementos.

Editando una Plantilla Una vez elegida una plantilla y la abres en tu editor, puedes comenzar a transformarla y agregar tu propio contenido en ella. Puedes eliminar, editar o aadir cualquier contenido que deseas a la plantilla. La plantilla es simplemente un punto de partida y se puede manipular sus contenidos en cualquier forma que mejor te parezca. Permanecer el Interior del Borde del Sitio El borde blanco en el Editor que rodea el contenido del sitio es tu frontera. Es importante mantener todo el contenido dentro de este borde de pgina. Cualquier cosa fuera de l no ser visible en vista 'Preliminar' o en tu sitio en vivo. Si la pgina es demasiado pequea o demasiado grande, puedes cambiar las dimensiones del sitio o de la manera que los usuarios ven su sitio en su navegador.

Mdulos: Creacin y publicacin de Sitios Web Administrando Tus Pginas En tu editor a la derecha, podrs ver el Administrador de Pgina. Hay dos tipos de pginas en tu sitio: Pginas Maestras y Pginas. El Administrador de Pgina muestra y organiza todas tus Pginas y las Pginas Maestras. Para abrir una de tus Pginas y verla en tu editor, simplemente haz clic en la pgina desde el Administrador de la Pgina a la derecha.

Paso a Paso

Pginas son un grupo de pginas mltiples que puedes colocar dentro de una Pgina Maestra: Te permiten colocar variedad de contenido dentro de solo una Pgina Maestra. Esto permite transiciones ms suaves y amenas cuando un visitante llega a tu sitio. Navegar entre Pginas le da a tu sitio web un 'look' mucho ms profesional.

El diseo de tu sitio con Pginas te permite crear un sitio web nico en el cual tu fondo y los mens permanecen estticos mientras que el resto del contenido cambia. Esto tiene la ventaja de hacer las transiciones de tu sitio aparecer mucho ms suaves. Un fondo esttico tambin te permite reproducir msica de manera continua mientras tus visitantes navegan por tu sitio.

Mdulos: Creacin y publicacin de Sitios Web Navegando Por Tus Pginas Navegando por entre Pginas Maestras o Pginas puede hacerse por medio del Administrador de Pginas. Adicionalmente, puedes navegar por tus Pginas haciendo clic en las flechas del sombrero de ellas. En la parte superior de las Pginas ves flechas para la izquierda y para la derecha.

Paso a Paso

Agregando un Elemento A la izquierda del Editor, se encuentra la "Barra de Diseo". Puedes utilizarlo para agregar elementos diferentes a tu sitio. Cada categora en la 'Barra de Diseo' se expande para mostrar un men de elementos disponibles. Cada elemento del men se expande ms en los diferentes estilos que estn disponibles para un elemento seleccionado. Para obtener una lista detallada de productos disponibles, consulta 'ndice de Barra de Diseo'. Explora la seccin de 'Barra de Diseo' agregando un elemento a tu documento. Para agregar un elemento: 1. Desplzate a una categora en 'Barra de Diseo'

Mdulos: Creacin y publicacin de Sitios Web 2. Desde el men que se abre, haz clic en un elemento. 3. Desde la galera de elementos, haz clic en un estilo.

Paso a Paso

Tu elemento nuevo aparecer en tu sitio. Editar un Elemento Una vez que selecciones un elemento desde 'Barra de Diseo' o haces clic en un elemento que ya est en tu plantilla, sers capaz de personalizarlo completamente. Al hacer clic en un elemento en tu Editor, se activa el panel de propiedades de tu editor que el tema se activa y se muestra en la parte inferior de tu editor. Cada elemento que seleccionas tiene un conjunto diferente de propiedades disponibles editables. Tambin podrs cambiar el tamao, rotar y organizar un elemento dentro de tu sitio.

Mdulos: Creacin y publicacin de Sitios Web Edicin de un Elemento Mediante el Panel de Propiedades ( a la derecha del Editor) Para editar un elemento mediante el panel de propiedades: 1. Haz clic sobre el elemento. 2. Desde el panel de propiedades que aparece en la derecha del Editor, haz clic en una propiedad.

Paso a Paso

3. Desde la ventana de propiedades que se abre, edita la configuracin de esa propiedad.

4. Clic OK (si est disponible) o X para aplicar los cambios. Las configuraciones de las propiedades de tu elemento han cambiado.

Mdulos: Creacin y publicacin de Sitios Web Cambiando el Tamao de un Elemento Para cambiar el tamao de un elemento: 1. Haz clic en el elemento para seleccionarlo. 2. Haz un clic sostenido en el cuadrado que permite cambiar el tamao y arrstralo a su lugar.

Paso a Paso

3. Repite los mismos pasos con los otros cuadrados de los otros lados que permiten cambiar el tamao para uniformarlos. El tamao de tu elemento ha sido cambiado. Rotando un Elemento Para rotar un elemento: 1. Haz clic en el elemento para seleccionarlo. 2. Haz un clic sostenido la flecha rotatoria en la esquina superior derecha del elemento.

Tu elemento rota.

Mdulos: Creacin y publicacin de Sitios Web Organizar un Elemento Para organizar un elemento: 1. Haz clic en el elemento para seleccionarlo. 2. Desde el men superior, haz clic en 'Organizar'. 3. Desde el men de 'Organizar', selecciona una opcin.

Paso a Paso

Tu elemento se mueve hacia atrs y hacia adelante segn el comando. Reemplazando Fondos de Plantillas Puedes reemplazar todos los fondos en la plantilla que hayas seleccionado. Puedes reemplazar el fondo del navegador, el fondo de la Pgina Maestra y el fondo de la Pgina. Elige colores de fondos imgenes que combinen con tu sitio y el contenido de tu sitio. Reemplazando el Fondo de tu Pgina Para reemplazar el fondo de tus Pginas: 1. Haz clic en la Pgina para seleccionarla. 2. Desde el panel de men inferior, clic Aspecto 3. Desde Aspecto, selecciona una que te guste.

Mdulos: Creacin y publicacin de Sitios Web El fondo de tu Pgina ha sido cambiado. Reemplazando el Fondo de tu Pgina Maestra Para reemplazar el fondo de tu Pgina Maestra: 1. Ve a Fondo, clic en Fondo>Pgina Maestra

Paso a Paso

2. Desde la galera de Fondos, navega por la variedad que te presentamos.

Mdulos: Creacin y publicacin de Sitios Web 3. Haz clic en un fondo para seleccionarlo. El fondo de tu Pgina Maestra ha sido cambiado. Reemplazando el Fondo de tu Navegador Para reemplazar el fondo de tu navegador: 1. Desde la Barra de Diseo a la izquierda del Editor, haz clic en Fondo> Sitio.

Paso a Paso

2. Desde el Selector de Color que se abre, haz clic en un color nuevo. Clic en Cerrar, luego en Aceptar.

El fondo de tu navegador ha cambiado.

Mdulos: Creacin y publicacin de Sitios Web Reemplazando los Ttulos en el Men Fcilmente puedes reemplazar el men de tu plantilla para reflejar los nombres de tus Pginas. Para hacer esto, debes renombrar las Pginas. Renombrando tus pginas asegura que cualquier otro men que agregues automticamente reflejar los ttulos de tus Pginas. Para reemplazar los ttulos del men: 1. Desde el Administrador de Pginas a la derecha de tu editor, pasa el mouse sobre una pgina y haz clic en la flecha desplegable que aparece. 2. En el men desplegable, haz clic en Renombrar. 3. En la casilla, ingresa el nombre nuevo de tu Pgina.

Paso a Paso

Los cambios en los ttulos del men se reflejan los nombres de tus Pginas. Reemplazando el Texto en tu Plantilla De una manera muy fcil puedes editar o borrar todo el texto en tu plantilla! Las dos secciones a continuacin te darn ms informacin acerca de como borrar o editar el texto. Editando el Texto en una Plantilla Fcilmente puedes editar los ttulos y prrafos que estn en tu plantilla de manera predeterminada. Para editar el texto en una plantilla:

Mdulos: Creacin y publicacin de Sitios Web 1. Doble-clic en el ttulo y/o prrafo que estn ah de manera predeterminada.

Paso a Paso

2. Desde el cajn del texto, elimina y digita tu propio texto.

El texto en tu plantilla ha cambiado. Borrando Texto en una Plantilla Si deseas borrar el ttulo o prrafo por completo, simplemente puedes borrar todo el cajn del texto. Para borrar el texto en un prrafo: 1. Haz clic en el ttulo prrafo para seleccionarlo.

2. Presiona la tecla 'Delete' en tu teclado. Desaparece el cajn de texto.

Mdulos: Creacin y publicacin de Sitios Web Reemplazando Imgenes en una Plantilla Para reemplaza una imgen individual: 1. Haz clic en la imagen para seleccionarla 2. Desde el panel de men inferior, haz clic en Reemplazar

Paso a Paso

3. Desde la ventana de Fotos que se abre, navega por las imgenes o carga a tu sitio tu propia foto.

4. Haz clic en una imagen para agregarla a tu sitio. La imagen que has seleccionado reemplaza la de la plantilla.

Mdulos: Creacin y publicacin de Sitios Web Reemplazando Imgenes en una Galera de Fotos Para reemplazar las imgenes en una Galera de Fotos: 1. Haz clic en la galera para seleccionarla. 2. Desde el panel de men inferior, clic Administrar Fotos.

Paso a Paso

3. Desde la ventana de Administrar Fotos, clic Eliminar Todo. 4. En la caja de confirmacin, haz clic en S. 5. Desde la ventana de Administrar Fotos que se abre, clic Agregar Foto 6. Desde la ventana de imgenes, navega por la variedad que te ofrecemos o carga la una foto propia. 7. Haz clic en las imgenes para agregarlas a tu galera. 8. Cuando termines haz clic en Aceptar. 9. Desde la ventana de Administrar Fotos, haz clic en Aceptar. Tus imgenes han reemplazado las de la plantilla original. ndice de Barra de Diseo Todos nuestros elementos estan categorizados y son fciles de encontrar. A continuacin encontrars la lista de elementos disponibles para tu uso personal en tu sitio web. Para informacin in detalle de cada elemento haz clic en los enlaces debajo de cada ndice.

Nuestro elementos incluyen:

Texto: agrega Ttulos y Prrafos

Mdulos: Creacin y publicacin de Sitios Web

Paso a Paso

Fotos: Agrega imgenes de Wix, Fotolia, la Comunidad o Carga tu propio diseo!

Galeras: Agrega varios estilos de galera de fotos a tu sitio.

Msica &Video: aadir msica y video a tu sitio!

Clip Art: agrega formas, imgenes prediseadas, lneas, efectos de video, animaciones e iconos en tu sitio.

Pginas: esta categora incluye caractersticas que hacen tu pgina web ms dinmica. Las caractersticas incluyen: reas y Grupos de Pginas.

Mdulos: Creacin y publicacin de Sitios Web

Paso a Paso

Navegacin: agrega mens, botones y controladores.

Widgets: aadir los canales RSS, permitir Comentarios, aadir Formularios de Contacto, mapas de Google y el cdigo HTML a tu sitio.

eCommerce: aadir funciones de eCommerce a tu sitio! Esto incluye botones de PayPal Publicando t Sitio Web Ahora que ya has editado tu plantilla y la has personalizado a tu manera, ests listo para verla online y publicarla. Debers guardar tu documento antes de publicarlo. Tambin puedes hacer una vista previa 'Preview' para ver como lo vern tus visitantes. Slo tendrs que publicarla una sola vez. Una vez la hayas publicado, haciendo clic en Publish, solo debes hacer clic en 'Save' las prximas veces que lo edites y los cambios sern publicados automticamente. Vista Preliminar de tu Documento Para ver una vista previa de tu documento, haz clic en Vista Previa desde la parte superior del Editor.

Ahora podrs navegar por tu sitio como si estuviera online. Para regresar al Editor, clic, Volver a Editar desde el men superior.

Guardando tu Documento Para Guardar tu documento: 1. Desde el men superior en el Editor, haz clic en Guardar.

Mdulos: Creacin y publicacin de Sitios Web

Paso a Paso

2. En la casilla de Guardar Como, ingresa el nombre de tu Sitio Wix.

3. Clic Aceptar. Tu Sitio Wix ha sido guardado satisfactoriamente. Publicando tu Sitio Para publicar tu sitio: 1. Desde el men superior del Editor, haz clic en Publicar. 2. Desde la ventana de Publicar, haz clic en Publicar.

3. Desde la ventana de Felicitaciones, clic Ir, al aldo de la url de tu sitio.

Mdulos: Creacin y publicacin de Sitios Web

Paso a Paso

Tu sitio web est online! Felicitaciones!