LiveCMS Administrador de Contenidos

Inicio » Guía para diseñadores

4. Guia para diseñåadores

Introducción

LiveCMS es un programa que permite modificar de forma fácil el diseño. Esta organizado y los archivos estan en formato HTML para modifcar con cualquier editor de HTML.

Tags y comentarios especiales

Todas las paginas de las plantillas tienen un comentario especial y Tags {...} especiales.

Cada página tiene al inicio  y al final  estos comentarios hay que respetarlos y dejarlos intactos.
Los comentarios como  y terminados en  son indicativos de que alli aparecerá información. Son bloques que serán reemplazados por contenido de la base de datos
Los tags como: {SPOTLIGHT_IMAGE}, {WELCOME_TITLE}, se llama "Placeholders" o contenedores de información. Estos tags serán remplazados por contenidos desde la base de datos.

4.1 Organización de archivos

Todos los templates se estructuran de la siguiente forma:

index/ carpeta de home
- index.htmleste es la página inicial o el homepage
category/ carpeta de las secciones
- category.html este es para las secciones
- contact.html es para formulario de contacto
content/ carpeta para los contenidos de la página
- content.html este es el archivo donde se mostrará la información interna
css/ carpeta de estilo
- style.css este es el estilo de toda la página
common/ carpeta de archivos comunes
- comment_form.html - formulario de comentario
- common_confirm.html - informacion de comentario enviado
- content_top.html - 10 articulos más leídos por mes
- crumbs.html - navegación que indica en que página se encuentra
- footer.html - la parte final de la página
- header.html - la cabecera de la página
- nav.html - la navegación automática puede ser ordenado en forma horizontal o vertical
- news_top.html - 10 noticias más leídas por mes
- publicidad.html - espacio para poner los links
- publicidad2.html - espacio para poner links o banners
rss/ carpeta de rss o feeds
- general.css este es el estilo de toda la págin
search/ carpeta de buscador
- search.html es la pagina del buscador
user/ carpeta de usuarios
- login.html archivo para ingreso al sistema del admin
- my.html archivo para mi espacio o suscripciones

4.2 Tags predeterminados

El sistema con los siguientes Tags provee la siguiente información:

{CMS_TITLE} - título del sitio, ej. Pagina de LiveCMS
{CMS_SITEURL} - el url del sitio, ej. http://livecms.com
{CMS_SITETPL} - el url del template del sitio, ej. http://livecms.com/templates/general
{CMS_HOME} - para regresar al inicio de la página
{CMS_KEYWORDS} - palabras claves del sitio
{CMS_DESCRIPTION} - Descripción del sitio
{CMS_RSSURL} - informacion de la ubicación del RSS

4.2 Tips y Recursos

Tips para imágenes

Se suguiere usar el path real para las imágenes o el url del template {CMS_SITETPL}.
Ejemplo: /templates/general/images/logo.gif o {CMS_SITETPL}/images/logo.gif

Código:

<img src="/templates/general/images/logo.gif" border="0" align="left" title="Logo" alt="Logo" />

<img src="{CMS_SITETPL}/images/logo.gif" border="0" align="left" title="Logo" alt="Logo" />

Tips para estilos

Se suguiere usar los paths relativos en caso de imágenes. Ejemplo: ../images/logo.gif

Código:

#header {
	background-image: url(../images/logo.gif);
	background-repeat:  no-repeat;
}

Tips para ver la página con estilo

Hay dos formas, usando el tag predeterminado (se verá solo online) y poniendo el path del estilo. Ejemplos: {CMS_SITETPL}/css/general.css o /templates/general/css/general.css

Código en la parte del <head>

<link href="/templates/general/css/general.css" rel="stylesheet" type="text/css" />

<link href="{CMS_SITETPL}/css/general.css" rel="stylesheet" type="text/css" />

Se suguiere usar el path y cuando ya este online, usar el tag.

Programas para editar

Adobe Dreamweaver

Ultima actualización: $Id: index_design.html,v 1.4 2008/01/03 03:51:55 dcali Exp $