¡sara gutierrez

lunes, 22 de octubre de 2012

hloa amigos y amigas hoy les traigo plantillas y como poner musica en su blog etc...
primer paso instrucciones:1. Selecciona la plantilla MINIMA
2. Añade un gadget HTML/Javascript.
3. Copia el código que indica la entrada de la plantilla.
4. Guardar
aqui van las plantillas y la musica y ecetera

Plantilla 209

CÓDIGO 2 COLUMNAS:

CÓDIGO 3 COLUMNAS: *** PROXIMAMENTE ***

PLANTILLA 208

CÓDIGO 2 COLUMNAS:

CÓDIGO 3 COLUMNAS:

Plantilla 209

CÓDIGO 2 COLUMNAS:

CÓDIGO 3 COLUMNAS: *** PROXIMAMENTE ***

Plantilla 208

Créditos: Imagen de fondo ©Enchanted Stock @ http://enchanted-stock.deviantart.com/

CÓDIGO 2 COLUMNAS:

CÓDIGO 3 COLUMNAS:

Crear una lista de reproducción con Mixpod

En este tutorial voy a mostraros como crear una lista de reproducción con Mixpod. (http://www.mixpod.com/)

Lo primero será ir a su web y registrarnos pulsando en el botón que dice "Sign Up":

(Haz clic en las imágenes para verlas más grandes)

Rellena el formulario y pulsa el botón verde de abajo:

Una vez registrados ya podremos crear nuestra primera lista de música. Para ello, pulsamos donde dice "Create Playlist":

Escribimos el nombre del artista o título que queramos buscar y pulsamos "search" para que empiece a buscar. Nos saldrá una lista donde encontraremos principalmente videos, aunque también suele haber audios. Podéis escucharlos para ver si el sonido es bueno o si se corresponde con el tema deseado.

Una vez elegido el tema, si pulsamos en el "+" se añadirá a nuestra lista y aparecerá justo debajo del reproductor de video que aparece por defecto.

Seguid añadiendo canciones a vuestro antojo.

Una vez tenemos todas las canciones que vayamos a meter, vamos a personalizar nuestro reproductor. Pare ello pulsamos en "Customize":

En esta pantalla veremos todos los reproductores que hay. Algunos reproducen video, y otros sólo el sonido. Tened en cuenta el tamaño del reproductor a la hora de escoger uno, pues si es muy ancho, no entraría en vuestra columna lateral y quedaría feo.

Una vez escogido, podréis cambiar el color y estilo pulsando donde dice "Colors and Styles" y los ajustes de reproducción en "Settings":

Por último vamos a guardar nuestra lista pulsando en el botón "Save Playlist". Aquí lo único obligatorio es el título que queremos darle a esta lista. Una vez puesto el nombre, pulsamos el botón verde de abajo que dice "Save (get code)" y aparecerá la pantalla con los códigos para varios sitios:

En nuestro caso, elegiremos la pestaña que dice "Blogger" y nos mostrará el código que necesitamos poner en nuestro blog.

Con sólo pinchar una vez dentro del recuadro del código, se seleccionará todo. Lo copiamos (botón derecho del ratón > copiar) y nos vamos al panel de diseño de nuestro blog.

Una vez en el panel de diseño, añadiremos un nuevo gadget HTML/JAVASCRIPT y pegamos allí el código.

Guardamos el gadget, y listo, ya tenemos música en nuestro blog.

Nota: Por defecto, si no cambiáis nada en los ajustes de la lista, el reproductor empezará sólo, pudiéndose escuchar la música automáticamente. Si preferís que no comience la música de forma automática, y que sean vuestros visitantes quienes decidan si ponerla o no, tendréis que poner "No" en el autoplay de los ajustes de la lista de reproducción:

O bien, en el código de nuestro gadget cambiar donde dice "True" y poner "False" :

agrega tus propios emoticonos a tu blog

Muchos bloggers buscan agregar emoticones en su blog,pero para ello dependen de blogs de ayuda bloggers para poner emoticones en sus blogs pero hoy les voy a enseñar como agregar sus propios emoticones a sus blogs.

El siguiente codigo corresponde al script que utilizaremos para hacer el llamado del emoticon al blog:

*/


function emoticonComentario() {

if(!document.getElementById) {return;} // no soportado

bodyText = document.getElementById('comments');

emoticon = bodyText.innerHTML;

// :) :-) :-]
emoticon = emoticon.replace(/:\)/g,'<img src="http://static.mobile9.com/bbcode/smileys/smile.gif" />');
emoticon = emoticon.replace(/:-\)/g,'<img src="http://static.mobile9.com/bbcode/smileys/smile.gif" />');
emoticon = emoticon.replace(/:-\]/g,'<img src="http://static.mobile9.com/bbcode/smileys/smile.gif" />');

