DATREBIL's profileTUTORIALES PARA LOS SPAC...BlogLists Tools Help

Datrebil

Location
Image Hosted by ImageShack.us

Free Site Counter

February 28

28 DE FEBRERO, DÍA DE ANDALUCÍA

Image Hosted by ImageShack.us

 

FELIZ DÍA DE ANDALUCÍA
 
 
LES DESEO A TODOS LOS ANDALUCES, DONDE QUIERAN QUE SE ENCUENTREN, UN FELIZ DÍA DE NUESTRA COMUNIDAD.
 
ESPECIALMENTE A AQUELLOS ANDALUCES QUE SE ENCUENTRAN FUERA DE SU HERMOSA TIERRA.
 
 

Image Hosted by ImageShack.us

January 26

CÓMO CREAR UN LIBRO DE VISITAS

Este tutorial ofrece la forma de insertar un libro de visitas en vuestro espacio para que vuestros visitantes dejen en él sus opiniones, sugerencias y demás.
Para ello debes seguir estos pasos:
  • Primero debemos acceder a la web que nos permitirá crear el libro. Podemos hacerlo desde el propio libro de visitas de este espacio, con un enlace que se encuentra justo abajo del libro. O directamente entramos en este enlace:

http://www.redfind.com/gb/

 

Image Hosted by ImageShack.us

 

  • Ya dentro de la web, pinchamos en el enlace Obtén tu libro de visitas aquí. De esta manera entraremos en una página en la que diseñaremos nuestro libro y lo registraremos con nuestros datos.

Image Hosted by ImageShack.us

 

  • Rellenamos las casillas del cuestionario con nuestros datos, asegurándonos de que los datos están correctos (sobretodo la URL de nuestro espacio). También elegimos aquí el diseño que tendrá nuestro libro, tanto el fondo como la combinación de colores de las letras de los mensajes que dejen los visitantes, etc.

Image Hosted by ImageShack.us

 

  • Cuando hayamos terminado de rellenar el cuestionario y de diseñar el libro, pinchamos la casilla Crear página. Entonces recibirás un correo electrónico a la dirección que hayas elegido en el que te ofrecen tanto la URL (dirección del libro) como la clave (password) para acceder a los mensajes privados.
  • Por tanto, debemos abrir el correo para obtener la URL de nuestro libro de visitas.

Image Hosted by ImageShack.us

 

  • Por último, para crear un enlace directo hacia el libro desde nuestro espacio, podemos hacerlo mediante una Lista que agreguemos desde el menú Módulos. En la Lista podremos sugerir que los visitantes de tu espacio dejen sus comentarios en el libro o cualquier cosa que se nos ocurra, además de pegar la URL de nuestro libro en la csailla corespondiente, para que el enlace sea correcto.
  • Otra manera de crear el enlace sería insertar la URL del llibro en una entrada de blog.

 

Espero que la explicación haya sido lo suficientemente clara como para que puedas conseguir tu propio libro de visitas para tu espacio sin problemas.

 

 

Datrebil, Sevilla, Thu Jan 26 19:23:14 UTC+0100 2006

December 30

PARA LEER LOS COMENTARIOS DE UNA VEZ

Supongo que piensas igual que yo cuando quieres leer los comentarios de tu espacio y tienes que ir pinchando blog a blog para poderlo hacer.
Pues bien, ya no es necesario.
De la forma que seguidamente se explica podrás abrir de una vez la sección de comentarios de todos los blogs visibles de tu espacio.
Para ello sigue estos pasos:
  • Abre tu espacio y lo sitúas en el modo Vista previa.
  • Copia este código:

javascript:try{var d=document.all("BlogViewId").getElementsByTagName("div");var i=0;for (i=0;i<d.length;i++) {if (d[i].id.indexOf("entrycns!")==0) void(OpenSection("comment",d[i].id.substr(5)));}}catch(e){}

  • Pega el código en la casilla Dirección de la barra de herramientas de tu explorador (en mi caso Microsoft Explorer).
  • Hacer clic en la casilla Ir o pulsar Enter

Aparecerá entonces, poco a poco, cada sección de Comentarios bajo su entrada de blog.

 

Para cerrar las ventanas de los comentarios y volver al estado normal del espacio en Vista previa, tienes que repetir el proceso pero pegando, esta vez, el siguiente código:

javascript:try{var d=document.all("BlogViewId").getElementsByTagName("div");var i=0;for (i=0;i<d.length;i++) {if (d[i].id.indexOf("entrycns!")==0) void(Close("comment",d[i].id.substr(5)));}}catch(e){}

 

Image Hosted by ImageShack.us

December 11

SEPARADORES Y MOTIVOS NAVIDEÑOS

La Navidad se acerca y para ello expongo en este blog una serie de motivos navideños para quien quiera adornar su espacio. También hay más separadores con los que se amplia la lista existente.
 
 
 

Image Hosted by ImageShack.us

 Image Hosted by ImageShack.us                                                                  Image Hosted by ImageShack.us


Image Hosted by ImageShack.us


 

Image Hosted by ImageShack.us


Image Hosted by ImageShack.us


 

Image Hosted by ImageShack.us


 

Image Hosted by ImageShack.us


Image Hosted by ImageShack.us


 

Image Hosted by ImageShack.us


Image Hosted by ImageShack.us


Image Hosted by ImageShack.us


Image Hosted by ImageShack.us


Image Hosted by ImageShack.us


Image Hosted by ImageShack.us


Image Hosted by ImageShack.us


Image Hosted by ImageShack.us


Image Hosted by ImageShack.us


Image Hosted by ImageShack.us


 

Image Hosted by ImageShack.us


Image Hosted by ImageShack.us


 

Image Hosted by ImageShack.us

December 07

XANDER & DATREBIL MUSIC

Nos complace en poner a disposición de nuestros visitantes un espacio donde la música es su principal motivación.

Poco a poco las listas musicales se irán poblando de canciones que os ofrecerán la oportunidad de disfrutar mientras visitáis nuestros espacios y de conseguir la URL para colocar la canción que os guste en el Windows Media Player de vuestro espacio.

Esperamos que la estancia en

 XANDER & DATREBIL MUSIC  

sea del agrado de los visitantes y que les sea de utilidad.

 GRACIAS POR LA VISITA. ESPERAMOS QUE VUELVAN. 

(PINCHE SOBRE EL LOGO PARA ENTRAR EN EL ESPACIO) GRACIAS

 

CÓDIGO PARA AGREGAR MÁS DE 11 LISTAS

Una de las limitaciones que Microsoft impone en la creación de los Spaces MSN es el número de Listas que podemos agregar, sólo 11 Listas.
Pues bien, con el código que seguidamente publicaré podremos colocar más Listas de las permitidas.
El método es muy sencillo.
 
  • Desde el modo de edición del espacio, pegaremos el siguiente código en la barra Dirección del explorador que usemos y pincharemos en Ir o pulsaremos Enter.

