sábado, 4 de febrero de 2012

DIA 16: MASTER PAGES, PLANTILLAS Y TEMAS

Creación de páginas maestras (Master Pages)

Las páginas maestras (Master Pages) se agregan a la página utilizando el cuadro de diálogo Agregar elemento. Se pueden colocar en cualquier parte del sitio, incluyendo la carpeta raíz, pero desde un punto de vista organizativo, a menudo es más fácil guardarlas en una carpeta separada. Al igual que las páginas ASPX normales, que utilizan el modelo de código en línea, así como el código separado. Las páginas principales utilizadas en el proyecto Portal Web FCFYM utilizan exclusivamente el modelo de código separado

  
Creación de plantillas de páginas reutilizables
 
Visual Web Developer incluye una gran herramienta para exportar plantillas para un número de diferentes tipos de archivos, incluyendo las páginas ASPX, archivos de clase, e incluso los archivos CSS. Al crear una nueva plantilla, se define el código o marcado que usted necesita en cada archivo una sola vez y luego crear archivos nuevos basados ​​en esta plantilla, se da un gran salto con el archivo y se reduce al mínimo el código que necesita escribir.



Aplicación de temas
Para aplicar un tema a su sitio web, usted tiene tres opciones diferentes: a nivel de página en la directiva de página, a nivel de sitio mediante la modificación del archivo web.config, y programación. 

  • Establecer el tema a nivel de página: Configuración del Tema o propiedad StyleSheetTheme a nivel de página es muy sencillo: basta con establecer el atributo relevante en la directiva Page de la página:
<% @ Page Language = "VB" AutoEventWireup = "false" CodeFile = "Default.aspx.vb" Inherits = "_Default" Theme = "DarkGrey"%

Vuelva a colocar Theme con StyleSheetTheme para aplicar un tema cuya configuración puede ser anulado por las páginas individuales. La figura 6-13 muestra que tan pronto como se escribe Theme = " VWD aparece una lista con todos los temas que encuentra en la carpeta App_Themes.
  • Establecer el tema a nivel de sitio: Para aplicar un tema a lo largo de todo el sitio web, usted puede establecer el tema en el archivo web.config mediante la adición de un atributo de tema para el elemento <pages> en el interior del elemento <system.web>:
<pages theme="DarkGrey"> ... </ Pages> Asegúrese de escribir theme con todas las letras en minúsculas, porque el código XML en el archivo web.config distingue entre mayúsculas y minúsculas. 

  • Configuración de temas mediante programación: La tercera y última para definir un tema mediante programación a través de código. 
Crear un archivo de máscara (Skin)
 
Los archivos de máscara (skin) se debe crear en la carpeta de temas directamente. No se pueden almacenar en una subcarpeta como se hace con las imágenes de los temas.
Cuando empieza a escribir en un archivo skin, te darás cuenta de que el IntelliSense familiar no se produce. Esto hace que sea un poco difícil de definir sus controles y sus atributos. Sin embargo, existe una solución sencilla:
1. Abra el cuadro de diálogo Opciones de VWD eligiendo Herramientas Opciones.
2. Expanda la categoría Editor de texto y haga clic en la extensión del archivo. Si usted no ve estas categorías,
asegúrese de que Mostrar todas las configuraciones en la parte inferior de la pantalla se selecciona.



    Vista del Portal Web al 04 de Febrero de 2012, utilizando una Página Maestra:


      

     Vista del Portal Web al 05 de Febrero de 2012, utilizando el tema Monochrome de PlanetVrox:




    No hay comentarios:

    Publicar un comentario