// X(
emoticon = emoticon.replace(/X\(/g,'<img src="http://static.mobile9.com/bbcode/smileys/tongue.gif" />');


// :cool:
emoticon = emoticon.replace(/:cool:/g,'<img src="http://static.mobile9.com/bbcode/smileys/wink.gif" />');

// :cry:
emoticon = emoticon.replace(/:cry:/g,'<img src="http://static.mobile9.com/bbcode/smileys/laugh.gif" />');


// :blaf:
emoticon = emoticon.replace(/:blaf:/g,'<img src="http://static.mobile9.com/bbcode/smileys/frown.gif" />');

// :winky:
emoticon = emoticon.replace(/:winky:/g,'<img src="http://static.mobile9.com/bbcode/smileys/thumbup.gif" />');

// :noo:
emoticon = emoticon.replace(/:noo:/g,'<img src="http://static.mobile9.com/bbcode/smileys/blush.gif" />');

// :twisted:
emoticon = emoticon.replace(/:twisted:/g,'<img src="http://static.mobile9.com/bbcode/smileys/byebye.gif" />');

Lo que esta en azul corresponde a la URL del emoticon,alli es donde debes poner la URL de tu emoticon (en la primera parte del codigo tienes que repetir la URL de la imagen 3 veces,de aqui en adelante solo tendras que poner la URL solo una vez).

Lo que esta en rojo corresponde al codigo que se utilizara en los comentarios para que aparezca el emoticon.

Luego guardas el archivo en un editor de texto (ej. Bloc de Notas) con extension .js y lo subes a un hosting como Dropbox o Google Sites,alli te dan la URL y la tendras que pegar antes de </body> siguiendo la siguiente estructura.

<b:if cond='data:blog.pageType == "item"'>
<script src='URL DEL ARCHIVO .JS' type='text/javascript'/>
<script type='text/javascript'>
emoticonComentario();
</script>
</b:if>

Con esto ya tendras listo los emoticones pero ahora hace falta mostrar una lista de los emoticones para que los lectores los puedan usar.

<b:if cond='data:blog.pageType == "item"'>
<div class='divspoiler'>
<img onclick='if (this.parentNode.nextSibling.childNodes[0].style.display != '') { this.parentNode.nextSibling.childNodes[0].style.display = ''; } else { this.parentNode.nextSibling.childNodes[0].style.display = 'none';}' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhc3l8FC5meptbeKx_FQMMcyL8onKRRDvVlV5DC8F_Jaw0O1_fPArXqLVLrp1Fqylmd8p75CDxGu4QfYEDNtqE2FLLVtFM77h1zyKfYru-uJpHn7Njy1kFgy0MOHpBgYYQZNLOkocsVqfI/s1600/Sin+t%C3%ADtulo-1.png'/>
</div><div><div class='spoiler' style='display: none;'>
<div class='comment-content' id='bc_0_1MC'>
<img src='http://static.mobile9.com/bbcode/smileys/smile.gif'/> :) <img src='http://static.mobile9.com/bbcode/smileys/tongue.gif'/> X( <img src='http://static.mobile9.com/bbcode/smileys/wink.gif'/> :cool: <img src='http://static.mobile9.com/bbcode/smileys/laugh.gif'/> :cry: <img src='http://static.mobile9.com/bbcode/smileys/frown.gif'/> :blaf: <img src='http://static.mobile9.com/bbcode/smileys/thumbup.gif'/> :winky: <img src='http://static.mobile9.com/bbcode/smileys/blush.gif'/> :noo: <img src='http://static.mobile9.com/bbcode/smileys/byebye.gif'/> :twisted: <img src='http://static.mobile9.com/bbcode/smileys/clapping.gif'/>:D <img src='http://static.mobile9.com/bbcode/smileys/wow.gif'/> :oops: <img src='http://static.mobile9.com/bbcode/smileys/help.gif'/> :? <img src='http://static.mobile9.com/bbcode/smileys/devil.gif'/> :F
<img src='http://static.mobile9.com/bbcode/smileys/wub.gif'/> :alaba: <img src='http://static.mobile9.com/bbcode/smileys/cry.gif'/>:lpmqtp: <img src='http://static.mobile9.com/bbcode/smileys/thumbdown.gif'/> :idiot:</div>

</div></div>
</b:if>

Lo que esta resaltado en verde es la URL del emoticon y lo que esta en rosa es el codigo del emoticon.

El anterior codigo lo deberas pegar debajo de

<div class='post-footer-line post-footer-line-3'>

Con esto ya hemos terminado el tutorial y tendras listo tus emoticones ,espero que les haya sido de utilidad.

poner una camara de vigilancia en tu blog

Andando en la web me encontre con este peculiar gadget el cual muestra una pequeña camara de vigilancia en la parte superior del blog,a mi modo de ver simula muy bien una verdadera camara,la camara se ve la siguiente manera,

Para agregar este gadget no vamos a Diseño,Elementos de pagina,Añadir gadget,HTML Javascript y pegas el siguiente codigo.

<br /> <div style="text-align: center;"><a href="http://miltrucosblogger.blogspot.com/2011/07/poner-una-camara-de-vigilancia-en-tu.html" _fcksavedurl="" style="right: 0px; position: fixed; top: 0px;"><img src="http://1.bp.blogspot.com/-MVAyxEb1Gk0/ThtUzuB5AkI/AAAAAAAADU4/RcEFHCFFvXA/s1600/camaras01pe3.gif" _fcksavedurl="http://1.bp.blogspot.com/-MVAyxEb1Gk0/ThtUzuB5AkI/AAAAAAAADU4/RcEFHCFFvXA/s1600/camaras01pe3.gif" alt="" /></a></div>

Por ultimo guardas.

gadget(gracias por tu visita) con imagen de bart

Bueno he creado un bonito gadget exclusivamente para mis lectores,es 100% hecho por Juvinao osea su servidor.
El gadget consta de una bonita imagen que dice Gracias por tu visita para hacer mas vivo el gadget va acompañado de Bart Simpson

La imagen es la siguiente:

Copia y pega el siguiente código en tu blog :

Para instalarlo deberás ir a Diseño->Elementos de página->Añadir un gadget->HTML/Javascript. En él deberás pegar el código de arriba

corazòn volando por el blog

El resultado del truco lo puedes ver este blog de pruebas.

Para añadir este truco ve a la Edicion HTML de tu blog y antes de </head> pega el siguiente script.

<script type='text/javascript'>
//<![CDATA[
/***********************************************
* Corazón volando por el blog
* Script original de Virtual_Max
* Adaptado por miltrucosblogger.info
***********************************************/
var vmin=1;
var vmax=5;
var vr=2;
var timer1;
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body}
function Chip(chipname,width,height){
this.named=chipname;
this.vx=vmin+vmax*Math.random();
this.vy=vmin+vmax*Math.random();
this.w=width+20;
this.h=height;
this.xx=0;
this.yy=0;
this.timer1=null;}
function movechip(chipname){
if (document.getElementById){
eval("chip="+chipname);
if (window.innerWidth || window.opera){
pageX=window.pageXOffset;
pageW=window.innerWidth-40;
pageY=window.pageYOffset;
pageH=window.innerHeight-20;}
chip.xx=chip.xx+chip.vx;
chip.yy=chip.yy+chip.vy;
chip.vx+=vr*(Math.random()-0.5);
chip.vy+=vr*(Math.random()-0.5);
if(chip.vx>(vmax+vmin)) chip.vx=(vmax+vmin)*2-chip.vx;
if(chip.vx<(-vmax-vmin)) chip.vx=(-vmax-vmin)*2-chip.vx;
if(chip.vy>(vmax+vmin)) chip.vy=(vmax+vmin)*2-chip.vy;
if(chip.vy<(-vmax-vmin)) chip.vy=(-vmax-vmin)*2-chip.vy;
if(chip.xx<=pageX){
chip.xx=pageX;
chip.vx=vmin+vmax*Math.random();}
if(chip.xx>=pageX+pageW-chip.w){
chip.xx=pageX+pageW-chip.w;
chip.vx=-vmin-vmax*Math.random();}
if(chip.yy<=pageY)
{chip.yy=pageY;
chip.vy=vmin+vmax*Math.random();}
if(chip.yy>=pageY+pageH-chip.h)
{chip.yy=pageY+pageH-chip.h;
chip.vy=-vmin-vmax*Math.random();}
document.getElementById(chip.named).style.left=chip.xx+"px";
document.getElementById(chip.named).style.top=chip.yy+"px";
chip.timer1=setTimeout("movechip('"+chip.named+"')",100);}}
function pagestart(){
CupidoVolando=new Chip("CupidoVolando",147,168);
movechip("CupidoVolando");}
if (window.addEventListener)
window.addEventListener("load", pagestart, false)
else if (window.attachEvent)
window.attachEvent("onload", pagestart)
else if (document.getElementById)
window.onload=pagestart
//]]>
</script>

