Crea tus propias plantillas para iWeb, III

En esta sección te explicaré todo lo que necesitas saber para crearte tu propia plantilla de iWeb basada en una ya existente. Iré comentando el proceso de tomar una plantilla y modificar sus atributos para dejarla al gusto de cada uno. No es lo mismo que crearla desde cero. No sé XML, y este archivo es un monstruo. Nadie en Apple escribe XML a pelo desde la nada, y me da que tú tampoco. Así que haremos esto menos molesto y engorroso duplicando un archivo ya existente y afinándolo a nuestro gusto (viva el tunning!!).

Un tutorial de Suzanne Boben. Consta de 4 partes que publicaremos en días consecutivos

Empezando

Empecemos por el principio: asegurémonos de tener todas las herramientas necesarias. Asumo que tienes un editor de gráficos, sin el cual no estarías leyendo esto. Más aún: necesitas un buen editor de texto que resalte contenidos con colores. Tercero, si vas a cambiar los colores necesitarás un una herramienta para convertir códigos de RGB 255 a RGB 100 y viceversa. Para terminar necesitarás volver a comprimir el archivo index.xml. El widget StuffIt’s DropStuff te resultará de lo más útil para eso.

Retomemos el ejemplo de la plantilla Freestyle. Puedes tomar otra plantilla, pero ten en cuenta que los nombres de los elementos (como por ejemplo las imágenes y los estilos de las fuentes) cambiarán. Pero si has llegado hasta aquí comprendiendo todo no creo que esto te entorpezca mucho.

Paso 1: Duplicar la template ya existente

En primer lugar debes decidir que template duplicar. Mejor usa Freestyle porque es sobre la que se realiza este ejemplo (no es mejor ni peor que otra que puedas escoger). Sólo escoge una cuyo aspecto te guste, y a partir de ahí todo puede ser cambiado.

1. Navega a través del archivo de recursos del iWeb de tu lenguaje y abre el directorio Templates que allí encontrarás. Alí verás los seis directorios arriba indicados, uno para cada tipo de página. (Fíjate en el archivo TemplatesInfo.plist. Luego volveremos con él.)

2. Abre el directorio About Me y encuentra la template que vamos a duplicar. Yo, por supuesto, he seleccionado la Freestyle About Me.webtemlate.

3. Haz clic con el botón derecho o con el botón de command sobre el archivo seleccionado y elige la opción Duplicate.

4. Ahora renombra el archivo de tal manera que te recuerde que es tu nueva template. Yo he usado Graffiti About Me.webtemplate y te sugiero que sólo cambies la primera palabra, ya que ésta identifica a las plantillas.

5. Ahora sube un nivel en el árbol de directorios y elige el de Blog. Sigue los pasos 2 a 5 para crear un nuevo template.

6. repite este proceso para los restantes directorios y apunta los nombres que has dado a cada nuevo template: necesitaras incluirlos en la lista del archivo TemplatesInfo.plist.

Paso 2: Registrar una plantilla nueva

Acabas de crear una nueva template, pero todavía no lo vas a poder seleccionar dentro de la lista de los disponibles. Eso se debe a que aun no lo has introducido en la lista de todos los templates que iWeb reconoce. Eso mismo haremos ahora:

1. En el mismo directorio donde tenemos los seis directorios de tipos de página hay un archivo, TemplatesInfo.plist. Duplica ese archivo y renómbralo como backup para saber que se trata precisamente de eso, de una copia de respaldo del original.

2. Ahora ábrelo. Verás que se trata de un archivo XML pero de estructura muy sencilla. Básicamente se trata las instrucciones para encontrar y mostrar los distintos templates que iWeb reconoce. Tú deberás añadir el tuyo.

3. Deberás amoldarte a la jerarquía que implementa el archivo. Si no estás seguro de saber hacerlo mejor no hagas nada, no lo vayas a romper. La primera sección es Category, y dentro de ella existe una entrada para cada tipo de página, siendo la primera About Me. Dentro de About Me puedes encontrar una sección para cada template, la primera de todas es Baby. Deberás duplicar esta sección para introducir los valores de tu nueva template. Veamos cómo se hace.

4. Continúa bajando por el XML y añade una entrada de la template tuya dentro de cada una de las categorías de página. La siguiente es la de Blog. El nombre dentro de <key> siempre debe ser el mismo: Graffiti.

5. Una vez que has añadido las páginas de template para cada sección desciende hasta llegar a la sección llamada:

<key>sortedThemes</key>

6. Esta sección le dice a iWeb en qué orden debe mostrar los temas dentro de al ventana de selección. Fíjate que no están en orden alfabético, así que si tú quieres pon la tuya arriba del todo. Duplica la entrada y edítala para que referencia a tu nueva template.

Ya lo tienes. Tu nueva plantilla está registrada y disponible en el desplegable para crear un nuevo sitio o una nueva página dentro de un sitio ya existente. Los siguientes pasos afectan al cambio del aspecto y presentación de tu template.

