Codigos html para blog parte 2

7

Click here to load reader

Transcript of Codigos html para blog parte 2

Page 1: Codigos html para blog parte 2

Ing Yorladis Alzate Gallego

CODIGOS HTML PARA BLOG – SEGUND PARTE 2010

CAMBIAR EL ESTILO DEL CURSOR

1- Ingresa al siguiente link:

http://www.creatupropiaweb.com/recursos/utilidadess_gratuitas_para_

tu_blog_y_web_cursores.htm

2- Selecciona el código del cursor que te guste

3- Ingresa al blog y haz clic en la pestaña diseño, luego busca el enlace

"Edicion Html"

4- Busca la Etiqueda de fin de <Head> </Head> (esto significa que se esta

cerrando el cuerpo de la página)

5- Guarda la plantilla y revisa el blog

Page 2: Codigos html para blog parte 2

Ing Yorladis Alzate Gallego

CODIGOS HTML PARA BLOG – SEGUND PARTE 2010

AÑADIR UN ARCHIVO DE SONIDO AL BLOG

Debes tener un sitio en el cual puedas subir tus archivos de audio en

formato .mid o .mp3, para ello existen diversidad de páginas, vamos a

trabajar con el sitio www.goear.com . Esta página requiere que te registres.

1- Haz clic en el link de goear

2- Haz clic en Registrarme

3- Llena el formulario con tus datos

Page 3: Codigos html para blog parte 2

Ing Yorladis Alzate Gallego

CODIGOS HTML PARA BLOG – SEGUND PARTE 2010

4- Cuando hayas ingresado con tu usuario y contraseña, haz clic en el botón

SUBE TU MUSICA

5- Llena la información de la música que vas a subir, haz clic en examinar

para subir el archivo de audio, acepta los términos y clic en SUBIR

MUSICA.

Page 4: Codigos html para blog parte 2

Ing Yorladis Alzate Gallego

CODIGOS HTML PARA BLOG – SEGUND PARTE 2010

6- Cuando el archivo sube, el programa nos

informa de ello, con el siguiente mensaje

7- Haz clic sobre el enlace Escuchar ahora

El archivo, lo puedes agregar en redes sociales ( )

Insertar comentarios ( )

Compartir el enlace o colocar la canción en la web ( )

AHORA VAMOS A PONER LA CANCION EN EL BLOG

1- Crea una entrada

2- Haz clic en “Edición Html”

3- Copia y pega el código html del disco

4- Publica la entrada.

1

1

2

2

3

3

Page 5: Codigos html para blog parte 2

Ing Yorladis Alzate Gallego

CODIGOS HTML PARA BLOG – SEGUND PARTE 2010

1. TEXTO ANIMADO

Crea un gadget de html y copia el siguiente código:

<style type="text/css">

#frm {

position: relative;

height: 150px;

width:630px;

font-size: 1.8em;

font-weight: bold;

font-family: verdana, arial;

background: transparent;

overflow: hidden;

padding: 0.5em}

#frm span {

position: relative;

text-align: center;

z-index: 1;

color:#ffffff;

}

#mtxform {

position: relative;

z-index: 10;

}

.hidden {

visibility: hidden;

}

</style><script style="text/javascript"

src="http://dl.dropbox.com/u/3173073/HacksBlogger/texto-animado.js">

</script>

<div id="frm"></div>

<form id="mtxform" name="mtxform"><button id="show" class="hidden"

onclick="mtx.show();" type="button">Replay</button><span id="inputext"

class="hidden"><textarea id="text" rows="0" cols="0" name="text">

ESCRIBE EL TEXTO QUE QUIERES ANIMAR AQUI

Page 6: Codigos html para blog parte 2

Ing Yorladis Alzate Gallego

CODIGOS HTML PARA BLOG – SEGUND PARTE 2010

</textarea><button onclick="mtx.changeText();"

type="button">Play</button><input type="RESET" /></span></form>

2. BANNERS

Si quieres que en tu pagina salga un banner puedes hacer lo siguiente

Para que salga una palabra y al hacer clic nos lleve a la dirección url. Copia el

siguiente código en un gadget con Html

<marquee direction="up" style="text-align: center;

width:200px;height:150px;border:1px solid #ccc;padding:3px"

onmouseover="this.scrollAmount='0'" scrollamount="1"

onmouseout="this.scrollAmount='2'">

<a href="URL del enlace 1">Nombre del enlace 1</a><br/>

</marquee>

Reemplaza el texto azul por la dirección de la página y el texto en rojo po el

texto que se verá deslizando. Puedes hacer varios enlaces.

Page 7: Codigos html para blog parte 2

Ing Yorladis Alzate Gallego

CODIGOS HTML PARA BLOG – SEGUND PARTE 2010

3. CALENDARIOS

Si quieres añadir calendarios a tu blog accede a esta página en un gadget de

HTML copia el código del calendario que te guste.

http://www.widgetsi.com/calendarios-web-paisajes.php

También revisa los gadgets que en esta página para que hagas de tu blog un

sitio divertido.