Ahora antes de </body> pega lo siguiente:

<div id='CupidoVolando' style='position:absolute; z-index:80; left: -500px;'>
<img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVRL2AriyxJWkZu839QXrhJddQGZJg4Zzo0Wl6_XFdonRav3D00qaaTVUOMPoYaY4IlMrLK0vY-wOSv70qd7JVF6hM14Qj7W9d-jz3HZTgSIQ-9iQhE5DRT1KurkurmvTmQZ5FMtt1kXE/s1600/corazon-con-alas.gif'/></div>

Si quieres mas corazones en esta pagina los puedes hallar.

El truco funciona con todos los navegadores a excepcion de Internet Explorer (Como siempre).

rosas que caen y se desvanecen en el blog

he decidido crear un sencillo pero genial truco en el que se ven unas rosas que caen y se desvanecen en el blog.

En el truco se vera la siguiente rosa.

Para agregar este truco ve a Diseño | Añadir un gadget | HTML/Javascript y alli pegas lo siguiente:

<script>
/***** Rosas cayendo en el blog *****/
if(typeof $pdj=='undefined'){document.write('<'+'script');document.write(' language="javascript"');document.write(' type="text/javascript"');document.write(' src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js">');document.write('</'+'script'+'>')}</script><script>if(typeof $pdj=='undefined'){var $pdj=jQuery.noConflict()}if(!image_urls){var image_urls=Array()}if(!flash_urls){var flash_urls=Array()}image_urls['corazon']="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEho2YrHObPegc86SrPR6jflLWBch9vAsck0p891gnBpxvTLvBHnrb0apigxuCa2Lcr2imIM-UOyWmFNLU3ai3WRLNyN1mHVwSSwQrd2Eo7ZmOBdSzm4LcY17WP8R5OFE4L_OVW4Qlh5I4o/s1600/LH00CE0T.gif";$pdj(document).ready(function(){var c=$pdj(window).width();var d=$pdj(window).height();var e=function(a,b){return Math.round(a+(Math.random()*(b-a)))};var f=function(a){setTimeout(function(){a.css({left:e(0,c)+'px',top:'-30px',display:'block',opacity:'0.'+e(10,100)}).animate({top:(d-10)+'px'},e(8500,10000),function(){$pdj(this).fadeOut('slow',function(){f(a)})})},e(1,9000))};$pdj('<div></div>').attr('id','corazonDiv').css({position:'fixed',width:(c-20)+'px',height:'1px',left:'0px',top:'-5px',display:'block'}).appendTo('body');for(var i=1;i<=15;i++){var g=$pdj('<img/>').attr('src',image_urls['corazon']).css({position:'absolute',left:e(0,c)+'px',top:'-30px',display:'block',opacity:'0.'+e(10,100),'margin-left':0}).addClass('corazonDrop').appendTo('#corazonDiv');f(g);g=null};var h=0;var j=0;$pdj(window).resize(function(){c=$pdj(window).width();d=$pdj(window).height()})});</script>

