Personalización de la Plantilla

Paso 1 - Ajustes generales >

Personalización de la Plantilla

Previous pageReturn to chapter overviewNext page
Mostrar/ocultar el texto oculto

Tras haber elegido trabajar sobre una Plantilla Predefinida, una Plantilla Personal o una Nueva Plantilla por medio de la ventana Librería Personal y haber definido la Estilo de la Plantilla, gracias a las funciones que ofrece esta ventana es posible personalizar todavía más la Plantilla misma trabajando tanto el Encabezado como el Pie de Página, añadiendo Textos, Imágenes, Animaciones Flash, Presentaciones, Código HTML, Campos de Búsqueda y Enlaces.

Ya sea trabajando sobre la imagen del Encabezamiento que sobre la del Pie de página, los comandos y opciones disponibles son los mismos.

Si en las secciones Encabezamiento o Pie de página se establece como fondo una animación Flash, la ventana Personalización de la Plantilla no dará la posibilidad de personalizarla.

Pulsar para expandir/reducirReferencia: Cómo se presenta el editor de plantilla

La ventana Personalización de la Plantilla presenta un editor gráfico en el que, inmediatamente bajo la barra de herramientas, se presenta la imagen utilizada como fondo del encabezado o del pie de página del modelo elegido (ya sea predefinido o personale): la imagen se muestra a escala 1:1 y, si fuese necesario, se puede deslizar con la barra de desplazamiento horizontal incluida. Sobre esta imagen se muestran, en tiempo real, todas las modificaciones introducidas con los comandos disponibles.

Inmediatamente debajo de la imagen cargada hay una barra de estado en la que se indica:

Posición muestra las coordenadas X e Y que identifican la posición del ángulo superior derecho del Objeto seleccionado, respecto al área ocupada por el Encabezado o el Pie de Página.
Tamaño muestra el valor expresado en píxeles de la anchura y de la altura del objeto seleccionado.

Si al definir la Importación de Plantilla se ha configurado como Tipo de menú la opción Horizontal - Menú dentro del encabezado, en la imagen del Encabezamiento se mostrará un área gris rayada que corresponde a lo que ocupa el Menú. La presencia de este área no impide que se incluyan otros Objetos, pero es preciso tenerla en cuenta para evitar superposiciones no deseadas.

Pulsar para expandir/reducirReferencia: Los comandos de la Barra de Herramientas

Los comandos de la Barra de Herramientas permiten añadir nuevos objetos al Encabezamiento / Pie de página de la plantilla y configurar algunos de sus ajustes. Una vez añadido un objeto mediante el comando correspondiente, es posible entonces seleccionarlo y modificarlo a través de las opciones presentes en el recuadro que toma el nombre del objeto mismo.

Cortar [CTRL+X] - Copiar [CTRL+C] - Pegar [CTRL+V]

Respectivamente, cortan, copian o pegan el objeto seleccionado.

Cancelar [CTRL+Z]

Anula la última acción realizada.

Traer al primer plano - Llevar al segundo plano

Llevan el objeto seleccionado al primer plano o al segundo, es decir delante o detrás de todos los demás Objetos eventualmente superpuestos.

Asociar un enlace

Añade un enlace al texto, a la imagen o imágenes de la presentación seleccionadas. Es posible configurar los ajustes del enlace mediante la ventana que se abre, Enlace.

Posición y tamaño

Permite definir, mediante la ventana que se abre, las coordenadas que determinan la posición y el tamaño del Objeto seleccionado. La opción Mantener las proporciones, activa por defecto, hace que en las operaciones de cambio de tamaño se mantengan las proporciones originales del Objeto.

Insertar texto - Insertar imagen - Insertar una animación Flash - Insertar 'Presentación' - Insertar código HTML - Insertar campo de búsqueda

Permiten, respectivamente, insertar un Texto, una Imagen, una Animación Flash, una Presentación, código HTML o un Campo de búsqueda.

La presentación está conformada por una secuencia de imágenes que discurren automáticamente una tras otra. Puede ser útil para crear banners con fines publicitarios.

Mediante la introducción de código HTML es posible añadir cualquier tipo de contenido: de esta manera se puede ir mucho más allá de las posibilidades que ofrecen las herramientas.

Finalmente, el campo de búsqueda se sirve del motor interno para permitir al visitante realizar búsquedas en los contenidos del sitio web.

Las Animaciones Flash y los Objetos Código HTML introducidos se muestran solo cuando el sitio es abierto en el explorador.

Pulsar para expandir/reducirReferencia: Los comandos del recuadro Encabezamiento / Pie de página

Pulsando directamente en la imagen de fondo de las secciones Encabezamiento y Pie de página se selecciona la imagen y se puede operar con las siguientes opciones:

Guardar como imagen JPG: durante la fase de creación del sitio web, los objetos Texto y los objetos Imagen añadidos en el Encabezamiento/Pie de página se fundirán con la imagen de fondo utilizada, que se guardará automáticamente como un nuevo archivo en formato PNG. La elección del formato PNG permite mantener las transparencias que se hubiesen configurado. Si no es necesario tratar con transparencias particulares, es posible activar la opción Guardar como imagen JPG para obtener una imagen de fondo de tamaño inferior.
Pulsar para expandir/reducirReferencia: Los comandos del recuadro Texto

Seleccionando un Objeto Texto insertado en la sección Encabezamiento / Pie de página es posible modificar las siguientes opciones:

Contenido: campo para introducir o pegar el contenido del texto.
Fuente: permite especificar el tipo de fuente, el estilo y el tamaño en puntos del texto.
Color Texto / Color Fondo: define el color del rótulo y del fondo del texto introducido.
Guardar como imagen PNG: si está activada, hace que el texto añadido no se funda con la imagen de fondo del Encabezamiento/Pie de página sino que se guarde como una imagen .PNG con fondo transparente. En este caso, el texto original resulta asociado automáticamente a la imagen .PNG como texto alternativo (ALT text).
Pulsar para expandir/reducirReferencia: Los comandos del recuadro Imagen

Seleccionando un Objeto Imagen insertado en la sección Encabezamiento / Pie de página es posible modificar las siguientes opciones:

Archivo imagen: selecciona el archivo gráfico relativo a la imagen que se quiere insertar. Pueden ser utilizados archivos con formato JPG, GIF, PNG, BMP, PSD, TIF, DIB, PCX, RLE, TGA y WMF.
Archivo de imagen al pasar el ratón: selecciona un segundo archivo gráfico diferente que se mostrará al paso del puntero del ratón sobre la misma imagen. Esta opción es especialmente útil para la creación de botones con efecto pulsado/soltado (efecto mouseover).
Habilitar transparencia: aplica la transparencia a la imagen, haciendo invisible el color especificado.
Transparencia: especifica qué color de la imagen insertada se hará invisible si se activa la opción Habilitar transparencia. En estos casos la herramienta "cuentagotas" resulta muy útil ya que permite capturar el color directamente de la imagen.
Tolerancia: esta opción permite especificar el factor de tolerancia al aplicar la transparencia. Cuanto mayor sea el valor de la tolerancia, mayor será el área de transparencia de la imagen.
Pulsar para expandir/reducirReferencia: Los comandos del recuadro Animación Flash

Seleccionando un Objeto Animación Flash insertado en la sección Encabezamiento / Pie de página es posible modificar las siguientes opciones:

Archivo de animación: selecciona el archivo .SWF relativo a la animación Flash que se quiere insertar.
Fondo transparente: hace invisible el fondo de la animación.
Pulsar para expandir/reducirReferencia: Los comandos del recuadro Presentación

Seleccionando un Objeto Presentación insertado en la sección Encabezamiento / Pie de página es posible modificar las siguientes opciones:

Lista de imágenes para visualizar: muestra la lista de las imágenes que componen la presentación. Para cada imagen introducida, se indica la ruta de acceso del archivo además de, si los hay, del efecto y del enlace asociados. Seleccionando un archivo de la lista se obtiene su visualización en la vista previa. También es posible efectuar una selección múltiple de archivos utilizando los comandos CTRL + clic y SHIFT + clic.
Agregar... / Eliminar: permiten, respectivamente, agregar nuevas imágenes o eliminar las imágenes seleccionadas de la lista de aquellas que componen la presentación. La ventana de selección de archivo que se abre permite también seleccionar varios archivos a la vez.
Subir / Bajar: modifican el orden en el que se muestran las imágenes ya añadidas en la Lista de imágenes para visualizar en la presentación, desplazando hacia arriba o hacia abajo la imagen seleccionada.
Efecto...: abre la ventana Propiedades de los efectos mediante la cual es posible configurar efectos de entrada, movimiento y zoom para las imágenes de la presentación seleccionadas de entre las que hay en la Lista de imágenes para visualizar.
Reproducción automática: hace que la presentación comience automáticamente nada más el explorador de internet ha cargado el sitio web.
Visualizar en orden casual: hace que las imágenes introducidas en la presentación se reproduzcan aleatoriamente y no según el orden en el que fueron añadidas en la Lista de imágenes para visualizar.
Mostrar Indicador de posición: hace que sobre la Presentación se superponga un indicador gráfico que informa al Usuario sobre el número y/o la posición de las imágenes que la conforman.
Estilo de Indicador: disponible en caso de que se haya activado la opción Mostrar Indicador de posición, permite elegir entre diferentes conjuntos gráficos para determinar el aspecto del indicador.
Alineación: disponible en caso de que se haya activado la opción Mostrar Indicador de posición, da la posibilidad de elegir cómo alinear el indicador respecto a las imágenes de la Presentación.
Pulsar para expandir/reducirReferencia: Los comandos del recuadro Código HTML

Seleccionando un Código HTML insertado en la sección Encabezamiento / Pie de página es posible modificar las siguientes opciones:

Código HTML: campo para teclear o pegar el código HTML referido al objeto que se quiere crear. La Barra de Herramientas que se muestra ofrece los siguientes comandos:

Cortar [CTRL+X] - Copiar [CTRL+C] - Pegar [CTRL+V]

Cortan, copian y pegan el texto seleccionado.

Cancelar [CTRL+Z] - Restablecer [ALT+MAIUSC+BACKSPACE]

Anulan y restablecen la última operación realizada/anulada.

Insertar Widgets

Inserta el código referido al Widget seleccionado: pulsando sobre la flecha al lado del botón es posible visualizar la lista de todos los Widgets disponibles.

Visualizar barras de desplazamiento: activa la visualización de las barras de desplazamiento.
Pulsar para expandir/reducirReferencia: Los comandos del recuadro Campo de búsqueda

Seleccionando el Campo de búsqueda insertado en la sección Encabezamiento / Pie de página es posible modificar las siguientes opciones:

Etiqueta del botón: es el texto que se muestra dentro del botón que hace comenzar la búsqueda.
Fuente: permite especificar el tipo de fuente, el estilo y el tamaño en puntos del texto.
Colores del campo: define el color del texto y del fondo del campo.
Colores del botón: define el color del texto y del fondo del botón.

Añadiendo un Campo de búsqueda en la sección Encabezamiento / Pie de página de la plantilla, se muestra automáticamente en el Mapa la página especial "Buscar": es posible seleccionarla y abrir la ventana Propiedades de la página para definir sus propiedades principales.
Los resultados de las búsquedas efectuadas dentro del sitio web son presentados en páginas creadas automáticamente por el programa: el aspecto gráfico de estas páginas se establece según los ajustes de estilo de los textos (ver Estilo de los textos en el Paso 1 - Estilo de la Plantilla).
Pulsar para expandir/reducirReferencia: Los comandos del recuadro Efectos

Seleccionando un Objeto Texto, un Objeto Imagen o un Objeto Presentación insertado en la sección Encabezamiento / Pie de página es posible modificar las siguientes opciones:

Tipo de efecto: permite seleccionar y activar uno o más efectos para aplicar al Objeto seleccionado.

A cada Objeto Texto, Imagen y Presentación pueden aplicarse también varios efectos a la vez, para cada efecto es posible modificar sus ajustes:

Efecto

Ajustes

Sombra

 

 

Difusión: define el factor de difusión de la sombra que se aplica.
Color: define el color de la sombra que se aplica.
Distancia X / Distancia Y: permiten definir de cuánto se debe desplazar horizontalmente y / o verticalmente la sombra respecto al objeto al que se aplica. Introduciendo un valor positivo se consigue un desplazamiento de la sombra, respectivamente, hacia la derecha o hacia abajo; y al contrario, introduciendo un valor negativo se obtiene un desplazamiento de la sombra hacia la izquierda o hacia arriba.

Espejo

 

Difusión: define el factor de difusión, es decir el tamaño del reflejo que se aplica.
Distancia: permite definir a qué distancia debe estar el reflejo respecto al objeto al que se aplica.

Borde a color

 

Grosor: define el valor en píxeles del grosor del borde que se aplica.
Color: define el color del borde a aplicar.

Brillo exterior

 

Difusión: define el factor de difusión del brillo a aplicar.
Color: define el color del brillo a aplicar.

Convexo

 

 

Profundidad: define cómo de acentuada debe ser la curvatura del efecto que se aplica.
Difusión: define el factor de difusión del efecto convexo que se aplica.
Ángulo: define el ángulo de la curvatura que se aplica.

Rotación

Ángulo: esta opción permite definir el valor del ángulo de rotación (en dirección de las agujas del reloj) que se aplica.

Opacidad

Opacidad: permite predisponer un valor de 0 a 255 para definir el grado de opacidad de la imagen. Para valores que tienden a 0 disminuye la opacidad de la imagen que, de este modo, es cada vez más transparente.

Desenfocado

Difusión: define el factor de difusión del desenfoque que se aplica.

Onda

 

Difusión: define la amplitud de la onda.
Frecuencia: permite definir cuánto deben estar cerca las ondas entre sí.

Perspectiva

 

Horizontal: permite predisponer el ángulo de fuga para obtener un efecto de perspectiva hacia la derecha (con valores positivos) o hacia la izquierda (con valores negativos).
Vertical: permite predisponer el ángulo de fuga para obtener un efecto de perspectiva hacia abajo (con valores positivos) o hacia arriba (con valores negativos).

Distorsión

 

Horizontal: permite colocar el punto hacia el cual predisponer la distorsión a lo largo de un plano horizontal, a la derecha (con valores positivos) o a la izquierda (con valores negativos).
Vertical: permite colocar el punto hacia el cual predisponer la distorsión a lo largo de un plano vertical, arriba (con valores positivos) o abajo (con valores negativos)

 

 


Best practice:

-

Cómo trabajar con las plantillas

-

Dónde encontrar nuevas plantillas para WebSite X5


Profundización:

-

Cómo funciona el Motor de Búsqueda interno de WebSite X5