Es muy importante que escribas el nombre del archivo tal y como es. La etiqueta <key> almacena el nombre que aparecerá en la sección desplegable cuando tu plantilla esté lista para funcionar, así que usa uno que tenga significado.

Paso 4: Haciendo nuevos thumbnails

Me imagino vuestra extrañeza al darse cuenta de que cuando intentas crear un sitio o página nuevos usando un plantilla y la página de previsualización todavía muestra los estilos y el aspecto de la plantilla original. Bien, eso se debe a que eres tú quien ha de hacerse esas pequeñas imágenes y colocarlas en el correspondiente directorio thumbs dentro de cada archivo de template. Sólo entonces los podrás ver el las previews.

Lo primero que debes hacer es crearte un sitio sencillo con tu nuevo template. Créate uno con los seis tipos de páginas por defecto y cambia algunas imágenes en las páginas dado que vas a tener que hacer capturas de cada una de esas páginas. Esas capturas se convertirán en las imágenes thumbnails.

Proceso sugerido

Puedes hacerlo como tu quieras, pero yo te explico la manera en que lo he hecho y luego decides. Yo entré en cada archivo de template (para mi nuevo template Graffiti) y busqué el directorio thumbs. Allí encontré la imagen original y la abrí con Photoshop. Luego fui a mi web de pruebas y tomé una captura de pantalla de la página en cuestión para la que quiero el thumbnail. Después pegué el pantallazo en mi archivo de Photoshop, lo redimensioné para que se ajustara al tamaño original y lo guardé en el directorio. Repetí el proceso para los otros cinco directorios, asegurándome de que los almacenaba en el formato original, TIFF. Después de eso tenía mis seis imágenes thumbnail y todas aparecían de manera correcta en la ventana de la template.

Paso 5: Conquistar el XML

Si has llegado hasta aquí es casi seguro que no te arredrarás ante un nuevo reto. O puede que te sientas ya suficientemente satisfecho con estos primero cuatro pasos… De todas maneras decide si los cambios en el XML te serán o no satisfactorios. Si los colores y los estilos del template actual se ajustan bastante a lo que tú buscas, editar el XML para realizar cambios nimios va a ser más complicación que dejarlo tal cual. Pero si lo que ahora tienes no te acaba de gustar y te decides a retocar aún más template, ¡adelante!.

Artículos anteriores

Crea tus propias plantillas para iWeb, I

Crea tus propias plantillas para iWeb, II

0 0 votos
Article Rating
Subscribe
Notify of
8 Comments
Oldest
Newest Most Voted
Opiniones Inline
Ver todos los comentarios
Anónimo
Anónimo
18 years ago

Buenos tips, pero ya hay un programa que lo hace sin necesidad de tanto enredo.

Visiten esta pagina.

http://web.mac.com/sboben/iWeb/11Mystics/iWeb%20Templates.html

Chequenla, incluso ahy templates, los unicos que he visto hasta ahora.

Solo una pregunta, por que ciertas cosas solo se ven en .mac y y no se ven en otro sitio que no sea de .Mac

Gracias.

Anónimo
Anónimo
18 years ago

Me cago en la leche, y luego aun diran que usar un mac es mas sencillo que un PC, menuda porqueria de software xD

¿Porque leches no aprendeis HTML y os haceis vuestras propias webs y listos? asi ademas no estareis atados a un software tan restrictivo y que se nota que esta echo a mala leche para no permitir al usuario ser creativo.

Como iDVD, aun estoy esperando que alguien me explique como cambiar el grafico de los botones de mi menu, o como modificar el grafico de los botones de “volver atras” que pone automaticamente el programa cuando montas un submenu.

Ah claro, que tonto soy, si es que tengo que hackear el programa para conseguirlo y bajarme 50 tutoriales de internet 🙂 si es que, esto del mac es sencillo que te cagas…

Anónimo
Anónimo
18 years ago

juan

Anónimo
Anónimo
18 years ago

…Esa web que has marcado, es la de la autora de estos tutoriales…

Anónimo
Anónimo
17 years ago

Agonias, estás muy equivocado, Apple hace algunos sofwares (como idvd…ya sabes) para el uso casero, si tu quieres darle un uso profesional, te compras el dreamweaver, como harias en un PC…no? o microsoft tiene un programa igual de profesional que el dreamweaver que viene de serie en los pc’s?? porque serían las primeras noticias que tengo!! el iweb es sencillo y para gente inexperta, si quieres mas…pues o haces lo que pone en este tutorial o te compras el dreamweaver como harías en windows!!

Anónimo
Anónimo
17 years ago

ei me podeis enviar plantillas wapas al msn1 agregarme a michi_46_@hotmail.com y me las envias sin fallo

saludos

Anónimo
Anónimo
17 years ago

hola kiero mi nombre en graffiti

Anónimo
Anónimo
16 years ago

Falta el paso 3, ¿no? El que habla de reemplazar gráficos…

8
0
Me encantaría saber tu opinión, por favor, deja un comentariox
()
x