javascript:var l=window.location.href;var p='http://spaces.msn.com/members/';if( l.indexOf(p) != -1 ){ l=l.substring(0+p.length); l=l.substring(0,l.indexOf('/'));Action('addlist','Enter The List Name',new Array('List Name'),null,new Array('128'),p+l+'/PostAcc

 

Image Hosted by ImageShack.us

  • Nos aparecerá una ventana pequeña en la que se puede leer List Name sobre un recuadro en blanco. En ese recuadro escribiremos en nombre de nuestra Lista y pincharemos Aceptar, para memorizar la operación.

Image Hosted by ImageShack.us

  • La Lista se habrá creado y sólo quedará situarla donde queramos, tal como cualquier otra Lista.

Cada vez que queramos agegar una nueva Lista seguiremos los mismos pasos, de manera que no sólo tendremos 11 Listas activas sino aquellas que queramos (o nos deje Microsoft, de momento).

 

November 22

SEPARADORES ANIMADOS PARA BLOGS

Son muchos los que ponéis en vuestros blogs separadores originales entre aquello que publicáis.
En este blogs quiero ofrecer una serie de separadores que he ido coleccionando de mis visitas a diferentes espacios para que aquel que quiera utilizarlos pueda elegir el que prefiera.
 

 

Image Hosted by ImageShack.us


 

Image Hosted by ImageShack.us


 

Image Hosted by ImageShack.us


 

Image Hosted by ImageShack.us

 


 

Image Hosted by ImageShack.us


 

Image Hosted by ImageShack.us


 

Image Hosted by ImageShack.us


 

Image Hosted by ImageShack.us


 

Image Hosted by ImageShack.us


 

Image Hosted by ImageShack.us

 


 

Image Hosted by ImageShack.us


 

Image Hosted by ImageShack.us


 

Image Hosted by ImageShack.us


 

Image Hosted by ImageShack.us


 

Image Hosted by ImageShack.us


 

Image Hosted by ImageShack.us


 

Image Hosted by ImageShack.us


 

Image Hosted by ImageShack.us

 


 

Image Hosted by ImageShack.us

 


 

Image Hosted by ImageShack.us

 


 

Image Hosted by ImageShack.us

 


 

Image Hosted by ImageShack.us

 


 

Image Hosted by ImageShack.us

 


 

Image Hosted by ImageShack.us

 


 

Image Hosted by ImageShack.us

 


 

Image Hosted by ImageShack.us

 


 

Image Hosted by ImageShack.us

 


 

Image Hosted by ImageShack.us

 


Image Hosted by ImageShack.us

 


Image Hosted by ImageShack.us

 


 

Image Hosted by ImageShack.us

 


 

Image Hosted by ImageShack.us

 


 

Image Hosted by ImageShack.us

 


 

 

Image Hosted by ImageShack.us

 


 

Image Hosted by ImageShack.us

 


 

Image Hosted by ImageShack.us

 


 

 

 

Image Hosted by ImageShack.us

 


 

 

Image Hosted by ImageShack.us


Image Hosted by ImageShack.us


 

Image Hosted by ImageShack.us


 

Image Hosted by ImageShack.us


Image Hosted by ImageShack.us


Image Hosted by ImageShack.us


Image Hosted by ImageShack.us


Image Hosted by ImageShack.us


Image Hosted by ImageShack.us

 

El modo de utillización de estos separadores es muy sencillo.

Sólo tenéis que copiar el separador que queráis utilizando el botón derecho de vuestro ratón y seleccionando la acción Copiar.

Y luego dentro de una entrada de blog pegarlo utilizando la herramienta de Pegar que se encuentra en la barra de herramientas de blog.

Y ya está.

November 14

CÓMO ENLAZAR UNA IMAGEN CON UNA PÁGINA DISTINTA AL BLOG

A continuación vamos a verá herramienta que sirve parainsertar una imagen enlazada a una página, es decir, se insertará una imagen en la que si hacemos clic sobre ella nos mandará a una página a la cual está enlazada.

Para utilizar el código de esta herramienta, debemos abrir una entrada de blog (agregar entrada).

Pinchamos en la barra de herramientas del blog la casilla HTML y pegamos el código con los datos de la página que queréis enlazar y de la imagen.

Volvéis a pinchar la casilla HTML y, cuando esté listo, publicáis el blog. El código es el siguiente:

<DIV><A href="URL DE LA PÁGINA ENLAZADA"><IMG height=80 src="URL DE LA IMAGEN" width=105 border=0></A></DIV>

Ejemplo:

 

 

 

 Si pinchamos en la imagen del libro nos mandará a la página enlazada, el Libro de Visitas de este espacio. (Si quieres aprovechar y dejar tu firma en el Libro de Visitas, sólo tienes que pinchar la imagen e insertar tu firma, gracias).    

 

Datrebil, Sevilla, Fri Sep 9 19:23:35 UTC+0200 2005

November 08

CÓMO CONSEGUIR LA URL PARA EL WINDOWS MEDIA PLAYER

Ya sois muchos los que planteáis dudas sobre dónde encontrar la URL para el reproductor Windows Media Player.
Intentaré por tanto crear un tutorial sencilo de entender para que solucionéis vuestras dudas.
 
Si todavía no sabes como insertar el reproductor Windows Media Player en tu espacio puedes entrar en este enlace que te facilitará el tutorial correspondiente:
 
Para empezar, para aquellos que no sepan qué es, decir que una URL es básicamente la dirección de la página web que visitamos o de un archivo de música o video que descargamos directamente de un servidor.
Por tanto, la URL de mi espacio sería:
La URL de un archivo musical sería algo así:
http://www.nombre_de_la_web.mp3 (o cualquier extensión de formato de música: .mid, .wma, etc.)
Y la URL de un archivo de video sería:
http://www.nombre_de_la_web.wmv (o cualquier extensión de formato de video: .mpeg, .avi, etc.)
 
 
Hay varias maneras de conseguir una URL válida. Veremos algunas de ellas.
Este tutorial es aplicable tanto a las URLs de las canciones como a las de los videos, aunque me refiera siempre a canciones.
 
Si queremos colocar una canción que tenemos en nuestro ordenador, para conseguir la URL debemos alojarla en una web de alojamiento, como ya hemos visto en otros tutoriales. Actualmente, la web que funciona mejor es: http://www.filelodge.com/
El tutorial que explica cómo alojar tus archivos lo puedes encontrar en este enlace: http://spaces.msn.com/members/erchanfli/Blog/cns!1p6b5sbD4TThkqT-todDmzoQ!316.entry
 
Una vez alojada la canción en la citada web, para conseguir la URL hacemos lo siguiente:
  1. La alojamos cómo muestra el tutorial del enlace de arriba.
  2. Una vez subida la canción, nos aparecerá un código que es para utilizarlo en foros. Como éste no nos sirve, pinchamos en la casilla URLs y nos facilitará la URL de la canción que debemos poner en el reproductor. Recordad que es necesario pinchar en la casilla Save del reproductor para que quede memorizada la acción.

Image Hosted by ImageShack.us

 

Image Hosted by ImageShack.us

 

Otra forma de conseguir la URL de una canción es a través de una página web que no sea de alojamiento.

Por ejemplo:

http://www.aljama.info/

Esta es una web de un grupo de música sefardí que dispone para sus visitantes la posibilidad de descargar directamente algunas canciones de su repertorio.

Entramos en la sección de Descargas y pinchamos en el icono del altavoz para poder escuchar directamente la canción. Se abrirá por tanto nuestro reproductor para poder oírla.

Image Hosted by ImageShack.us

 

Entonces, hacemos doble clic sobre el nombre de la canción y pinchamos en Propiedades. Nos saldrá otro cuadro donde nos facilita la ubicación de la canción, es decir, la URL de la misma.

La copiamos y la pegamos en la casilla correspondiente del reproductor de nuestro espacio.

 

 

Image Hosted by ImageShack.us

 

Image Hosted by ImageShack.us

October 23

CÓMO COMPRIMIR UN VIDEO PARA COLOCAR EN EL WINDOWS MEDIA PLAYER

He recibido muchas visitas pidiéndome ayuda para colocar videos que tenemos en nuestro PC en el reproductor Windows Media Player de sus espacios.
A continuación trataré de explicar cómo hacerlo.
Primero tenemos que tener localizado el video en cuestión y observar su capacidad, es decir, el tamaño del mismo. Esto es muy importante ya que en la mayoría de los servidores de alojamiento de archivos sólo nos permiten subir archivos con un tamaño máximo de 2 mb.
Si el tamaño del video que queremos reproducir es superior a 2 mb, pero inferior a más omenos 10 mb, podemos comprimirlo con un sencillo programa que seguidamente comentaré. Si vuestro video es superior a 10 mb, podéis probar a comprimirlo; es posible que en la conversión su tamaño no supere los 2 mb y haya suerte. El programa es AVS Video Converter 3.4 y puedes descargarlo en el siguiente link:
 
 
Al pinchar sobre el link os saldrá una página donde encontraréis este gráfico, pues para descargarlo debéis pinchar en el lugar señalado en el gráfico de abajo.
 

Image Hosted by ImageShack.us

 

Una vez que hayamos descargado e instalado el programa tenemos que registrarlo, introduciendo el serial que viene con el archivo en el lugar correspondiente.
Ejecutamos el programa y comenzamos a comprimir el video.
 

Image Hosted by ImageShack.us

 

Para ello, seleccionamos la casilla To WMV situada en la barra de formatos del programa. Al mismo tiempo que comprimiremos el video convertiremos su formato si éste es distinto al de Windows Media Video (WMV, válido para el reproductor del espacio).
  

Image Hosted by ImageShack.us

 

A continuación seleccionamos el video que queremos comprimir y el destino donde vamos a guardarlo. Para ello pinchamos sobre las casillas Browse y seleccionamos correspondientemente lo solicitado.

 

Image Hosted by ImageShack.us

 

Por último, seleccionamos el formato al que debemos convertir nuestro video de entre las opciones que se encuentran en la casilla WM Profile. Para que su tamaño sea el idóneo seleccionaremos el siguiente formato:

Windows Media Video 8 for Local Area Network (100Kbps)

 

Image Hosted by ImageShack.us

 

Y hecho ésto, pinchamos la casilla Convert Now! para que comience la conversión del video seleccionado.

Al cabo se unos instantes tendremos nuestro video listo para subirlo a un servidor que nos facilite una URL.

Recomiendo esta web de alojamiento de archivos: TheFileBucket. En el tutorial anterior se explica la manera de alojar un archivo en este servidor.

Una vez alojado el video y tengamos la URL del mismo, sólo tenemos que pegarla en la casilla correspondiente del Windows Media PLayer de nuestro espacio y pinchar la casilla Save para guardar la operación.

 

De esta forma podremos colocar nuestros videos favoritos sin tener que molestarnos en buscarlos en webs donde nos es difícil conseguir la URL necesaria.

Espero que este tutorial os resulte fácil de ejecutar y que os sea muy útil en pro de mejorar vuestros espacios.

Hasta otra. Saludos.

 

 Datrebil, Sevilla, Sun Oct 23 17:41:27 UTC+0200 2005

October 10

CÓMO ALOJAR ARCHIVOS EN THEFILEBUCKET

Para ayudar a una visitante, en particular, y a todos los que visitéis este espacio y tengáis la misma duda, trataré de explicar cómo se alojan los archivos en el servidor TheFileBucket (pincha aquí para acceder a esta web).
Recordad que podéis alojar imágenes, canciones, videos, etc., pero siempre que su tamaño sea menor de 2 mb. 

Para empezar, accedemos a la página en cuestión, podéis hacerlo desde el enlace de arriba. Y nos registramos tal como explican los  gráficos de abajo. (Si no se ven bien puedes pinchar en los enlaces de debajo para ver las imágenes más grande).

 

¡¡¡ATENCIÓN!!!

Ya sois varios los que me decís que esta web de alojamiento os da problemas, así que os recomendaré otra que funciona mejor y que permite alojar archivos con mayor tamaño. Algunos ya la conocéis y me habéis hablado de ella. La web es: File Lodge  (Pinchar aquí para entrar en ella).

Su uso es idéntico que en la anterior web. Así pues, puedes seguir los pasos que acontinuación se mencionan.

 

Image Hosted by ImageShack.us

 

Image Hosted by ImageShack.us

http://img416.imageshack.us/img416/1139/dibujo16bw.png

 

Image Hosted by ImageShack.us

 http://img416.imageshack.us/img416/9215/dibujo24jw.png

 

Una vez os hayáis registrado, la manera de subir los archivos para alojarlos en la web es la siguiente:

 

Image Hosted by ImageShack.us

http://img362.imageshack.us/img362/8674/dibujo38tj.png

 

Image Hosted by ImageShack.us

http://img362.imageshack.us/img362/7779/dibujo40mp.png

 

Cuando el archivo se ha alojado, la web os facilita una página donde os ofrece:

  • un código para foros [IMG]
  • un código para webs o espacios <img>
  • una dirección URLs
  • un enlace directo o  link del archivo Links

Dependiendo para qué queréis utilizar el archivo, así debéis elegir el código.

Para utilizar en un blog mediante la tecla HTML, debéis usar el código <img>; si el archivo que habéis subido es para colocarlo en el reproductor Windows Media, necesitáis la URL; y si queréis colocar en el blog un enlace directo del archivo tendréis que utilizar el código Link.

 

Image Hosted by ImageShack.us

http://img362.imageshack.us/img362/1350/dibujo57ko.png

 

Espero que haya sido lo suficientemente claro en la explicación y que os sea de ayuda. Si no es así, por favor, hagánmelo saber. Muchas gracias.

 

Datrebil, Sevilla, Mon Oct 10 17:51:09 UTC+0200 2005

September 30

CÓDIGO PARA COLOCAR IMAGEN DE TEXTO

Cuando redactáis un texto, ¿nunca habéis querido colocar una imagen referente al texto tal como las imágenes de noticias?. Me refiero a esas imágenes que encabezan un texto en una esquina del mismo al que prosigue acontinuación los párrafos de aquellos que escribimos.
Este código permite conseguir tal efecto.
Para ello, abrimos una entrada de blog.
Escribimos el texto que queramos
Pinchamos la casilla HTML y pegamos el código justo delante del código del texto que habéis escrito.
Luego, volvemos a pinchar la casilla HTML y publicamos la entrada de blog cuando esté finalizada.
 
El código es el siguiente:
 
<P align=left><IMG height=170 alt="TEXTO MIENTRAS CARGA LA IMAGEN"
src="URL DE LA IMAGEN" align=left>
 
Sólo tenemos que completar el código con los datos oportunos dadas vuestras preferencias y tendréis un resultado similar a este:
 

Imagen de la noticia

 
Como podéis observar, la imagen queda a justamente a la izquierda de este texto.
 
 
 
Podéis apreciar que si el texto es más largo que la imagen el texto seguirá justo por debajo de la imagen, encuadrándola de manera que parecerá tal como la imagen que da pie a la noticia o al texto que publiquéis.
 
 
 
NOTA: La imagen aparecerá en un tamaño reducido, si os interesa que la imagen salga al tamaño real, hacer doble clic sobre ella. Espero que os sea útil. Saludos.
 
 
 
 Datrebil, Sevilla, Fri Sep 30 20:24:07 UTC+0200 2005
September 20

NUEVAS VENTANAS PARA TEXTOS O IMÁGENES

En este blog trataré de poner disposición del que lo desee los códigos de una serie de ventanas o cuadros que sirven para enmarcar o adornar los textos y/o las imágenes.

Su uso es muy sencillo y está basado al igual que la mayoría de los códigos HTML en :

  • Abrir una entrada de blog (Agregar entrada).
  • Pinchar la casiilla HTML.
  • Pegar el código correspondiente.
  • Volver a pinchar la casilla HTML
  • Por último, publicar la entrada de blog.

 

VENTANA CON LÍNEA DISCONTINUA

PARA TEXTOS 

<DIV style="BORDER-RIGHT: blue 2pt dashed; BORDER-TOP: blue 2pt dashed; BORDER-LEFT: blue 2pt dashed; BORDER-BOTTOM: blue 2pt dashed">ESCRIBIR AQUÍ EL TEXTO</DIV>

 

Aquí puedes escribir tus textos, ofreciéndole un toque original.

 

PARA IMÁGENES

<DIV style="BORDER-RIGHT: blue 2pt dashed; BORDER-TOP: blue 2pt dashed; BORDER-LEFT: blue 2pt dashed; BORDER-BOTTOM: blue 2pt dashed"><IMG height=198 src="URL DE LA IMAGEN" width=191 border=0></A></P></DIV>

 

 

NOTA:

Como te habrás dado cuenta, se puede cambiar el color de las líneas. Sólo tienes que cambiar el valor del color de los bordes (Border). En el código aparece el color azul (Blue). Para conseguir otro color cambia la palabra Blue por el nombre del color que quieras escrito en inglés.

green=verde, red=rojo, blue=azul, yellow=amarillo, orange=naranja, black=negro, white=blanco, violet=violeta (morado), pink=rosa, beige=beige (marfil), etc.

El grosor de las líneas se puede modificar también. Para ello sólo tienes que incrementarle el valor que sigue al color cuya unidad es pt. (En el código sería 2pt, si quieres más ancha las líneas, prueba con 5pt, por ej.).

VENTANA CON LÍNEA CONTINUA

PARA TEXTOS

<DIV style="BORDER-RIGHT: black 2px solid; BORDER-TOP: black 1px solid; BACKGROUND: white; BORDER-LEFT: black 1px solid; WIDTH: 525px; BORDER-BOTTOM: black 2px solid" align=left><FONT color=#000000>ESCRIBIR AQUÍ EL TEXTO</FONT></DIV>

 

AQUÍ PUEDES ESCRIBIR CUALQUIER TEXTO

O INCLUIR CUALQUIER IMÁGEN

 

 

 PARA IMÁGENES

<DIV style="BORDER-RIGHT: black 2px solid; BORDER-TOP: black 1px solid; BACKGROUND: white; BORDER-LEFT: black 1px solid; WIDTH: 525px; BORDER-BOTTOM: black 2px solid" align=left><IMG height=198 src="URL DE LA IMAGEN" width=191 border=0></A></P></DIV>

 

 

 

NOTA:

Del mismo modo, los valores tanto de color, como de grosor de las líneas se pueden variar al gusto del usuario.

A este código se le une la posibilidad de cambiar el color de fondo del recuadro (BACKGROUND). Sólo tienes que cambiar la palabra white por el nombre en inglés del color que desea usar.

 

VENTANA CON LÍNEA DE PUNTOS

<IMG style="BORDER:red 6pt dotted" heigth=150 src="URL DE LA IMAGEN" width=200>

 

 

NOTA:

La palabra red indica el color de la línea de puntos, si queremos otro color debemos cambiarla por el nombre en inglés del color deseado.

El valor 6pt indica el tamaño de los puntos, si queremos más grosor cambiaremos el valor por otro mayor y si lo queremos menor, lógicamente por otro menor. (Ej.: 8pt sería mayor ------ 3pt, los puntos serían más pequeños).

 

VENTANA CON DOBLE LÍNEA

<IMG style="BORDER: orange 5.5pt double" height=150 src="URL DE LA IMAGEN" width=200>

 

 

NOTA:

Al igual que los otros códigos se pueden cambiar los valores de color de los bordes y el grosor de las líneas.

Se realiza tal como los otros.

CÓMO HACER MÁS ANCHO EL BLOG

Si habéis visitado mi espacio personal (LA SALITA DE DATREBIL)  os habréis dado cuenta de que la parte del blog es más ancha de lo permitido, ocupa el ancho del espacio.
Con este código además de conseguir un blog más ancho, puede mover las listas fuera del espacio (a la parte derecha de éste) y hace más anchalas listas colocadas debajo del blog.
Pues acontinuación trataré de explicar cómo conseguirlo.
 
Primero: Debemos agregar el módulo CUSTOM HTML. Si aún no lo tienes agregado pincha este link y te llevará al tutorial que explica cómo activarlo:
 
Segundo: Ahora para que esta herramienta tenga un buen resultado, tenemos que elegir un diseño de espacio concreto.
Para ello, pinchamos en Personalizar, y nuevamente en Diseño. El diseño que mejor resultado ofrece es el que dice 378px. Una vez elegido pinchamos en Guardar, para que no se borren los cambios realizados.
 
Tercero: Es el momento de organizar las listas de nuestro espacio. La manera idónea es la siguiente:
  • El módulo CUSTOM HTML debe de ir en la parte central del espacio, arriba del todo. (IMPORTANTÍSIMO).
  • El Blog debe estar colocado justo debajo del módulo CUSTOM HTML (IMPORTANTE).
  • En la parte izquierda del espacio pueden colocar dos o tres listas, las que quieran. Recomiendo poner el Perfil y alguna otra lista como el Album de fotos.
  • A la derecha pongan las listas restantes. Serán las que aparezcan fuera del espacio.

Cuarto: Ahora copien uno de estos códigos:

  • <div></td></table></DIV>
  • </td></table>

Quinto: Por útimo, peguen el código en el recuadro blanco del módulo CUSTOM HTML. Y pinchen Save para guardar los cambios realizados.

  • Este código puede pegarlo delante del código de una imagen o video que quiera colocar o tenga colocado en el módulo, ya que son compatibles. De esta forma logrará que el blog sea más ancho y podrá colocar una imagen o un video fuera del blog, al mismo tiempo.Tenga en cuenta que este módulo tiene limitado el número de carácteres que se pueden escribir en el recuadro.

Image Hosted by ImageShack.us

 http://img393.imageshack.us/img393/271/cdigoblogancho3ug.png

(Pincha este enlace para ver la imagen más grande)

 

 

Ahora sólo queda pinchar en Vista previa de mi espacio y comprueben el resultado.


 
Basado en el tutorial de  Diego 22000 

Datrebil, Sevilla, Tue Sep 20 13:06:30 UTC+0200 2005

September 17

PARA PONER EN EL BLOG EL FONDO QUE QUERAMOS

Los pasos a seguir son muy sencillos, prácticamente es tal como para los otros códigos.
  • Primero necesitamos la URL (dirección de enlace) de la imagen que queremos colocar como fondo del blog. Para ello debemos subirla a una página de almacenamiento de imágenes, la cual nos facilitará la URL y los códigos HTML para introducirlos en la entrada de blog. La explicación de como ejecutar este paso se encuentra en este link (pincha en el si no sabes como subir las imágenes):

http://spaces.msn.com/members/erchanfli/Blog/cns!1p6b5sbD4TThkqT-todDmzoQ!116.entry

 

  • A continuación abrimos una entrada de blog pinchando en Agregar entrada. Pinchamos la casilla HTML y pegamos el siguiente código: <pre></table></table><table background="URL DE LA IMAGEN"><tr><td><div><table style="display:none"></pre>
  • Cambiamos la frase URL DE LA IMAGEN, precisamente por la URL que hemos conseguido en la página donde hemos subido la imagen. (Recuerda que la URL debe empezar por http://  )
  • Volvemos a pinchar la casilla HTML, ponemos un título al blog y por último publicamos la entrada.
    • Si pinchan en la función Vista previa de mi espacio, podrán ver el resultado.

      Espero que esta herramienta os sea útil y que la explicación haya sido, al menos, clara y comprensible. ¡Pobradlo y ya me diréis!

       

       

       

       

      Datrebil, Sevilla, Sat Sep 17 18:24:23 UTC+0200 2005

      September 08

      CÓDIGO PARA PONER MÁS DE UNA CANCIÓN O DE UN VIDEO EN EL WINDOWS MEDIA PLAYER

      Ya hemos visto anterirmente cómo colocar en nuestro espacio un reproductor Windows Media Player. En él sólo se podía oír una canción o ver un video, pero gracias a un maestro de la informática (Diego 22000), podemos conseguir que suenen más de una canción o que se vean más de un video.
      Para ello hay que seguir los siguientes pasos:
       
      1º Abrir el Bloc de notas (Notepad), situado en Inicio/Programas/Accesorios/Bloc de notas
       
       

      Image Hosted by ImageShack.us

       
       
       
      2º Escribir el siguiente código dentro del Bloc de notas :
       
      <ASX VERSION="3.0">
      <ENTRY>
      <REF HREF="URL de la 1ª canción/video" />
      </ENTRY>
      <ENTRY>
      <REF HREF="URL de la 2ª canción/video" />
      </ENTRY>
      </ASX>
       
       Poner en el código la URL (dirección) de las canciones o d los videos.
       

      Ejemplo:

       

      Image Hosted by ImageShack.us

       

      3º Cuando ya esté escrito el código guardar utilizando la función Guardar como

      Para guardarlo correctamente es necesario que justo después del nombre que queramos ponerle al archivo escribamos .WMV (para los videos) ó .MP3 (para las canciones).

       Image Hosted by ImageShack.us

       

      4º Para que el reproductor funcione correctamente necesitas una URL (dirección del archivos que quieras reproducir). Para ello tienes que subir el archivo que has creado a una web de alojamiento. Por ejemplo: http://www.filelodge.com/

      Esta web nos facilitará la URL válida y necesaria para que pueda ser reproducido en el Windows Media Player de nuestro espacio.

      Copia la URL que le disponga la web y lo pegas en la casilla URL del módulo Windows Media Player. 

      5º Por último, cuando ya hayas pegado la URL en el módulo, pincha sobre la tecla Save, para guardar los cambios.

       

       

      NOTA:

      El código anterior es para dos canciones o dos videos. Si queremos colocar más de dos, sólo tenemos que pegar esta parte del código:

      <ENTRY>
      <REF HREF="URL de la canción/video" />
      </ENTRY>

      Justo antes de esta otra parte:

      </ASX>

      Y así sucesivamente, tantas veces como el número de canciones o videos que queramos poner.

      Ejemplo:

      <ASX VERSION="3.0">
      <ENTRY>
      <REF HREF="URL de la 1ª canción/video" />
      </ENTRY>
      <ENTRY>
      <REF HREF="URL de la 2ª canción/video" />
      </ENTRY>
      <ENTRY>
      <REF HREF="
      URL de la 3ª canción/video" />
      </ENTRY>
      <ENTRY>
      <REF HREF="
      URL de la 4ª canción/video" />
      </ENTRY>
      <ENTRY>
      <REF HREF="
      URL de la 5ª canción/video" />
      </ENTRY>
      </ASX>
      
      
      September 05

      VENTANA TIPO PIZARRA

      ¿Los textos simplemente escritos en el blog parecen muy aburridos? Pues este código, permite que escribas tu texto en una ventana tipo pizarra, logrando un toque muy original.
      El código es:
       
      <DIV align=left>
      <DIV style="BORDER-RIGHT: #cc9900 6px ridge; BORDER-TOP: #cc9900 6px ridge; FONT-SIZE: 9pt; Z-INDEX: 1; LEFT: 10px; OVERFLOW: visible; BORDER-LEFT: #cc9900 6px outset; WIDTH: 356px; LINE-HEIGHT: 10pt; BORDER-BOTTOM: #cc9900 6px inset; TOP: 296px; HEIGHT: 203px; BACKGROUND-COLOR: #336600" align=left>
      <P align=left>&nbsp;</P></DIV></DIV>
      <DIV align=left>
      <DIV style="BORDER-RIGHT: #cc9900 6px ridge; BORDER-TOP: #cc9900 0px ridge; Z-INDEX: 1; LEFT: 9px; BORDER-LEFT: #cc9900 6px outset; WIDTH: 356px; BORDER-BOTTOM: #cc9900 6px ridge; TOP: 423px; HEIGHT: 25px; BACKGROUND-COLOR: #996633" align=left>
      <P align=center><FONT face=細明體><B><FONT color=#99ccff>/&nbsp; </FONT><FONT color=#ffffff>/ </FONT><FONT color=#ff99ff>/ </FONT><FONT color=#ffff00>/ </FONT></B><FONT color=#c2ff86><B>/ </B></FONT><FONT face=細明體 color=#99ccff><B>    </B></FONT><FONT face=標楷體 color=#663300>██</FONT></FONT></P></DIV></DIV>
       
      Para conseguir colocar la pizarra tienes que abrir una entrada de blog, pinchar la casilla HTML y pegar el código. Posteriormente, vuelves a pinchar la casilla HTML y ya está listo para que escribas sobre ella.
      Para ello, sólo tienes que hacer doble clic sobre la pizarra y cuando aparezca un recuadro, escribir tu texto.
      Por último, cuando tengas terminado el blog, publicas la entrada.
       
      Este es el resultado:
       
       

       

       

      Es interesante, verdad. Así tus textos quedarán más originales.

       

      Es muy útil para decorar tus textos y, a su vez, tu blog.

      / / / /     ██

       

       

      NOTA:

      Puedes modificar el estilo, tamaño y color de las letras (fuente) desde la barra de herramientas del propio blog. Espero que te sea muy útil.

      EFECTO PARA LETRAS: EFECTO MASK

      Este nuevo codígo es para ofrecer a los textos otro efecto decorativo de manera que resulten más amenos y resultones.

      La forma de colocarlo es igual que los anteriores. Primero abrimos una entrada de blog, pinchamos la casilla HTML y pegamos el código.

      Volvemos a pinchar la casilla HTML .

      Para escribir tu texto, lo puedes hacer donde se lee TEXTO antes de pichar por segunda vez la casilla HTML o después haciendo doble clic en el recuadro de color sobre la palabra TEXTO.

      Cuando ya tengamos el blog listo, publicamos la entrada.

       

      El código es el siguiente:

      <span style="width: 100%; font-size: 24px; font-family: Arial Black; color: green; Filter: Mask(Color=#00FF00)">TEXTO</span

       

      Este es el reultado:

       

      ¿Qué te parece? Interesante, verdad.

       

      El mimso resultado, pero de distinto color y estilo de letra (fuente).

       

      NOTA:

      Como en los anteriores, los valores de color se pueden modificar cambiando el valor por el código del color que queramos. En anteriores blogs ya vimos una tabla con los códigos de los colores. En ella puedes encontrar el que necesites.También se puede cambiar el estilo de fuente, el tamaño y el color de la fuente desde la barra de herramientas del blog.

       

      August 30

      TABLAS PARA TUS TEXTOS

      Aquí os dejo otro código para colocar unas tablas para escribir tus textos con muchas posibilidades.
      Ofrece una oportunidad original de personalizar tus textos de una manera muy fácil.
       
       
      TABLA CON MENÚ
       
      <table class=MsoNormalTable border=1 cellspacing=0 cellpadding=0
       style='border-collapse:collapse;border:none;mso-border-alt:solid #003300 2.25pt;
       mso-padding-alt:0in 5.4pt 0in 5.4pt;mso-border-insideh:2.25pt solid #003300;
       mso-border-insidev:2.25pt solid #003300'>
       <tr style='mso-yfti-irow:0;mso-yfti-firstrow:yes;height:10.05pt;mso-row-margin-left:
        54.4pt;mso-row-margin-right:63.65pt'>
        <td style='mso-cell-special:placeholder;border:none;padding:0in 0in 0in 0in'
        width=73><p class='MsoNormal'>&nbsp;</td>
        <td width=23 style='width:17.6pt;border-top:none;border-left:none;border-bottom:
        solid #003300 2.25pt;border-right:solid #003300 2.25pt;padding:0in 5.4pt 0in 5.4pt;
        height:10.05pt'>
        <p class=MsoNormal align=center style='text-align:center'><o:p>&nbsp;</o:p></p>
        </td>
        <td width=180 colspan=2 rowspan=2 style='width:134.75pt;border:solid #003300 2.25pt;
        border-left:none;mso-border-left-alt:solid #003300 2.25pt;background:#B6D8A8;
        padding:0in 5.4pt 0in 5.4pt;height:10.05pt'>
        <p class=MsoNormal align=center style='text-align:center'><o:p>&nbsp;</o:p></p>
        </td>
        <td width=25 style='width:18.45pt;border:none;border-bottom:solid #003300 2.25pt;
        mso-border-left-alt:solid #003300 2.25pt;padding:0in 5.4pt 0in 5.4pt;
        height:10.05pt'>
        <p class=MsoNormal align=center style='text-align:center'><o:p>&nbsp;</o:p></p>
        </td>
        <td style='mso-cell-special:placeholder;border:none;padding:0in 0in 0in 0in'
        width=85><p class='MsoNormal'>&nbsp;</td>
       </tr>
       <tr style='mso-yfti-irow:1;height:16.75pt;mso-row-margin-left:54.4pt;
        mso-row-margin-right:63.65pt'>
        <td style='mso-cell-special:placeholder;border:none;padding:0in 0in 0in 0in'
        width=73><p class='MsoNormal'>&nbsp;</td>
        <td width=23 style='width:17.6pt;border-top:none;border-left:solid #003300 2.25pt;
        border-bottom:none;border-right:solid #003300 2.25pt;background:#658D49;
        padding:0in 5.4pt 0in 5.4pt;height:16.75pt'>
        <p class=MsoNormal align=center style='text-align:center'><o:p>&nbsp;</o:p></p>
        </td>
        <td width=25 style='width:18.45pt;border:none;border-right:solid #003300 2.25pt;
        mso-border-left-alt:solid #003300 2.25pt;background:#658D49;padding:0in 5.4pt 0in 5.4pt;
        height:16.75pt'>
        <p class=MsoNormal align=center style='text-align:center'><o:p>&nbsp;</o:p></p>
        </td>
        <td style='mso-cell-special:placeholder;border:none;padding:0in 0in 0in 0in'
        width=85><p class='MsoNormal'>&nbsp;</td>
       </tr>
       <tr style='mso-yfti-irow:2;height:15.95pt;mso-row-margin-right:63.65pt'>
        <td width=73 style='width:54.4pt;border-top:none;border-left:none;border-bottom:
        solid #003300 2.25pt;border-right:solid #003300 2.25pt;padding:0in 5.4pt 0in 5.4pt;
        height:15.95pt'>
        <p class=MsoNormal align=center style='text-align:center'><o:p>&nbsp;</o:p></p>
        </td>
        <td width=203 colspan=3 style='width:152.35pt;border:none;border-bottom:solid #003300 2.25pt;
        mso-border-left-alt:solid #003300 2.25pt;background:#658D49;padding:0in 5.4pt 0in 5.4pt;
        height:15.95pt'>
        <p class=MsoNormal align=center style='text-align:center'><o:p>&nbsp;</o:p></p>
        </td>
        <td width=25 rowspan=3 style='width:18.45pt;border-top:none;border-left:none;
        border-bottom:solid #003300 2.25pt;border-right:solid #003300 2.25pt;
        background:#658D49;padding:0in 5.4pt 0in 5.4pt;height:15.95pt'>
        <p class=MsoNormal align=center style='text-align:center'><o:p>&nbsp;</o:p></p>
        </td>
        <td style='mso-cell-special:placeholder;border:none;padding:0in 0in 0in 0in'
        width=85><p class='MsoNormal'>&nbsp;</td>
       </tr>
       <tr style='mso-yfti-irow:3;height:15.1pt;mso-row-margin-right:63.65pt'>
        <td width=276 colspan=4 style='width:206.75pt;border:solid #003300 2.25pt;
        border-top:none;mso-border-top-alt:solid #003300 2.25pt;background:#99CC00;
        padding:0in 5.4pt 0in 5.4pt;height:15.1pt'>
        <p class=MsoNormal align=center style='text-align:center'><o:p>&nbsp;</o:p></p>
        </td>
        <span style='font-size:12.0pt;font-family:"Times New Roman";mso-fareast-font-family:
        "Times New Roman";mso-ansi-language:EN-US;mso-fareast-language:EN-US;
        mso-bidi-language:AR-SA'>
        <td style='mso-cell-special:placeholder;border:none;padding:0in 0in 0in 0in'
        width=85><p class='MsoNormal'>&nbsp;</td>
        </span>
       </tr>
       <tr style='mso-yfti-irow:4;height:63.65pt;mso-row-margin-right:63.65pt'>
        <td width=73 style='width:54.4pt;border:none;border-right:solid #003300 2.25pt;
        mso-border-top-alt:solid #003300 2.25pt;padding:0in 5.4pt 0in 5.4pt;
        height:63.65pt'>
        <p class=MsoNormal align=center style='text-align:center'><o:p>&nbsp;</o:p></p>
        </td>
        <td width=203 colspan=3 style='width:152.35pt;border:none;border-bottom:solid #003300 2.25pt;
        mso-border-top-alt:solid #003300 2.25pt;mso-border-left-alt:solid #003300 2.25pt;
        background:#658D49;padding:0in 5.4pt 0in 5.4pt;height:63.65pt'>
        <p class=MsoNormal align=center style='text-align:center'><o:p>&nbsp;</o:p></p>
        </td>
        <span style='font-size:12.0pt;font-family:"Times New Roman";mso-fareast-font-family:
        "Times New Roman";mso-ansi-language:EN-US;mso-fareast-language:EN-US;
        mso-bidi-language:AR-SA'>
        <td style='mso-cell-special:placeholder;border:none;padding:0in 0in 0in 0in'
        width=85><p class='MsoNormal'>&nbsp;</td>
        </span>
       </tr>
       <tr style='mso-yfti-irow:5;height:13.4pt;mso-row-margin-left:54.4pt'>
        <td style='mso-cell-special:placeholder;border:none;padding:0in 0in 0in 0in'
        width=73><p class='MsoNormal'>&nbsp;</td>
        <td width=25 colspan=2 rowspan=3 style='width:18.45pt;border-top:none;
        border-left:solid #003300 2.25pt;border-bottom:solid #003300 2.25pt;
        border-right:none;mso-border-top-alt:solid #003300 2.25pt;background:#658D49;
        padding:0in 5.4pt 0in 5.4pt;height:13.4pt'>
        <p class=MsoNormal align=center style='text-align:center'><o:p>&nbsp;</o:p></p>
        </td>
        <td width=203 colspan=2 style='width:152.35pt;border:solid #003300 2.25pt;
        border-left:none;background:#658D49;padding:0in 5.4pt 0in 5.4pt;height:13.4pt'>
        <p class=MsoNormal align=center style='text-align:center'><o:p>&nbsp;</o:p></p>
        </td>
        <td width=85 style='width:63.65pt;border:none;border-bottom:solid #003300 2.25pt;
        mso-border-left-alt:solid #003300 2.25pt;padding:0in 5.4pt 0in 5.4pt;
        height:13.4pt'>
        <p class=MsoNormal align=center style='text-align:center'><o:p>&nbsp;</o:p></p>
        </td>
       </tr>
       <tr style='mso-yfti-irow:6;height:15.95pt;mso-row-margin-left:54.4pt'>
        <td style='mso-cell-special:placeholder;border:none;padding:0in 0in 0in 0in'
        width=73><p class='MsoNormal'>&nbsp;</td>
        <td width=288 colspan=3 style='width:3.0in;border:solid #003300 2.25pt;
        border-top:none;mso-border-top-alt:solid #003300 2.25pt;background:#99CC00;
        padding:0in 5.4pt 0in 5.4pt;height:15.95pt'>
        <p class=MsoNormal align=center style='text-align:center'><o:p>&nbsp;</o:p></p>
        </td>
       </tr>
       <tr style='mso-yfti-irow:7;height:89.6pt;mso-row-margin-left:54.4pt'>
        <td style='mso-cell-special:placeholder;border:none;padding:0in 0in 0in 0in'
        width=73><p class='MsoNormal'>&nbsp;</td>
        <td width=203 colspan=2 style='width:152.35pt;border-top:none;border-left:
        none;border-bottom:solid #003300 2.25pt;border-right:solid #003300 2.25pt;
        mso-border-top-alt:solid #003300 2.25pt;background:#658D49;padding:0in 5.4pt 0in 5.4pt;
        height:89.6pt'>
        <p class=MsoNormal align=center style='text-align:center'><o:p>&nbsp;</o:p></p>
        </td>
        <td width=85 style='width:63.65pt;border:none;mso-border-top-alt:solid #003300 2.25pt;
        mso-border-left-alt:solid #003300 2.25pt;padding:0in 5.4pt 0in 5.4pt;
        height:89.6pt'>
        <p class=MsoNormal align=center style='text-align:center'><o:p>&nbsp;</o:p></p>
        </td>
       </tr>
       <tr style='mso-yfti-irow:8;mso-yfti-lastrow:yes;height:16.75pt;mso-row-margin-left:
        54.4pt;mso-row-margin-right:63.65pt'>
        <td style='mso-cell-special:placeholder;border:none;padding:0in 0in 0in 0in'
        width=73><p class='MsoNormal'>&nbsp;</td>
        <td width=228 colspan=4 style='width:170.8pt;border:solid #003300 2.25pt;
        border-top:none;mso-border-top-alt:solid #003300 2.25pt;background:#99CC00;
        padding:0in 5.4pt 0in 5.4pt;height:16.75pt'>
        <p class=MsoNormal align=center style='text-align:center'><o:p>&nbsp;</o:p></p>
        </td>
        <td style='mso-cell-special:placeholder;border:none;padding:0in 0in 0in 0in'
        width=85><p class='MsoNormal'>&nbsp;</td>
       </tr>
       <![if !supportMisalignedColumns]>
       <tr height=0>
        <td width=73 style='border:none'></td>
        <td width=23 style='border:none'></td>
        <td width=1 style='border:none'></td>
        <td width=179 style='border:none'></td>
        <td width=25 style='border:none'></td>
        <td width=85 style='border:none'></td>
       </tr>
       <![endif]>
      </table>
       
       
      Este es el resultado:
       
       

       

      BIENVENIDOS

       

       

       

       

       

       

       

       

       

       

       LA SALITA DE DATREBIL

       

       

      TE AGRADECE LA VISITA Y ESPERA TU REGRESO. GRACIAS

       

       

       

       

       

       

       Puedes visitar LA SALITA DE DATREBIL en:

       

      http://spaces.msn.com/members/datrebil3spain/ 

       

       

       SALUDOS

       

       
       
       
      TABLA CON MENÚ
       
      <TABLE cellSpacing=0 cellPadding=5 width="95%" align=center border=0>
      <TBODY>
      <TR>
      <TD colSpan=2></TD></TR>
      <TR>
      <TD></TD>
      <TD></TD></TR>
      <TR>
      <TD colSpan=2><BR></TD></TR>
      <TR>
      <TD colSpan=2>&nbsp;
      <TABLE cellSpacing=0 cellPadding=0 width="100%" align=center border=1>
      <TBODY>
      <TR>
      <TD width="100%" colSpan=2>
      <TABLE cellSpacing=0 cellPadding=2 width="100%" border=1>
      <TBODY>
      <TR align=middle>
      <TD width="25%">menu</TD>
      <TD width="75%">menu</TD></TR></TBODY></TABLE></TD></TR>
      <TR>
      <TD align=middle width="100%" colSpan=2 height=10></TD></TR>
      <TR>
      <TD width="100%" colSpan=2>
      <TABLE width="100%" border=1>
      <TBODY>
       
       
      Este es el resultado:

       
      LA SALITA DE DATREBIL TUTORIALES PARA LOS SPACES MSN

        Es un placer recibir tu visita. Espero que los tutoriales que aquí puedes encontrar te resulten útiles.

      Por supuesto, tienes aquí un rincón dónde poder dejar tu sugerencias, dudas o comentarios.

        Vuelve cuando quieras, serás bien recibido. Gracias.

       

      NOTA:

      Para escribir en cada recuadro sólo tienes que pinchar dentro y comenzar a escribir.

      Puedes cambiar el color, el tamaño y el estilo de la fuente (letra) en la barra de herramientas del blog.

       

       

      Datrebil, Sevilla, Sat Sep 17 18:30:03 UTC+0200 2005

      TV PERSONALIZABLE

      El código que acontinuación se muestra sirve para colocar una televisión en cuya pantalla aparece un scrollbar (cuadro con flechas deslizantes), donde poder poner tus textos y tus imágenes. El código es personalizable, para ello sigue los pasos.

      El código es el siguiente:

       

      <DIV></DIV>
      <TABLE cellSpacing=0 width="100%" border=0>
      <TBODY>
      <TR>
      <TD></TD></TR>
      <TR>
      <TD></TD></TR>
      <TR>
      <TD>
      <DIV align=left>
      <TABLE height=222 cellSpacing=0 cellPadding=0 width=286 align=center border=0>
      <TBODY>
      <TR vAlign=top>
      <TD vAlign=top width=62 height=222>
      <TABLE cellSpacing=0 cellPadding=0 width="100%" border=0>
      <TBODY>
      <TR>
      <TD width="100%">
      <DIV align=left>
      <TABLE cellSpacing=0 cellPadding=0 width="100%" border=0>
      <TBODY>
      <TR>
      <TD width=105><IMG height=47 src="
      http://storage.msn.com/x1pxOYwqu4SjF6l4vbK9eOvkrZrxH0aX20ED-KEP6FyqbkhxKPPcy7xu4TETIz6NM5K8COylce9h0FxW5YThBkX23nj8aqijlBi5jPCdYoyNfJEJQKB5j4YP-5U4Fet56n3-e4LbR-YN9R0srS7hok6qQ" width=105></TD>
      <TD background=http://storage.msn.com/x1pxOYwqu4SjF6l4vbK9eOvkrZrxH0aX20ED-KEP6FyqblgL4wulRl5JzvEc8ZBFKNymwIyPGk3Gx70kFzHP9JeH_3KqAoAL52FH_6S57tTar8WsERJS0pERARUQgGsgdRULRFvit0hCpGsxi12Zw-TZA>
      <P align=center><FONT color=#999999><B><FONT size=2><FONT style="BACKGROUND-COLOR: #000000">NOMBRE DE TU ESPACIO</P></FONT></FONT></B></FONT></TD>
      <TD width=104><IMG height=47 src="
      http://storage.msn.com/x1pxOYwqu4SjF6l4vbK9eOvkrZrxH0aX20ED-KEP6Fyqbnjm3GX9i68icV2yZWIdhHxBh_IbiceGHzI_hgmjeLiD5PYCjKB71_86RvK6YOk6JVhZ6T3rkYcXZkLih-KtIaAGS2Jmh73ptJFR2asIrP_uQ" width=104></TD></TR></TBODY></TABLE></DIV></TD></TR>
      <TR>
      <TD width="100%">
      <DIV align=center>
      <TABLE height=116 cellSpacing=0 cellPadding=0 width="100%" border=0>
      <TBODY>
      <TR>
      <TD width=32 background=http://storage.msn.com/x1pxOYwqu4SjF6l4vbK9eOvkrZrxH0aX20ED-KEP6FyqbmgdEVKvZTqBukn11QOZkO_0IjrIVTbrVFFWPl_XX51agi_IfU0O2Fs7iqWV_quDJMOh9yqxAmAfAw368fdqJVOIxSvBF08gvynO96zHYfPOw height=116><IMG height=1 src="
      http://usuarios.lycos.es/gamekof/gif/archivos/blocke2_izq.gif" width=32 border=0></TD>
      <TD bgColor=#000000 height=116>
      <DIV align=center>
      <DIV style="BORDER-RIGHT: #111111 3px dotted; BORDER-TOP: #111111 3px dotted; SCROLLBAR-FACE-COLOR: #000000; SCROLLBAR-HIGHLIGHT-COLOR: #555555; OVERFLOW: auto; BORDER-LEFT: #111111 3px dotted; WIDTH: 312px; SCROLLBAR-SHADOW-COLOR: #111111; SCROLLBAR-3DLIGHT-COLOR: #111111; SCROLLBAR-ARROW-COLOR: #111111; BORDER-BOTTOM: #111111 3px dotted; SCROLLBAR-DARKSHADOW-COLOR: #111111; SCROLLBAR-BASE-COLOR: #111111; HEIGHT: 185px" align=center>
      <P><FONT color=#004377 size=6></FONT>&nbsp;</P>
      <P><FONT color=#004377 size=6><IMG style="WIDTH: 282px; HEIGHT: 156px" height=600 src="
      URL DE LA IMAGEN" width=800></FONT></P>
      <P><FONT color=#004377 size=2><FONT color=#004377 size=6><FONT color=#ff0000><FONT size=2>TEXTO</FONT></FONT></FONT></P>
      <P align=left><FONT color=#004377 size=6><FONT color=#ff0000 size=2>TEXTO </FONT></FONT></P>
      <P align=left><FONT color=#004377 size=6><FONT color=#ff0000 size=2>TEXTO</FONT></FONT></P>
      <P>&nbsp;</P></TD>
      <TD width=33 background=http://storage.msn.com/x1pxOYwqu4SjF6l4vbK9eOvkrZrxH0aX20ED-KEP6Fyqbm2yJxa_Sybk5KVU4KeuojTKBANAeW1Cm-PIF1hEhkVo3k-hqNtE-dRPFI7VZo0Etry-I0jrCJIU3JZc_PSYlffQwtAKUUDhCFPePzgJOz85A height=116><IMG height=1 src="
      http://usuarios.lycos.es/gamekof/gif/archivos/blocke2_der.gif" width=33 border=0></TD></TR></TBODY></TABLE></DIV></TD></TR>
      <TR>
      <TD width="100%">
      <DIV align=center>
      <TABLE cellSpacing=0 cellPadding=0 width="100%" border=0>
      <TBODY>
      <TR>
      <TD width=125><IMG height=57 src="
      http://storage.msn.com/x1pxOYwqu4SjF6l4vbK9eOvkrZrxH0aX20ED-KEP6Fyqbn0X_yn0u8lIQMGQJVdJ1OM1wHCsyKEKfbfuu5sOM7e4bZjCCBeOHvre4rtE1TEvtTRIQoYKgz0r6sTnoxQn8sS-b_Bmw97uwNBMReSI7vs6g" width=125></TD>
      <TD background=http://storage.msn.com/x1pxOYwqu4SjF6l4vbK9eOvkrZrxH0aX20ED-KEP6FyqbnhvqbU7uaCWhvIloQ4l3mIl5Nx6hwP6DHXfQDYXAStdM4PXANHbbB_uovB-oMWD289sWTDdG5HE8WMR38U7lcKicyKoJFNZR3_ECoMx3xwBg>
      <P align=center><FONT color=#000000><B><FONT size=2><FONT style="BACKGROUND-COLOR: #999999"><FONT style="BACKGROUND-COLOR: #999999"><FONT color=#000000></FONT>COMENTARIO SOBRE TU ESPACIO</FONT></B></FONT></P></FONT></TD>
      <TD width=136><IMG height=57 src="
      http://storage.msn.com/x1pxOYwqu4SjF6l4vbK9eOvkrZrxH0aX20ED-KEP6FyqbnhstYDz5sQzMZ9TqRkkGbMUA8maw0Yn2H-2tF9c58mbj6V_eP-IXhATGtJjye3xtwH_N4wmptAeVbt9dg7l6faLgPT6Acfw7V29FS-7dYCKA" width=136></TD></TR></TBODY></TABLE></DIV></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></DIV></TD></TR></TBODY></TABLE>
      <P align=left></P>

       

      La forma de usarlo es muy sencilla, similar al resto de los códigos.

      Primero abres una entrada de blog (Agregar entrada).

      Copia el código, pinchas en la casilla HTML de la barra de herramientas del blog y pega el código.

      A continuación personaliza el código con tus datos. Y seguidamente vuelves a pinchar la casilla HTML.

      Por último, una vez estés seguro de que todo está bien y hayas acabado, publica la entrada de blog.

      Este es el resultado:

       

      LA SALITA DE DATREBIL

       

      Hola compis !!

      ¿Qué os parece? Mola, ¿eh?

      Es una herramienta muy original que ofrece al tu espacio un toque más acogedor.

      Este código está recogido del espacio de Khorne.

      Espero que os sea útil.

      SALUDOS

      DATREBIL

       

       

      Entra y ponte cómod@

       

      NOTA:

      Como ya os dije antes, este código se puede personalizar. Para ello, sólo tienes que cambiar los datos en rojo por los tuyos.

      En el URL DE LA IMAGEN, tienes que poner la dirección del enlace que os ofrece la web donde tenéis que subir la imagen que queréis colocar.

      Lo demás que da claro, en NOMBRE DE TU ESPACIO, lógicamente debes poner el nombre de tu espacio o cualquier texto que quieras escribir. Igualmente pasa en COMENTARIO DE TU ESPACIO.

      August 28

      TABLAS PARA TEXTOS

      Estos códigos sirven para adornar los textos de nuestros blogs. Son tablas con fondos llenos de color y dinamismo.

      Estos son los códigos:

       

      TABLA CON FONDO DE FLORES:

      <TABLE style="WIDTH: 493px; HEIGHT: 25px" borderColor=#000000 cellSpacing=0 cellPadding=0 background=http://img306.imageshack.us/img306/4025/bkg6ma.gif border=1>
      <TBODY>
      <TR>
      <TD>
      <P align=center>&nbsp;</P></TD></TR></TBODY></TABLE>


       

       Este es el resultado.

      Puede escribir dentro de la

      tabla su texto,

      incluso puede insertar imágenes.

       

       

       

      TABLA CON FONDO DE GALAXIA:

      <TABLE style="WIDTH: 493px; HEIGHT: 25px" borderColor=#000000 cellSpacing=0 cellPadding=0 background=http://img306.imageshack.us/img306/6236/bkg33bf.jpg border=1>
      <TBODY>
      <TR>
      <TD>
      <P align=center>&nbsp;</P></TD></TR></TBODY></TABLE>
       

       

       Este es el resultado.

      El fondo de esta tabla es una

      galaxia.

      Interesante, ¿verdad?

       

       

      TABLA CON FONDEO DE SOL Y NUBES:

      <TABLE style="WIDTH: 493px; HEIGHT: 25px" borderColor=#000000 cellSpacing=0 cellPadding=0 background=http://img306.imageshack.us/img306/8072/bkg2nz.gif border=1>
      <TBODY>
      <TR>
      <TD>
      <P align=center>&nbsp;</P></TD></TR></TBODY></TABLE>
       

       Esta es otra tabla muy útil

      para decorar tus textos.

      Tu blog tendrá

      color y belleza.

       

      ¿Te gusta? 

       

       

       

       

       

      TABLA CON FONDO DE VIDRIERA:

      <TABLE style="WIDTH: 493px; HEIGHT: 25px" borderColor=#000000 cellSpacing=0 cellPadding=0 background=http://img306.imageshack.us/img306/5462/bkg79lu.gif border=1>
      <TBODY>
      <TR>
      <TD>
      <P align=center>&nbsp;</P></TD></TR></TBODY></TABLE>


       

       Esta tabla es muy original.

      Ofrece mucho colorido y dinamismo

      Es muy útil.

       

       

      August 25

      CÓDIGO DE EFECTO PARA LETRAS

      EFECTO MULTIDIMENSIONAL (por llamarlo de alguna forma)
       
      Ya vimos algunos códigos para ofrecer efectos interesantes para las fuentes (letras) de nuestros textos, pues este que os dejo ahora es otro para la misma función, ofreciendo un aspecto a los textos aún más impactante. Pues este código es el resultado de unir varios códigos que ya hemos visto anteriormente.
      El código que debéis pegar en la entrada de blog después de haber pinchado en la casilla HTML es:
       

      <FONT style="FILTER: wave(color=#ff0000,strength=1)shadow(direction=135,color=#1919B3,strength=8)shadow(direction=135,color=#ff3300,strength=8)dropshadow(direction=135,color=#ff0000,strength=8)glow(color=#FFff00,strength=4)shadow(color=#000000,strength=7,direction=135)dropshadow(color=#000000,strength=4)dropshadow(color=#ff0000,strength=4)glow(color=#00cc00,strength=4)shadow(color=#ffffff,direction=135,strength=3)dropshadow(color=#ffffff,strength=4)glow(color=#ff0000,strength=6)dropshadow(color=#ffff00,strength=4)glow(color=#000000,strength=1)dropshadow(color=#ff0000,strength=4)glow(color=#000000,strength=7)shadow(color=#000000,strength=10,direction=135); WIDTH: 537px; HEIGHT: 93px" face=creepy color=#ff3300 size=6>
      <P><I><FONT size=5><STRONG>&nbsp; "TEXTO" </STRONG></FONT></P>
      <P><STRONG></STRONG></P>
      <P><FONT size=5><STRONG></STRONG></FONT></P>
      <P><FONT size=5><STRONG></STRONG></FONT></P>

       

      Por último, volvemos a pinchar la casilla HTML y cuando esté terminado el blog, lo publicamos.

      Este es el resultado:

       

       

       

      EFECTO OVERFLOW

      Este código me lo ha proporcionado Almasys. El modo de uso es idéntico al anterior, pero en vez de pegar el código de arriba, pegamos este otro:

      <DIV style="FILTER: glow(color=darkviolet, strength=4); OVERFLOW: auto; WIDTH: 200px; HEIGHT: 100px"> <DIV align=center><FONT face="Lucida Handwriting, Cursive" color=#d7fcff size=2>TEXTO<STRONG>

      El resultado sería este:

        Hola, ¿qué te parece?

      ¿Te gusta? 

       EFECTO OVERFLOW

      Este código me lo ha proporcionado Almasys. El modo de uso es idéntico al anterior, pero en vez de pegar el código de arriba, pegamos este otro:

      <DIV style="FILTER: glow(color=darkviolet, strength=4); OVERFLOW: auto; WIDTH: 200px; HEIGHT: 100px"> <DIV align=center><FONT face="Lucida Handwriting, Cursive" color=#d7fcff size=3>TEXTO<STRONG>

      El resultado sería este:

       

      AQUÍ TIENEN OTRO EFECTO. QUÉ LES PARECE.

      NOTA:

      Donde se lee TEXTO, es donde debemos escribir aquello que deseemos.

      El tamaño de las letras se puede cambiar desde la barra de herramientas del propio blog.

      Al igual que con los otros códigos, los valores de color se pueden modificar. Para ello sólo tenéis que cambiar los códigos de color por el del color que prefiráis. Estos códigos de color lo podéis encontrar aquí:

       

      August 23

      EFECTOS PARA IMÁGENES

      Los siguientes códigos son similares a los que usamos para dar efectos a los textos, pero ahora es para las imágenes.

      Del mismo modo, para activar los códigos debemos pinchar en la casilla HTML dentro de una entrada de blog, pegar el código y volver a pinchar la casilla HTML.

      URL DE LA IMAGEN EJEMPLO:

      " http://img431.imageshack.us/img431/8030/clownglobos3jo.gif "  (sin comillas)

       

      EFECTO GLOW

       

      <DIV style="FILTER: Glow(strength=12,color=#FF0000); WIDTH: 100px; HEIGHT: 100px" align=center><BR><IMG height=100 src="URL DE LA IMAGENwidth=100 border=0></DIV>

       

      Este es el resultado:


       
       
      NOTA:
      El valor color, escrito en azul, se puede variar por el código de color que queramos.
      El valor strength es el grosor de la sombra de la imagen, podemos modificarla a nuestro gusto.
       
       
      EFECTO SHADOW
       
      <DIV style="FILTER: Shadow(direction=135,color=FF6633); WIDTH: 100px; HEIGHT: 100px" align=center><BR><IMG height=100 src="URL DE LA IMAGEN" width=100 border=0></DIV>
       
      Este es el resultado:

       


       
       
       
      EFECTO DROPSHADOW
       
      <DIV style="FILTER: Dropshadow(offX=5,offY=5,color=#F7F709); WIDTH: 100px; HEIGHT: 100px" align=center><BR><IMG height=100 src="URL DE LA IMAGEN" width=100 border=0></DIV>
       
      Este es el resultado:

       
       
       
      EFECTO ALPHA (OPACITY)
       

      <DIV style="FILTER: Alpha(opacity=100,finishOpacity=0,style=2); WIDTH: 100px; HEIGHT: 100px"><IMG height=100 src="URL DE  LA IMAGEN" width=100 border=0></DIV>

       

      Este es el resultado:

       
       
       
      EFECTO GRAY
       
      Este es el resultado:
       
       
       
      EFECTO ALPHA - GRAY
       
      <DIV style="FILTER: Gray(); WIDTH: 100px; HEIGHT: 100px">
      <DIV style="FILTER: Alpha(opacity=100,finishOpacity=0,style=2); WIDTH: 100px; HEIGHT: 100px"><IMG height=100 src="URL DE LA IMAGEN" width=100 border=0></DIV></DIV>

       

      Este es el resultado:

       
      EFECTO XRAY (RAYOS X)
       
      <DIV style="FILTER: Xray(); WIDTH: 100px; HEIGHT: 100px"; WIDTH: 100px; HEIGHT: 100px"><IMG height=100 src="URL DE LA IMAGEN" width=100 border=0></DIV></DIV>

       

      Este es el resultado:

       

       
       
      EFECTO INVERT (NEGATIVO)
      <DIV style="FILTER: Invert(); WIDTH: 100px; HEIGHT: 100px"><IMG height=100 src="URL DE LA IMAGEN" width=100 border=0></DIV>

       
      Este es el resultado:
       
       
      EFECTO FLIPH
       
      <DIV style="FILTER: FlipH(); WIDTH: 100px; HEIGHT: 100px"><IMG height=100 src="URL DE LA IMAGEN" width=100 border=0></DIV>

       

      Este es el resultado:


      View more entries