Por ultimo guardas los cambios y listo. Puedes ver el truco en este blog de pruebas.

Recuerda que el truco utiliza libreria jQuery asi que si no funciona ten en cuenta que se debe a la version que usas de jQuery.

globos que caen y se desvanecen en el blog

Muchos bloggers buscan darle a su blog un aspecto diferente cuando este esta de aniversario,y aunque pueden haber muchos trucos en la red para darle un toque especial al blog ninguno es como el que les voy a presentar hoy en el cual unos hermosos globos van cayendo y poco a poco se van desvaneciendo.

En el truco se vera el siguiente globo.

Para agregar este truco ve a Diseño | Añadir un gadget | HTML/Javascript y alli pegas lo siguiente:

    <script>
    /***** Globos cayendo en el blog *****/
    if(typeof $pdj=='undefined'){document.write('<'+'script');document.write(' language="javascript"');document.write(' type="text/javascript"');document.write(' src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js">');document.write('</'+'script'+'>')}</script><script>if(typeof $pdj=='undefined'){var $pdj=jQuery.noConflict()}if(!image_urls){var image_urls=Array()}if(!flash_urls){var flash_urls=Array()}image_urls['corazon']="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4-zFNPKqYsYRHPhN0lAyOzLzPObYWL9bPGdNka4fNbtMZkYJbGZMCbiapNM5GfgC-W9lI0J8PNIIsBBkgC1ewNIUr00edsQ2alSed5RSy2EO02hOlp5iayaDDxB9BcGJu6-XReSnoSpo/s1600/globos-10.gif";$pdj(document).ready(function(){var c=$pdj(window).width();var d=$pdj(window).height();var e=function(a,b){return Math.round(a+(Math.random()*(b-a)))};var f=function(a){setTimeout(function(){a.css({left:e(0,c)+'px',top:'-30px',display:'block',opacity:'0.'+e(10,100)}).animate({top:(d-10)+'px'},e(8500,10000),function(){$pdj(this).fadeOut('slow',function(){f(a)})})},e(1,9000))};$pdj('<div></div>').attr('id','corazonDiv').css({position:'fixed',width:(c-20)+'px',height:'1px',left:'0px',top:'-5px',display:'block'}).appendTo('body');for(var i=1;i<=15;i++){var g=$pdj('<img/>').attr('src',image_urls['corazon']).css({position:'absolute',left:e(0,c)+'px',top:'-30px',display:'block',opacity:'0.'+e(10,100),'margin-left':0}).addClass('corazonDrop').appendTo('#corazonDiv');f(g);g=null};var h=0;var j=0;$pdj(window).resize(function(){c=$pdj(window).width();d=$pdj(window).height()})});</script>