Template Shaker - Conjunto de plantillas web que se pueden personalizar para crear tu página web

Más sobre el programa :: Requerimientos :: Videos :: Actualizaciones

Si estás buscando alguna plantilla para tu sitio web, esta herramienta te puede ser de utilidad.

Template Shaker (Edición Free ) es un editor WYSIWYG , que te permite crear páginas basados en 5 diferentes plantillas web que se pueden personalizar a tu gusto y preferencias.

Luego de seleccionar algunas de las plantillas disponibles, puedes elegir y cambiar los colores, propiedades de las fuentes, insertar imágenes, modificar el diseño de la página y mucho otras opciones

Una vez que hayas terminado de modificar la plantilla a tu gusto, podrás exportar todos los archivos ( imágenes, los css, html etc ..) para utilizarlo en la creación de tu sitio web o portal.

A continuación puedes ver mas detalles y características de esta herramienta de diseño web.

Mas información sobre el programa.

Indice - Contenido.

Seleccionar una plantilla.
Personalizar y editar la plantilla.
Vista previa de la página web.
Exportar los archivos para crear la página web.
Acerca de la licencia.

1 - Seleccionar una plantilla.

Apenas iniciado el programa, se mostrará la pestaña Select templates.

En este apartado se puede escoger una de varias plantillas desde la lista. Algunas de las plantillas no son gratuitas ( las que dicen versión PRO )

A la derecha se mostrará una vista en miniatura de la misma, que podrás visualizar a tamaño real en el navegador desde la opción de edición.

Si necesitas ver mas información sobre la plantilla que has seleccionado, en la ventana inferior ( Template info) se puede obtener información detallada sobre la misma, por ejemplo:

El tipo de licencia.
Los navegadores web compatibles con la plantilla.
La descripción detallada.
El tipo: Si utiliza HTML, XHTML, CSS etc ...

2 - Personalizar y editar la plantilla.

En el segundo paso, pestaña Customize, tenemos varias opciones para editar y modificar la plantilla actual a nuestro gusto.

2.1 - Modificar colores: Menú, fondo de página, bordes, texto etc ..

Dentro de esta opción hay una pestaña para modificar los colores de todos los elementos de la página web y otras opciones del fondo.

Body Background: Modificar el color de fondo de todo el contenido principal colocado en la etiqueta BODY.
Page BackGround: Color de fondo de la página.
Borders: Color de todos los bordes, por ejemplo el de los menús, tablas etc ..
NavBox: Colores de las barras de navegación ( menús de enlaces)
Content: Color del texto y enlaces.

Nota: Cada vez que cambies un color, podrás visualizar los cambios de la página web en tiempo real en la ventana inferior.

2.2 - Aplicar esquemas de colores o estilos predefinidos.

También puedes seleccionar varios presets o configuraciones ya establecidas para los esquemas de colores ( menús, texto, etc ..). Contiene 5 diseños preestablecidos ( Se debe hacer doble clic para aplicar los cambios)

2.3 - Modificar imágenes.

En la opción images, se puede, dependiendo de la plantilla seleccionada, modificar las imágenes y gráficos de la página web. Por ejemplo la imagen de fondo de la cabecera para el logo, para el pie de página etc ..

Al hacer clic en una imagen se cambiará la imagen seleccionada y se podrá visualizar en la ventana inferior.

3 - Vista previa de la página.

En la barra de herramientas Live preview, se puede visualizar la plantilla en un navegador web y guardar el proyecto para abrirlo en cualquier otro momento.

Al hacer clic en el botón Preview, se podrá visualizar y probar la página. Además contiene algunas opciones útiles, por ejemplo poder modificar la resolución de pantalla para ver como encuadra la página ( 800x600, 1024x768 etc ..)

4 - Exportar los archivos para crear la página web.

En el paso final, puedes visualizar la lista de archivos necesarios que conforman la plantilla, y seleccionar la carpeta donde exportar todos los ficheros, como también visualizar una vista previa del código HTML y CSS de la página.

En el panel template files, se listarán todos los ficheros: imágenes ( carpeta IMG), hojas de estilo ( Carpeta CSS) y el archivo principal de la página ( Index.html)