Búsqueda en el Foro:
Buscar


« Ver tema anterior :: Ver siguiente tema »  
Autor Mensaje
Mensaje24-06-2011, 12:25 (UTC)    
Título del mensaje: Como poner una plantilla Ice Blue-

Como poner una plantilla Ice Blue


Acá os dejo un pequeño tuto mediante el cuaĺ espero explicarles como pueden poner una plantilla Ice Blue a vuestra página.

1. Deben saber más o menos de qué se trata la plantilla Ice Blue. La plantilla no es más qué un código, el cuál está dividido en partes, estas partes pueden remplazarse por una imagen o un color.

2. Para colocar una imagen en una plantilla, debemos obtener su URL, si no sabes como se hace da click acá.
Si en vez de una imagen, solo quieres que aparezca cierto color, debes poner el número del color, sino sabes los números de los colores da click acá.

3. Por otro lado, se debe tener en cuenta qué no se puede usar una imagen y un color al mismo tiempo, si se llegara a colocar una imagen y un color, solo se tendrá en cuenta uno de los dos, el ultimo que hayas puesto.

4. Este es el código de la plantilla Ice Blue:


Código:
<style type="text/css">

<!--
body{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.edit_navi_headbg{background-image:url();}
td.edit_rechts_cbg{background-image:url();}
td.edit_rechts_bottom{background-image:url();}

td.edit_header_full{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}

td.nav_heading{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.nav{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.nav:hover{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}

td.sidebar_heading{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.shouty{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.shouty2{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.shouty3{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.shouty4{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.shouty5{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.edit_rb_footer{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}

td.edit_content_top{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.edit_content{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.edit_content_bottom{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.edit_content_bottom:hover{background-image:url();}
td.edit_content_bottom2{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}

td.edit_below_nav{visibility:hidden;}
td.edit_rechts_sbg{visibility:hidden;}

--></style>




5. Las partes de la plantilla.

- El siguiente código corresponde al fondo de vuestra página.
Puedes poner tanto una imagen de fondo como un color, pero se debe tener en cuenta qué la imagen debe tener al menos un tamaño de 1024 x 768 px, si no el fondo se veria en mosaico.

body{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}
td.edit_navi_headbg{background-image:url();}
td.edit_rechts_cbg{background-image:url();}
td.edit_rechts_bottom{background-image:url();}



- El siguiente código corresponde al encabezado, es aconsejable quévuestra imagen tenga un tamaño de 1000 x 158 px.




td.edit_header_full{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}



- El siguiente código corresponde al título de la navegación. Tamaño de la imagen 185 x 24 aproximadamente.



td.nav_heading{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}



- El siguiente código corresponde al fondo del menú. Tamaño de la imagen 185 x 33 aproximadamente.




td.nav{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}



- El siguiente código corresponde al fondo del menú al pasar el mouse. Tamaño de la imagen 185 x 33 aproximadamente.

td.nav:hover{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}



- El siguiente código corresponde al fondo de los titulos de los Box. Tamaño de la imagen 168 x 24 aproximadamente.




td.sidebar_heading{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}



- El siguiente código corresponde al Box 1. Tamaño de la imagen 168 x 800 aproximadamente.



td.shouty{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}



- El siguiente código corresponde al Box 2. Tamaño de la imagen 168 x 800 aproximadamente.

td.shouty2{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}



- El siguiente código corresponde al Box 3. Tamaño de la imagen 168 x 800 aproximadamente.

td.shouty3{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}



- El siguiente código corresponde al Box 4. Tamaño de la imagen 168 x 800 aproximadamente.

td.shouty4{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}



- El siguiente código corresponde al Box 5. Tamaño de la imagen 168 x 800 aproximadamente.

td.shouty5{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}



- El siguiente código corresponde al pie de página de los Box. Tamaño de la imagen 168 x 27 aproximadamente.



td.edit_rb_footer{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}



- El siguiente código corresponde al título de la página. Tamaño de la imagen 568 x 38 aproximadamente.



td.edit_content_top{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}



- El siguiente código corresponde al contenido. Tamaño de la imagen 568 x 300 aproximadamente.




td.edit_content{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}



- El siguiente código corresponde a la parte inferior del contenido. Tamaño de la imagen 568 x 31 aproximadamente.



td.edit_content_bottom{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}



- El siguiente código es mejor dejarlo como está para no deformar la parte anterior.

td.edit_content_bottom:hover{background-image:url();}



- El siguiente código corresponde al pie de página. Tamaño de la imagen 568 x 34 aproximadamente.



td.edit_content_bottom2{background-image:url(URL DE IMAGEN);background-color:#NÚMERO DEL COLOR;}



- El siguiente código tambien es recomendable dejarlo como está.

td.edit_below_nav{visibility:hidden;}
td.edit_rechts_sbg{visibility:hidden;}

6. Luego de qué hayan colocado las imagenes y/o colores de vuestro agrado. Junten todo el código y se van para PWG. Dan click en editar diseño.



7. Asegurense de tener como diseño a trabajar el Ice Blue.



8. Dan click en Configuraciones avanzadas.




9. En la parte inferior donde dice Advertencia referente al contenido deben pegar el código de vuestra plantilla.



10. Luego dan click en Guardar y observan los cambios en vuestra página.



11. Por último recordarles qué si carecen de tiempo hay muchas plantillas Ice Blue gratis en el foro de PWG. De seguro habrá alguna qué te guste.
______________

Never Forget - Lena Katina (♪)


Ultima edición por noscartatu el Vie Jun 24, 2011 8:26 am; editado 1 vez
Mensaje24-06-2011, 21:55 (UTC)    
Título del mensaje:

Buen tuto
______________

Mensaje24-06-2011, 23:12 (UTC)    
Título del mensaje:

Como que se parece a uno que vi por una web que no me acuerdo.
Saludos!
pd: saludos Tokarg
______________
Luciano Jmz
Luciano Jmz
Mensaje24-06-2011, 23:19 (UTC)    
Título del mensaje:

tumamalaflogger escribió:
Como que se parece a uno que vi por una web que no me acuerdo.
Saludos!
pd: saludos Tokarg

Sep ami tambien se me parese familiar
______________
http://img.webme.com/pic/a/ayuda031/firma012221.png imagen redimensionada por exceso de tamaño
Mensaje26-06-2011, 01:17 (UTC)    
Título del mensaje: Hola-

Si hay un tuto similar es lógico, pero os aseguro que lo hice yo,
Xd-
______________

Never Forget - Lena Katina (♪)


Ultima edición por noscartatu el Lun Jun 27, 2011 11:29 am; editado 1 vez
Mensaje26-06-2011, 01:27 (UTC)    
Título del mensaje:

che te ago una preg pq yo estoy estudiando a fondo fondo los codigos ...

td.edit.tal tal no entiendo porque yo ej uso el HTML-KIT y le pongo clase individual a cada objeto y lo hago en divs... que vendria a ser td.edit ?
Mensaje26-06-2011, 01:43 (UTC)    
Título del mensaje: Hola-

Creo que es porque el Ice Blue se basa en tablas.
Y no en divs.
______________

Never Forget - Lena Katina (♪)
Mostrar mensajes anteriores:   


Powered by phpBB © 2001, 2005 phpBB Group