You are on page 1of 41

EDITOR WEB ONLINE DE ENTEL DATACENTER

Manual de Usuario
Versin 1.4
Gerencia de Sistemas Gerencia Depto. Data Center
Dir. Desarrollo Internet y Banda Ancha Area Data Center.
Editor Web OnLine de ENTEL DataCenter
Manual de Usuario
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 2
Editor Web Online ENTEL Data Center
INDICE
1 PRESENTACIN---------------------------------------------------------------------------------------- 3
A) CMO INGRESAR A SU EDITOR WEB ONLINE------------------------------------------------------- 3
B) CARACTERSTICAS GENERALES DEL SITIO DEL EDITOR WEB ONLINE-------------------------- 3
C) RECOMENDACIONES------------------------------------------------------------------------------------ 4
2 OPCIONES DEL MEN DEL SITIO WEB ------------------------------------------------------- 5
A) IR A MI SITIO--------------------------------------------------------------------------------------------- 5
B) CREAR CARPETA---------------------------------------------------------------------------------------- 6
C) CREAR PGINA------------------------------------------------------------------------------------------ 6
D) RESPALDO Y RECUPERACIN ------------------------------------------------------------------------- 6
E) CERRAR SESIN----------------------------------------------------------------------------------------- 7
3 OTRAS OPCIONES------------------------------------------------------------------------------------- 8
A) CONDICIONES DEL SERVICIO-------------------------------------------------------------------------- 8
B) AYUDA --------------------------------------------------------------------------------------------------- 8
C) ENLACES DEL MEN SUPERIOR ----------------------------------------------------------------------- 8
4 UTILIZACIN DE LAS OPCIONES GENERALES DE LA PGINA PRINCIPAL
(BROWSER.PHP) ---------------------------------------------------------------------------------------------- 9
A) CMO EDITAR UNA PGINA WEB DEL SITIO-------------------------------------------------------- 9
B) CMO CREAR UNA CARPETA DESDE LA PGINA PRINCIPAL -------------------------------------- 9
C) CMO ELIMINAR UNA CARPETA O ARCHIVO DESDE LA PGINA PRINCIPAL ------------------ 10
D) CMO RENOMBRAR UNA CARPETA O ARCHIVO DESDE LA PGINA PRINCIPAL--------------- 11
E) CMO SUBIR UN ARCHIVO AL SITIO WEB --------------------------------------------------------- 11
5 UTILIZACIN DEL EDITOR WEB ONLINE: ------------------------------------------------ 13
A) CARACTERSTICAS Y USO DE LOS ELEMENTOS DEL EDITOR WEB ONLINE ------------------- 13
B) OPCIONES DE EDICIN ------------------------------------------------------------------------------- 14
C) MODO VISUAL O WYSIWYG----------------------------------------------------------------------- 14
D) MODO TEXTO ----------------------------------------------------------------------------------------- 14
E) UTILIZACIN DE LOS TEMPLATES (PLANTILLAS) QUE VIENEN INCLUIDAS CON EL EDITOR 15
F) MODIFICACIN DE LAS PROPIEDADES DEL DOCUMENTO---------------------------------------- 16
G) AYUDA PARA EL USO DEL EDITOR WEB ONLINE: ADEMS DEL PRESENTE MANUAL ------ 18
H) OPCIONES DE TABLAS -------------------------------------------------------------------------------- 18
I) PROPIEDADES DE LA TABLA------------------------------------------------------------------------- 21
J) OPCIONES DE FILAS----------------------------------------------------------------------------------- 27
K) OPCIONES DE COLUMNAS---------------------------------------------------------------------------- 29
L) OPCIONES DE CELDAS INDIVIDUALES-------------------------------------------------------------- 30
M) OPCIN DE BORRADO RPIDO DE TABLAS Y OBJETOS ------------------------------------------- 32
N) OPCIONES DE TEXTO --------------------------------------------------------------------------------- 33
O) OPCIONES DE COLOR DE LOS ELEMENTOS DE LA PGINA --------------------------------------- 38
P) INSERTAR ENLACES, IMGENES, Y SEPARADORES ----------------------------------------------- 38
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 3
Editor Web Online ENTEL Data Center
1 PRESENTACIN
Bienvenido (a) al Manual de Uso de su Editor Online, aqu encontrar
toda la informacin necesaria para llevar a cabo la confeccin de su sitio en forma
sencilla y rpida. Slo debe seguir las instrucciones que se sealan y utilizar su
creatividad Buena Suerte.
a) Cmo ingresar a su Editor Web Online
Para ingresar a su Editor Web Online, slo debe escribir en su navegador
la siguiente direccin o URL:
http://editorweb.enteldatacenter.cl
Luego, deber ingresar su Username y Password asignados al contratar
su cuenta de webhosting compartido y presionar el botn Aceptar. (Fig. A)
Fig. A: Recuadro de ingreso al Editor Web Online
b) Caractersticas Generales del sitio del Editor Web Online
El Editor Web Online de ENTEL Datacenter es un servicio moderno y
prctico que consiste en proporcionar al cliente las herramientas necesarias para
crear y manejar con facilidad su propio sitio Web.
Con este sistema podr crear sitios completos con su propio diseo o
basados en los Templates o Plantillas que vienen incluidos en el servicio.
El Editor Web Online es muy similar a los software profesionales para
editar pginas Web, con la ventaja que Usted crea todo su sitio en forma casi
instantnea y listo para ser publicado, sin complicaciones.
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 4
Editor Web Online ENTEL Data Center
Portada del Editor Web Online:
c) Recomendaciones
Antes de empezar recomendamos que planee cmo va a ser su sitio
Web. Una buena idea es escribir en un papel las secciones (cada una de las
pginas) que incluir en su Web y preparar los textos e imgenes que se
insertarn.
Recomendamos que antes de utilizar su Editor Web desactive todos los
programas que cierren los Pop Up o ventanas emergentes. Los nuevos
navegadores o browsers vienen con esa opcin activada as que asegrese de
desactivarla.
Por qu recomendamos eso? Porque el Editor utiliza ventanas emergentes o
Pop Up para desplegar las diferentes opciones u elementos y si usted usa un
programa que las elimina no podr acceder a esas opciones.
Importante: El Editor Web Online acepta todas las etiquetas de HTML bsico,
pero NO se puede agregar flash a su pgina Web, ni frames, ni
javascripts o applets, ni tampoco DHTML o efectos especiales que
tengan una programacin diferente al HTML bsico.
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 5
Editor Web Online ENTEL Data Center
2 OPCIONES DEL MEN DEL SITIO WEB
En esta seccin nos referiremos al uso de los enlaces o links presentes
en el men principal del sitio del Editor Web Online. (Fig. 1)
Fig.1 men principal del Editor Web Online:
a) Ir a mi sitio
Esta es la pgina principal de su Editor Web Online, en la que se
encuentra la lista de archivos, pginas Web y carpetas que conforman su sitio
Web. (Fig.2)
Fig.2 Pgina de Ir a mi sitio de su Editor Web Online:
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 6
Editor Web Online ENTEL Data Center
b) Crear Carpeta
Mediante esta opcin Usted puede crear una nueva carpeta en su sitio
Web para incluir en ella imgenes, grficos o los elementos que usted necesita.
Al hacer click en la opcin Crear Carpeta se abrir una ventana en la
debe escribir el nombre para la nueva carpeta. Luego puede acceder a ella a
travs del listado de elementos de su sitio que aparece en Ir a mi sitio. (Fig. 3)
Fig.3 Opcin Crear Carpeta:
c) Crear Pgina
Mediante esta opcin Usted puede insertar una nueva pgina a su sitio
Web, al igual que en el caso de la opcin Crear Carpeta al hacer click sobre la
opcin se abrir una ventana donde debe escribir el nombre de la nueva pgina.
Posteriormente podr editarla y insertarles sus textos, imgenes, etc. (Fig.4)
Fig.4 Opcin Crear Pgina
d) Respaldo y Recuperacin
Esta opcin le permite guardar Respaldos o copias de todos los
elementos de su sitio Web, los que podr recuperar en caso de cometer un error
que no puede solucionar o Eliminar accidentalmente uno de sus archivos o pginas
Web. Recomendamos que guarde siempre copias de sus archivos.
Si desea REEMPLAZAR su archivo o pgina Web daada por la guardada
en este Respaldo y Recuperacin, slo marque la o las casillas correspondientes y
haga click sobre el botn "Restaurar Seleccionados". Esto sobrescribir la o las
pginas vigentes en su directorio. Asegrese de que sus archivos de Respaldo y
Recuperacin estn actualizados.
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 7
Editor Web Online ENTEL Data Center
Si desea revisar el Respaldo y Recuperacin antes de restaurarlo, haga
click en el nombre del archivo para cargarlo en el editor y reeditarlo.
e) Cerrar Sesin
Mediante esta opcin Usted cerrar su sesin y saldr del Editor Web
Online. Siempre recuerde seleccionar esta opcin cuando termine de usar su Editor
ya que en algunos navegadores las claves o passwords se guardan
automticamente y si Usted no cierra su sesin otra persona podra entrar al Editor
usando su cuenta. Esto es recomendado sobre todo en casos en los que se utilizan
computadores de terceras personas o de cibercafs.
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 8
Editor Web Online ENTEL Data Center
3 OTRAS OPCIONES
a) Condiciones del Servicio
En est pagina Usted encontrar las normas y reglas que rigen el uso de
su Editor Web Online, que se aplican mientras Usted tenga contratado el servicio
de Editor Web Online de ENTEL Datacenter.
b) Ayuda
En esta pgina Usted encontrar una ayuda online que explica los usos
de las diferentes opciones de su editor Web Online.
c) Enlaces del men superior
En la parte superior de su Editor Web Online existe un men de enlaces,
estos enlaces lo llevarn a las diferentes pginas de los servicios de ENTEL
Datacenter. (Fig.5)
Fig.5 Men superior de enlaces a ENTEL Datacenter:
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 9
Editor Web Online ENTEL Data Center
4 Utilizacin de las opciones generales de la pgina principal
(browser.php)
Pgina principal del sitio de su Editor Web Online
a) Cmo Editar una pgina Web del sitio
Para editar o modificar una de las pginas Web que existen en su Editor
Web Online slo haga click sobre el nombre de la pgina que desea cambiar. Se
abrir una nueva pgina en la que aparecer su pgina en el Editor Web Online
lista para ser modificada (Ver Fig.7).
b) Cmo Crear una carpeta desde la pgina principal
Para crear una carpeta utilizando la opcin que aparece en la pgina de
Ir a mi sitio o pgina de archivos, slo debe hacer click sobre el cono que dice
Crear carpeta. Se abrir una nueva ventana en la que debe colocar el nombre de
su nueva carpeta. Luego podr acceder a ella haciendo click sobre el nombre en la
lista de archivos. (Fig.5 y 6)
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 10
Editor Web Online ENTEL Data Center
Fig. 5 Opcin de Crear una nueva carpeta desde la pgina principal
(opcin resaltada en rojo)
Fig. 6 Formulario para crear una nueva carpeta
c) Cmo Eliminar una carpeta o archivo desde la pgina principal
Para Borrar o Eliminar una carpeta ya existente, utilizando la opcin que
parece en la pgina de Ir a mi sitio o pgina de archivos, slo debe marcar el
recuadro correspondiente al nombre de la carpeta que desea eliminar y luego
hacer click sobre el cono que dice Eliminar Carpeta. (Fig.7)
Fig.7 Opcin de Eliminar una carpeta desde la pgina principal
(opcin resaltada en rojo)
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 11
Editor Web Online ENTEL Data Center
d) Cmo Renombrar una carpeta o archivo desde la pgina principal
Para Renombrar o cambiar de nombre una carpeta o archivo ya
existente utilizando la opcin que aparece en la pgina de Ir a mi sitio, usted debe
hacer click sobre el cono que dice Renombrar Archivo/Carpeta.
A continuacin se abrir una nueva ventana con la lista de elementos
disponibles en su sitio. Slo debe seleccionar el que desea renombrar (marcando el
recuadro frente al nombre). Por ltimo aparecer un mensaje de confirmacin en
la pantalla anunciando que a la carpeta se le cambi el nombre.(Fig.9)
Fig.9 Opcin de Renombrar una carpeta desde la pgina de Ir a mi sitio
(opcin resaltada en rojo)
e) Cmo subir un archivo al sitio Web
Para subir un archivo, ya sea una pgina, fotografa, grfico, animacin,
etc., Usted debe hacer click sobre el cono de que dice Subir Archivos.
Se abrir una ventana en la usted podr buscar el archivo en su
computadora, slo haga click en Browse. Cuando encuentre el archivo que desea
subir haga click en Subir Archivo. Una vez cargado el archivo usted puede
acceder a el a travs de la lista de archivos de su sitio Web (Ir a mi sitio).
Recuerde que el archivo subir a la carpeta del servidor donde Usted est
trabajando. (Fig.10 y 11)
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 12
Editor Web Online ENTEL Data Center
Fig.10 Opcin de Subir archivos desde la pgina de Ir a mi sitio
(opcin resaltada en rojo)
Fig.11 Formulario para subir archivos a su sitio web:
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 13
Editor Web Online ENTEL Data Center
5 Utilizacin del Editor Web Online:
a) Caractersticas y uso de los elementos del Editor Web Online
El Editor Web Online es un completo sistema para crear y mantener un
sitio Web actualizado en Internet. El programa de Edicin en s mismo funciona de
forma similar a otros Editor de Pginas Web y en su configuracin, opciones y
modo de presentacin de los iconos o botones es muy similar al programa Word
de Office. (Fig. A, Fig. B)
Fig.A Vista del Editor Web Online, parte superior
Instrucciones y men de opciones
Fig.B Vista del editor Web Online, parte media
Men de opciones y seccin de edicin de pginas web.
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 14
Editor Web Online ENTEL Data Center
b) Opciones de edicin
El EDITOR funciona en forma muy similar al programa Word de Office y
tiene dos opciones de edicin: MODO VISUAL (WYSIWYG) y el MODO TEXTO, que
es la opcin recomendada para quienes sepan HTML.
c) Modo Visual o WYSIWYG
Es el modo de edicin que se presenta por defecto al Editar cualquiera
de las pginas Web que se encuentran en su sitio. Es el modo de edicin
recomendado para quienes no dominen el lenguaje HTML o a quienes les gusta
observar directamente como va quedando la pgina Web. Las Figuras A, B y C
muestran el Editor en su modo Visual o WYSIWYG. Cabe destacar que la mayora
de los programas de edicin de pginas Web profesionales, tales como
Dreamweaver, FrontPage y Golive, traen la opcin de edicin Visual por ser ms
cmoda para el usuario.
d) Modo Texto
Es el modo de edicin recomendado para quienes dominan el lenguaje
HTML o a quienes les gusta modificar las pginas Web directamente desde el
cdigo. (Fig. D)
Para ir a este modo de Edicin debe hacer click en el siguiente cono:
Fig. D Modo Texto del Editor Web Online
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 15
Editor Web Online ENTEL Data Center
e) Utilizacin de los templates (Plantillas) que vienen incluidas con el
Editor
El Editor Web Online incluye seis modelos de pginas Web o Plantillas
que Usted puede usar como base para el diseo de sus propias pginas Web. Las
Plantilla o templates vienen listas para insertarles texto e imgenes y son
completamente personalizables, es decir le puede cambiar el tamao, los colores,
la distribucin de los elementos, etc. Para usar las Plantillas Usted debe abrir una
de sus pginas o crear una nueva pgina Web.
Luego seleccione el siguiente cono:
Al hacer click en el cono se abrir una ventana con los seis modelos de
Web disponibles (Fig.13), slo marque el que desea y presione OK.
Fig.13 Ventana con los modelos o Plantillas web disponibles
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 16
Editor Web Online ENTEL Data Center
f) Modificacin de las propiedades del documento
Toda pgina Web posee una serie de propiedades que determinan que
tipo de pgina es y como se presenta visualmente en los navegadores (Por
ejemplo en Internet Explorer). Cada una de las Plantillas Web o pginas creadas
con el Editor Web tiene propiedades que estn establecidas por defecto.
Si desea cambiarlas o modificarlas debe seleccionar el siguiente cono:
Al hacer click en el cono se abrir una ventana con una serie de
opciones (Fig.14)
Fig.14 Ventana de Propiedades del Documento
Ttulo del documento
En este recuadro debe escribir el ttulo que Usted desea aparezca en
su Web. Utilice siempre ttulos cortos y claros que especifiquen que hay en la
pgina. Por ejemplo si su pgina es sobre los productos de su empresa llamada
Librera Diana, el ttulo puede ser algo como: Librera Diana - productos y
artculos en venta.
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 17
Editor Web Online ENTEL Data Center
Doctype
Esta opcin determina que clase de pgina Web es y es utilizada
esencialmente por los buscadores y browsers o navegadores. No es necesario
cambiar la informacin que viene por defecto. No borre esta opcin.
Plantilla CSS principal
Las Plantillas o modelos Web del Editor Web Online vienen con hojas
de estilos especficas que Usted puede modificar o cambiar. Las hojas de estilo
son documentos en los que se determinan las caractersticas visuales de su
pgina Web, es decir el diseo. En el caso de la Plantillas se utilizan
principalmente para determinar el tamao y color de los diferentes tipos de
texto.
El enlace a su hoja de estilos debe ser agregado de la siguiente
forma:
http://susitio.co.cl/nombre_hoja_de_estilos.css
Obviamente, los datos deben ser cambiados de acuerdo a los
nombres de sus archivos.
Plantilla CSS alternativa
Opcin para insertar otra hoja de estilos, por ejemplo la que se
utilizar para imprimir el documento. Esta opcin es optativa y no es necesario
que la utilice.
Meta Descripcin
Las Metatags son etiquetas que ayudan a los buscadores a saber
de que se trata su pgina Web. En Meta Descripcin debe escribir una breve
descripcin acerca de su sitio, as, cuando los buscadores (como Google, por
ejemplo) indexen su pgina ser ms fcil encontrarla.
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 18
Editor Web Online ENTEL Data Center
Meta Keywords
Estn son las palabras claves que describen el tema o contenidos de
su pgina Web. Debe agregar tantas palabras como desee, separadas por
comas (,). Por ejemplo, si su sitio es de una empresa de construccin las
palabras apropiadas seran: construccin, Chile, casas, construcciones,
constructores.
Meta Autor
Esta Metatags es optativa y sirve para sealar quien cre una
determinada pgina Web.
g) Ayuda para el uso del Editor Web Online: Adems del presente
Manual
Usted cuenta con una ayuda online que explica en forma rpida los usos
de las diferentes opciones o iconos del Editor Web Online. Para ir a la pgina de
Ayuda, debe hacer click en el siguiente cono:
h) Opciones de tablas
Cmo insertar
Para insertar una nueva tabla a su pgina Web usted debe hacer
click en el siguiente cono:
Se abrir una nueva ventana en la que Usted deber determinar las
caractersticas de su nueva tabla. Cuando all configurado todo, haga click en
OK. (Fig.15, 16 y 17)
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 19
Editor Web Online ENTEL Data Center
Fig. 15 Ventana Insertar Tabla
Filas: Es aqu donde Usted debe poner el nmero de filas horizontales o rows
que utilizar en su tabla. Slo escriba el nmero en el recuadro.
Columnas: Es aqu donde Usted debe poner el nmero de columnas o filas
verticales que utilizar en su tabla. Slo escriba el nmero en el recuadro.
Fig. 16 Ventana Insertar Tabla
Ancho de la tabla
Ancho: Se refiere al ancho o espacio que la tabla ocupar en su pgina Web.
El ancho puede ser fijo o variable; es fijo cuando Usted opta por darle una
medida en Pixeles (opcin disponible en el men desplegable (Fig.16). La
medida de la tabla es variable cuando utiliza la opcin Porcentaje (de 1 a
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 20
Editor Web Online ENTEL Data Center
100%) y cuando utiliza la medida Em. Las ms utilizadas son Pixeles y
Porcentaje. Si desea que su nueva tabla se adapte a todas las medidas de
pantalla, entonces utilice 100%.
Fig.17 Ventana Insertar Tabla
Alineacin de la tabla Ancho del borde Opciones de Spacing
Alineacin: Se refiere a la posicin que tomarn dentro de la tabla los
diferentes elementos que ubicar en ella (textos, fotos, etc.). Si elige ninguna
se usar la opcin por defecto. Si utiliza Izquierda, los elementos se alinearn a
la Izquierda, lo mismo pasa si elige Derecha. Si utiliza Al tope del texto, todos
los elementos se ubicarn a la altura de sus textos. Al Centro, todo quedar
centrado, si usa Lnea o fila base los elementos grficos se ubicarn
aproximadamente a la mitad de las lneas de texto. Si elige Abajo, todo
quedar al final de la tabla, si usa Al medio, todo quedar a la mitad de su
tabla (opcin muy usada en imgenes) y por ltimo, si utiliza arriba, los textos
y elementos grficos quedarn al principio de la tabla, en el borde superior.
Ancho del borde: todas las tablas poseen un borde que puede ser visible o
invisible. Si no desea que el borde de su tabla se note, escriba 0 en el recuadro
Ancho del Borde.
Spacing (Espaciado de la celda): Esta opcin determina la separacin entre
los bordes de las celdas.
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 21
Editor Web Online ENTEL Data Center
Padding de la celda: Esta opcin determina la separacin entre las celdas y
se usa para separar los elementos que se ubican en las celdas. Si usted no
quiere separaciones entre celdas, escriba 0 en ambas opciones.
i) Propiedades de la tabla
Esta opcin le permite a Usted ver o modificar las propiedades de cada
tabla que exista en la pgina que esta editando (Fig.18). Para ver la Propiedades o
modificarlas haga click en el siguiente cono:
Fig.18 Ventana Propiedades de la Tabla
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 22
Editor Web Online ENTEL Data Center
Descripcin
Las opciones que aparecen no necesitan ser modificadas, pueden
quedar como se presentan.
Layout
Las opciones que parecen en esta seccin de la ventana de Insertar
Tabla se refieren a la ubicacin y posicin de los textos dentro de la tabla. (Fig.
a, b, c, d)
Fig. a Seccin Layout de la ventana de Propiedades de la Tabla
Flotar
Flotar: Esta opcin determina donde se posicionar la nueva tabla. Si no
desea que la tabla flote en una posicin determinada elija la opcin No.
Usted tiene tres opciones No hacerla flotar, o posicionarla a la Izquierda o
a la Derecha.
Fig.b Seccin Layout de la ventana de Propiedades de la Tabla
Ancho y Alto
Ancho y Alto: Estas opciones son muy similares a las vistas en Insertar
una nueva tabla. Usted puede modificar el Alto y el Ancho de su tabla y
cambiarle los atributos para que sea de tamao fijo (pxeles) o de tamao
variable (porcentaje).
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 23
Editor Web Online ENTEL Data Center
Fig.c Seccin Layout de la ventana de Propiedades de la Tabla
Alineacin del texto
Alineacin de texto: Esta opcin de la seccin Layout determina que
posicin presentarn los textos que se escriban en la tabla. Las opciones
son: Centrar (texto centrado), Derecha (todo el texto siguiendo el eje
derecho), Izquierda (todo el texto siguiendo el eje izquierdo), o texto
Justificado.
Fig. c Seccin Layout de la ventana de Propiedades de la Tabla
Alineacin vertical
Alineacin vertical: Esta opcin de la seccin Layout determina que
alineacin presentarn los elementos grficos que se incluyan en la tabla.
Las opciones son: Centrar (elementos centrados), Alto (todos los elementos
ubicados en relacin a la parte superior de la tabla), Abajo (todos los
elementos ubicados en relacin al tope inferior de la tabla), Alineacin
(todos los elementos ubicados en relacin a las alturas de los textos).
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 24
Editor Web Online ENTEL Data Center
Espaciado y Padding
Estas opciones tienen que ver la separacin entre celdas, ya sea en
sus bordes (Espaciado) o entre celdas (Padding).
Frames y borders
Las opciones de esta seccin de las Propiedades de la tabla tiene que
ver con los bordes interiores y exteriores de la tabla (Fig. e y f)
Fig. e Seccin Frame and Borders de la ventana de Propiedades de la Tabla
Bordes y Frames
Bordes: En este recuadro usted deber determinar el grosor del borde de
su nueva tabla. Un borde decorativo siempre queda bien en las tablas del
men de enlaces, por ejemplo.
Frames: Esta opcin determina en lugar se ubicarn los bordes visibles de
la tabla. Las Opciones son: A los cuatro lados, es decir en toda la tabla; slo
en la parte de arriba, es decir los otros tres costados quedan sin borde; slo
la parte inferior, igual que lo anterior slo que en el costado inferior; slo la
parte de arriba y abajo, es decir costados superior e inferior; slo la parte
Izquierda o costado izquierdo y el resto sin bordes. Slo la parte derecha o
costado derecho y el resto sin bordes.
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 25
Editor Web Online ENTEL Data Center
Fig. f Seccin Frame and Borders de la ventana de Propiedades de la Tabla
Reglas
Reglas: Esta opcin determina si los bordes entre celdas sern visibles o
invisibles. Las Opciones son: Sin reglas, es decir los bordes no son visibles
entre las celdas; Regla entre columnas, es decir los bordes slo sern
visibles en las separaciones entre columnas; Regla entre filas, es decir los
bordes slo sern visibles en las separaciones entre filas o celdas
horizontales; Reglas entre filas y columnas, todos los bordes sern visibles.
Estilos (CSS)
En esta seccin de las Propiedades de la tabla Usted podr
determinar los colores de los elementos de la nueva tabla. (Fig. g)
Fig. g Seccin Estilos (CSS) de la ventana de Propiedades de la Tabla
Color de fondo: Esta opcin determina el color de fondo que tendr la
tabla. Tambin puede poner una imagen de fondo, para ello ingrese la URL
o direccin de su imagen en el recuadro. Para cambiar el color de fondo
haga click sobre el rectngulo frente a Color de Fondo. Al hacer click se
abrir una ventana donde podr elegir el color.
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 26
Editor Web Online ENTEL Data Center
Color Principal: Esta opcin determina el color de texto que tendr la
tabla. Para cambiar el color de texto haga click sobre el rectngulo frente a
Color Principal. Al hacer click se abrir una ventana donde podr elegir el
color. Recuerde que el color por defecto es negro por lo que si pone un
fondo oscuro debe cambiar el color de texto para que sea legible.
Borde: Esta opcin determina el color de texto que tendrn los bordes de
la tabla. Para cambiar el color haga click sobre el rectngulo frente a Color
Principal. Al hacer click se abrir una ventana donde podr elegir el color.
En el men desplegable que aparece junto al recuadro de color Usted podr
elegir el tipo de borde que quiere que tenga su tabla (Fig. h) y en el
recuadro junto al men despegable deber insertar el grosor (en pixeles)
que quiere que tenga su borde.
Fig. h Seccin Estilos (CSS) de la ventana de Propiedades de la Tabla
Tipos de bordes
Los tipos de bordes disponibles son: none o ninguno, dotted o punteado,
dashed o lnea o fila cortada, solid o sea una lnea o fila normal, double o
sea doble y gruesa, groove que simula estar hundida, ridge o borde con
relieve a los cuatro costados, inset o que simula que la tabla esta hundida
(como un botn) y outset que simula que la tabla esta en relieve.
Modificar una tabla o seleccionar nuevas opciones para una tabla no es
complicado, slo hay que tener algo de paciencia y dejar volar la
creatividad.
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 27
Editor Web Online ENTEL Data Center
j) Opciones de filas
Cmo crear una nueva lnea o fila de celdas en una tabla
Para insertar una lnea o fila de celdas en una tabla ya existente,
Usted debe ubicarse en el lugar de la tabla donde desea crear una nueva lnea.
Luego debe hacer click en el siguiente cono:
Al hacer click en el cono Insertar fila o lnea o fila de celdas, se
abrir una nueva ventana en la que Usted deber determinar las caractersticas
de su nueva lnea o fila de celdas. (Fig.19).
Fig. 19 Ventana de propiedades de una lnea o fila de celdas
Las opciones que aparecen divididas en Layout y Estilos (CSS) son
muy similares a las que aparecen en Propiedades de la tabla.
Layout: Se refiere a la ubicacin y posicin de los textos dentro de la tabla.
Estilos (CSS): Se refiere a todo lo que tienen que ver con los colores y
presentacin general de las celdas.
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 28
Editor Web Online ENTEL Data Center
Para ms informacin ver mismas opciones en Propiedades de la
Tabla.
Cmo insertar una lnea o fila de celdas sobre una lnea o fila ya
existente
Para insertar una lnea o fila de celdas sobre una lnea o fila ya
existente, primero Usted debe ubicarse en una celda de la lnea o fila sobre la
cual desea crear una nueva.
Luego debe utilizar el siguiente cono:
Cmo insertar una lnea o fila de celdas bajo una lnea o fila ya
existente
Para insertar una lnea o fila de celdas bajo una lnea o fila ya
existente, primero Usted debe ubicarse en una celda de la lnea o fila bajo la
cual desea crear una nueva.
Luego debe utilizar el siguiente cono:
Cmo Borrar una lnea o fila de celdas
Para borrar una lnea o fila de celdas ya existente, primero Usted
debe ubicarse en una celda de la lnea o fila que desea borrar.
Luego debe utilizar el siguiente cono:
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 29
Editor Web Online ENTEL Data Center
Cmo dividir una fila en una tabla
Para dividir una lnea o fila o fila de celdas ya existente, primero
Usted debe ubicarse en una celda de la lnea o fila que desea dividir.
Luego debe utilizar el siguiente cono:
k) Opciones de columnas
Cmo insertar una columna antes de una ya existente
Para insertar una columna antes de una ya existente, primero Usted
debe ubicarse en una celda antes de la columna que desea insertar.
Luego debe utilizar el siguiente cono:
Cmo insertar columna despus de una que ya existente
Para insertar una columna despus de una ya existente, primero
Usted debe ubicarse en una celda despus de la columna que desea insertar.
Luego debe utilizar el siguiente cono:
Cmo Borrar una columna
Para borrar una columna ya existente, primero Usted debe ubicarse
en una celda de la columna que desea borrar.
Luego debe utilizar el siguiente cono:
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 30
Editor Web Online ENTEL Data Center
Cmo dividir columnas
Para dividir una columna ya existente, primero Usted debe ubicarse
en una celda de la columna que desea dividir.
Luego debe utilizar el siguiente cono:
l) Opciones de celdas individuales
Propiedades una celda
Para insertar una celda en una tabla, primero Usted debe ubicarse en
una celda de la tabla en la que desea crear una nueva celda
Luego debe utilizar el siguiente cono:
Al hacer click en el cono Insertar celda, se abrir una nueva ventana
en la que Usted deber determinar las caractersticas de su nueva celda.
(Fig.20).
Fig. 20 Ventana de propiedades de la celda:
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 31
Editor Web Online ENTEL Data Center
Las opciones que aparecen divididas en Layout y Estilos (CSS) son
muy similares a las que aparecen en Propiedades de la tabla.
Layout: se refiere a la ubicacin y posicin de los textos dentro de la tabla.
Estilos (CSS): se refiere a todo lo que tienen que ver con los colores y
presentacin general de las celdas.
Para ms informacin ver mismas opciones en Propiedades de la
Tabla.
Cmo insertar una celda antes de una ya existente
Para insertar una celda antes de una ya existente, primero Usted
debe ubicarse en una celda antes de la que desea insertar.
Luego debe utilizar el siguiente cono:
Cmo insertar celda despus de una ya existe
Para insertar una celda despus de una ya existente, primero Usted
debe ubicarse en una celda despus de la que desea insertar.
Luego debe utilizar el siguiente cono:
Cmo Borrar una celda
Para Borrar una celda, primero Usted debe ubicarse en la celda que
desea borrar.
Luego debe utilizar el siguiente cono:
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 32
Editor Web Online ENTEL Data Center
Cmo agrupar celdas
Para agrupar un grupo de celdas, es decir unirlas, primero Usted
debe ubicarse en una celda de las que desea agrupar.
Luego debe utilizar el siguiente cono:
Cmo dividir celdas
Para dividir una celda o celdas ya existentes, primero Usted debe
ubicarse en la celda que desea dividir.
Luego debe utilizar el siguiente cono:
m) Opcin de borrado rpido de tablas y objetos
En el Modo Texto del Editor Web Online existe la opcin de borrar las
tablas y elementos como fotos y grficos directamente desde la seccin donde
edita sus pginas Web. Slo utilcela si realmente quiere eliminar la tabla o el
objeto ya que si quiere volver a agregarlo deber realizar todo el proceso y
empezar otra vez. Recuerde que al eliminar una tabla esta no debe ser una tabla
base del diseo ya que si elimina una tabla base el diseo se desconfigurar.
Para eliminar una tabla u objeto slo haga click sobre l y presione el
punto rojo con una x que aparece. (Fig. 21)
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 33
Editor Web Online ENTEL Data Center
Fig. 21 Cmo eliminar una tabla u objeto
desde la pgina que se est editando
n) Opciones de texto
Tipo de letra de la pgina Web
Los tipos de letra o fuente usados en las pginas Web son
estndares. Existen varios tipos letras que son visibles en todos los
navegadores y vienen instaladas por defecto al instalar un sistema operativo,
Windows por ejemplo.
Usted podra utilizar letras de fantasa en los textos de su Web, pero
es muy probable que los visitantes no la vean ya que no la tienen instalada en
su PC, por ello es recomendable slo utilizar fuentes estndares.
Para cambiar el tipo de la letra de un determinado texto, seleccione
el texto y elija un tipo de letra en men desplegable sealado a continuacin:
Los tipos de letras disponibles son: Arial, Courier, Georgia, Tahoma,
Times New Roman, Verdana, Impact y WingDings, que es un tipo de fuente en
el que salen diferentes dibujos o iconos en lugar de cada letra.
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 34
Editor Web Online ENTEL Data Center
Tamao de la letra de la pgina Web
Al igual que los tipos de letra o fuente, los tamaos de letra usados
en las pginas Web son estndares. Existen varios formatos de tamao; el
usado en el Editor Web Online corresponde a los puntos (pts), un formato de
tamao muy usado y adecuado para todos los navegadores y sistemas
operativos.
Para cambiar el tamao de la letra de un determinado texto,
seleccione el texto y elija un tamao de letra en men desplegable sealado a
continuacin:
Los tamaos van en orden creciente, es decir 1 (8pts) es un tamao
ms pequeo que el tamao 2 (10pts), por ejemplo.
Alineacin de los textos
Al igual que en los editores de texto como el programa Word, los
textos en una pgina Web pueden ser presentados con distintas alineaciones:
alineado a la izquierda, a la derecha, centrado o justificado.
Para cambiar la alineacin de un determinado texto, seleccione el
texto y elija una opcin de las sealadas a continuacin:
Opciones de presentacin de los textos (negritas, cursivas, texto
subrayado, texto tachado)
Corresponden a los diferentes modos de presentar el texto en su
Web o estilos de texto. Remarcado o en negritas (B), en itlica o cursivas (I),
texto subrayado (U), o texto tachado (S). Todos pueden ser usados para dar
nfasis o destacar algn texto o prrafo en su pgina Web. Estas opciones son
muy similares a las que se usan en el programa Word de Office.
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 35
Editor Web Online ENTEL Data Center
Para cambiar las caractersticas de un determinado texto, lnea o fila
de texto, palabra o prrafo, seleccione el texto y elija una opcin en el men
sealado a continuacin:
Uso de los formatos de texto
: Los formatos de texto son una serie de opciones preestablecidas
por el cdigo HTML para sealar los niveles de tamao de ttulos o headings.
Son 6 tamaos que van desde <h1> que es el tamao ms grande y
por lo tanto seala un texto ms importante hasta <h6> que se usa para
destacar un subttulo, por ejemplo.
Para cambiar las caractersticas de un determinado ttulo, subttulo o
palabra, seleccione el texto y elija una opcin en el men desplegable sealado
a continuacin:
Las opciones son: Heading1 (la opcin ms grande), Heading 2,
Heading 3, Heading 4, Heading 5, Heading 6 (la opcin ms pequea), Normal
(texto de amao normal), Address (texto cursivo y pequeo, ideal para
direcciones o telfonos) y Formatted.
Recuerde que los tamaos van en orden decreciente, desde 1 hasta
6 que es la opcin ms pequea. A estos Headings o formatos se les pueden
cambiar las caractersticas utilizando las hojas de estilo CSS.
Subndices y superndices
Estas dos opciones se utilizan para crear Subndices (x 2 abajo) y
Superndices (x 2 arriba). Los Subndices son similares a los subttulos y pueden
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 36
Editor Web Online ENTEL Data Center
ser usados para ello. Los Superndices son textos que se ubican
inmediatamente arriba y al costado de un texto especfico y pueden ser usados
como introduccin a un Ttulo, por ejemplo.
Para insertar Subndices o Superndices a un determinado ttulo,
subttulo o palabra, seleccione el texto y elija una opcin en el men sealado
a continuacin:
El nmero 2 seala si se trata de un Subndice (abajo) o un
Superndice (arriba)
Edicin general de textos y/o elementos de la pgina Web
Corresponde a un grupo de iconos con las opciones de edicin de los
elementos de su Web (textos, imgenes, grficos), muy similar a las opciones
de Word y de otros editores de texto.
Las opciones disponibles son Copiar, Cortar y Pegar.
Para copiar, cortar o pegar algn elemento en su Web, seleccione el
texto o imagen y elija una opcin en el men sealado a continuacin:
Cmo posicionar un texto especfico
Usted podr cambiar la posicin (a la izquierda o a la derecha) de un
texto especifico, mediante las opciones sealadas en el siguiente cono:
Tipos de listas disponibles
Las listas son una opcin muy til para dar las caractersticas de un
producto, por ejemplo. Existen varios tipos de listas, el Editor Web Online
tienen dos opciones de listas diferentes: numeradas, o sea las opciones de la
lista se numeran en forma creciente (1, 2, 3, etc.) o con bullets o marcadores,
es decir listas que anteponen un smbolo antes de cada opcin de la lista.
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 37
Editor Web Online ENTEL Data Center
Ejemplo lista numerada:
1. Esta es una opcin
2. Esta es otra
Ejemplo de lista con bullets:
Esta es una opcin
Esta es otra
Para insertar una lista, escriba una primera lnea o fila de texto en
ella y luego elija una opcin de las sealadas a continuacin:
Color del texto
Al igual que puede cambiar el tamao y tipo de letra de sus textos,
Usted puede cambiar el color de los mismos, ya sea de una lnea o fila de texto,
de un ttulo o de un prrafo completo.
Para cambiar el color de un texto especfico, seleccione el texto que
desea cambiar, y luego haga click en el siguiente cono:
Se abrir una ventana en la que deber seleccionar el color que
quiere poner a su texto (Fig.22)
Fig.22 Ventana emergente con las opciones de color
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 38
Editor Web Online ENTEL Data Center
o) Opciones de color de los elementos de la pgina
Color de fondo de la pgina
Mediante esta opcin Usted puede cambiar el fondo de la pgina que
est editando Para cambiar el color del fondo de su pgina Web seleccione el
siguiente cono:
Color de fondo de las tablas y/o celdas y columnas (Color de fondo
de texto)
Esta opcin es similar a la sealada ms arriba, slo que se refiere al
color de las tablas o celdas de su pgina Web en las que usted escribe su texto
y agrega sus imgenes y grficos. Usted puede realizar todo un diseo
profesional usando solo tablas, celdas y otorgndoles diferentes colores para
lograr un todo armonioso.
Para cambiar el color de una tabla o celda, seleccione la tabla o
celda, o lnea o fila de celdas o columnas que desea cambiar de color, y luego
haga click en el siguiente cono:
Se abrir una ventana en la que deber seleccionar el color que
quiere poner a celda o tabla (Ver Fig.22)
p) Insertar enlaces, imgenes, y separadores
Cmo insertar/modificar enlaces
Los enlaces internos o sea a pginas dentro de su sitio Web o
externos, es decir a otras pginas en Internet son la base de un sitio Web
organizado e interesante.
Para insertar o modificar un enlace en su pgina Web, primero
escriba una palabra, que ser la que al hacer click har funcionar el enlace o
inserte un botn o grfico.
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 39
Editor Web Online ENTEL Data Center
Luego seleccinelo y haga click en el siguiente cono:
Se abrir una ventana en la que deber escribir todos los datos de su
enlace, o sea la URL o direccin completa, el ttulo o texto que saldr al poner
el mouse sobre el enlace y el Destino, o sea como abrir el enlace. Las dos
ltimas opciones puede dejarlas como se presentan. Si su enlace es a una de
las pginas Web que ya existen en su sitio, slo debe seleccionar la carpeta
donde se encuentra el enlace o el archivo.html que desea enlazar (Fig. 23 y
24).
Fig. 23 Ventana para Insertar/Modificar enlace
Fig. 24 Seleccin de Destino
(Detalle de la opcin Destino en imagen agrandada)
La pgina que Usted enlazar puede abrir en: la misma pgina
(opciones none o Mismo marco, en el caso de usar marcos), en una Nueva
ventana (_blank), en el Marco superior (_top, en el caso de usar marcos) o en
Otro si se quiere sealar un marco o frame especfico.
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 40
Editor Web Online ENTEL Data Center
Cmo insertar imgenes a la pgina Web
Otro elemento primordial de su sitio Web son las imgenes, no slo
las fotografas sino que todos los elementos de tipo grfico (botones, barras,
iconos, banners, etc.).
Todos ellos deben ser incluidos en sus pginas Web utilizando el
siguiente cono:
Al hacer click en este cono se abrir una nueva ventana en la que
deber escribir toda la informacin acerca de su imagen, o seleccionar una
imagen de las guardadas en las carpetas en su sitio Web. Usted puede agregar
imgenes directamente de una URL, subir una imagen o seleccionar una
imagen de las que estn almacenadas en su espacio Web, en alguna de sus
carpetas. (Fig. 25, 26 y 27)
Fig. 25 Ventana Insertar Imagen
EDITOR WEB ONLINE DE ENTEL DATACENTER
Manual de Usuario
Versin 1.4 Pg. 41
Editor Web Online ENTEL Data Center
Subir Imagen: Al hacer click en Browse, se abrir una nueva ventana en
la que Usted podr seleccionar una imagen o grfico de los que tiene
guardados en su PC.
URL: Recuerde que para cargar una imagen e insertarla en su Web desde
una direccin o url, la direccin de la imagen debe estar completa, o sea
presentadas de esta forma o algo similar:
http://www.direccionweb.com/imagenes/mibanner.jpg.
Descripcin: Se refiere al texto que aparecer cuando el visitante de su
Web se pose sobre un determinado grfico, botn o imagen.
A la izquierda de la ventana de Insertar Imagen, Usted encontrar una lista
con las carpetas y los archivos de imagen (fotos y grficos) que existen en
su sitio Web. Usted puede agregarlas a su Web directamente haciendo click
sobre la carpeta que contiene la imagen para luego seleccionar el archivo
dentro de esa carpeta o sobre la imagen en si misma que parece en la lista.

You might also like