Búscanos y Siguenos en:

Mostrando entradas con la etiqueta Programacion. Mostrar todas las entradas

Mostrando entradas con la etiqueta Programacion. Mostrar todas las entradas
Mostrando entradas con la etiqueta Programacion. Mostrar todas las entradas

Adobe Dreamweaver CS5.5
{[['', '']]}

[starttext]Adobe Dreamweaver es un editor de HTML visual, diseñado para desarrolladores profesionales. Dreamweaver hace muy fácil el crear complejas páginas Web dinámicas, con la conocida técnica de "arrastrar y soltar", permitiendo que los diseñadores puedan crear entornos Web sin tener que escribir una sóla linea de código.

Adobe Dreamweaver es compatible con las últimas tecnologías y tendencias en el desarrollo web, incluyendo Javascript, CSS, AJAX, XHTM, Adobe AIR, Smart Objects de Photoshop, subversiones (SVN), frameworks Javascript y un largo etcétera.

La compatibilidad con los diversos navegadores no será un problema con Adobe Dreamweaver gracias a la tecnología Live View (una especie de vista previa) y con la ayuda de Adobe BrowserLab, un servicio online con el que comparar cómo se ve tu página en distintos navegadores.

Adobe Dreamweaver está mejor preparado que nunca las últimas tendencias, y tiene un excelente soporte para CMS como Wordpress, Joomla! y Drupal.
En resumen, Adobe Dreamweaver es al diseño web lo que la rueda es al automóvil: imprescindible.[endtext]
[des]http://www.adobe.com/go/trydreamweaver[/des]
read more

Como poner el widged de raciones en nuestra plantilla de blogger.
{[['', '']]}

Para que  aparezca el widged de reaciones en cada post o entrada en blogger solo tenéis que seguir los siguientes pasos:
  1. Tenéis que entrar en blogger con vuestra cuenta y a continuación, ir al código de la plantilla y expandir los artilugios.
    Home → Diseño → Edición de HTML → Expandir plantillas de artilugios
  2. Tenéis que buscar la siguientes entrada dentro de vuestra plantilla:
    • class='post-footer-line post-footer-line-1'
    • class='post-footer-line post-footer-line-2' suele contener la lista de etiquetas.
    • class='post-footer-line post-footer-line-3' muchas veces no tiene uso.
    Una vez que ya las tenemos localizadas pondremos el siguiente codigo dentro de una de ellas o si  lo prefieren pueden crear una entrada nueva con el mismo testo solo que canbiando el numero.

    <div class='reaction-buttons'>
        <b:if cond='data:top.showReactions'>
          <table border='0' cellpadding='0' width='100%'><tr>
          <td nowrap='nowrap' valign='center' width='1%'>
            <span class='reactions-label'><data:top.reactionsLabel/></span>
          </td>
          <td>
            <iframe allowtransparency='true' class='reactions-iframe' expr:src='data:post.reactionsUrl' frameborder='0' name='reactions' scrolling='no' textColor='#fff'/>
          </td>
          </tr></table>
        </b:if>
      </div>

    Aunque el estilo de este script es poco modificable, algunas de ellas podemos modificarlas si agregamos las los siguienetes estilos ccs en la plantilla, justo antes de </b:skin>:

    .reaction-buttons {
      /* es el área donde se muestra */
    }
    
    /* como todo esta una tabla, estas on las posibles definiciones */
    .reaction-buttons table { ... }
    .reaction-buttons table td { ... }
    
    .reactions-label { /* el texto Reacciones */
      margin:3px 0 0; /* es la propiedad por defecto */
    }
    .reactions-iframe { /* es el iframe */
      /* tiene alguna propiedades por defecto  */
      background: transparent none repeat scroll 0 0;
      border: 0 none;
      height: 2.3em;
      width: 100%;
    }

    Una vez que ya temos todo hecho solo tenemos que ir a:

    Home → Diseño →Elementos de la página →

    Una vez hay vamos al widged de Entradas del blog y le damos a editar y marcamos la casilla que pone reaciones.
    read more

    Como poner imagen de fondo en el reproductor de Megavideo.
    {[['', '']]}

    Lo primero que tiene que hacer es  copiar el siguiente código:

    <object height="360" width="600"><param name="movie" value="http://wwwstatic.megavideo.com/mv_player.swf?image= URL DE LA IMAGEN &amp;v= ID VÍDEO"><param name="allowFullScreen" value="true"><embed src="http://wwwstatic.megavideo.com/mv_player.swf?image= URL DE LA IMAGEN &amp;v= ID VÍDEO " type="application/x-shockwave-flash" allowfullscreen="true" height="360" width="600"></object>
    • height= sirve para ajustar la altura del reproductor hay ponemos la altura que queramos entre las comillas.
    • width= Sirve para ajustar en ancho de nuestro reproductor.
    • Donde pone URL DE LA IMAGEN ponemos la url de nuestra imagen. Procurar que la imagen que escojáis tenga las mismas dimenciones que las del reproductor de megavideo.
    • Donde pone ID VÍDEO ponéis  la url de megavideo pero solo la parte que aparece despues de la "v=" ,Por ejemplo si la url de megavideo es así: http://http://www.megavideo.com/?v=1RWFRN5M solo copiamos la siguienete parte de la url: 1RWFRN5M.
    Y ya estaría todo y os debería quedara algo como lo esto:




    read more

    Como poner bortón responder comentarios en blogger.
    {[['', '']]}

    1.  lo primero es saber la id de nuestro blog si queremos saverla lo unico que tenemos que hacer es ir  blogger diseño y en el cuadro de la url del navegador nos aparecerá la id de nuestro blog. 
    2. Ahora dentro de blogger iremos a Diseño –> Edición de HTML y aprieta expandir plantillas de artilugios. 
    3. Busca la siguiente linea de comandos:
    <data:commentPostedByMsg/>

    • y justo a continuacion pegamos el siguienete codigo: 
     <span><a expr:href='&quot;https://www.blogger.com/comment.g?blogID=XXXXXXXXXXXXXXXXXXX&amp;postID=&quot; + data:post.id + &quot;&amp;isPopup=true&amp;postBody=%40%3C%61%20%68%72%65%66%3D%22%23&quot; + data:comment.anchorName + &quot;%22%3E&quot; + data:comment.author + &quot;%3C%2F%61%3E#form&quot;' onclick='javascript:window.open(this.href, &quot;bloggerPopup&quot;, &quot;toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=yes,width=450,height=450&quot;); return false;'><img alt='' border='0' src=' AQUI LA URL DEL  BOTÓN '/></a></span>

    •  Donde pone "XXXXXXXXXXXXXXXXXXX" lo cabiamos por la id de nuestro blog.
    • Y donde pone( AQUÍ LA URL DEL  BOTÓN) ponemos la url de la imagen nuestro botón que queramos que aparecerá.
      read more

      Como Personalizar el widged de JS-Ratings.
      {[['', '']]}

      Utilizando su propia imagen para la calificación
      se puede sustituir las imagen que viene por defecto por una imagen tuya mediante el uso de atributos ImageUrl y ImageSize. La dirección URL especificada en el atributo imageurl debe contener cinco imágenes:
      • star.png,
      • star-half.png,
      • user.png,
      • user-half.png, 
      • gray.png
      Los dos primeros iconos son los de calificación de la comunidad( ), Y el tercero y el cuarto son los iconos de calificación del usuario( ), y el ultimo es el icono que marca la posición().

      Aviso: la imágenes tiene que aparecer en el mismo orden que hemos dicho antes para que funcione correctamente.

      Bueno una vez que hemos creado nuestro archivo con las imágenes solo tenemos que poner la url de nuestro archivo en el siguiente codigo:

      <div class='js-kit-rating' userColor='Violet' starColor='Golden' ImageSize='16x24' ImageUrl='http://aqui la url de vuestro archivo de imagenes/' expr:path='data:post.url' expr:permalink='data:post.url' expr:title='data:post.title'>
      </div>

      • ImageSize='16x24' : determina el tamaño de las estrellas de calificación.
      • ImageUrl :Aquí es donde va la url  de nuestro archivo de imagenes para la calificacion.
      Por ultimo tengo que decir que aun no e podido probarlo del todo por lo que aquellas personas que lo prueven les agradeceria que me dejaran un comentario diciendo si les funciona o no,gracias y adios.


        read more

        Como cambia el color de las estrellas de calificacion con js-kit-rating
        {[['', '']]}

        Buenas como ya puse en un post anterior como poner a hora os voy a eplicar como cambiar el color de la puntuación de las estrellas.

        • "userColor" : cambia el color del la calificación del usario. 
        • "starColor" : affecta el color de la calificación de la comunidad.

        <div class='js-kit-rating' userColor='Violet' starColor='Golden' expr:path='data:post.url' expr:permalink='data:post.url' expr:title='data:post.title'>
        </div>

        A continuación os dejo la leyenda de colores para cambiar el color de las estrellas, lo único que tenéis que hacer es sustituirlo en el código anterior.

                                starColor="Ruby"                userColor="Ruby"  

                                starColor="Red"                  userColor="Red"              

                                starColor="Golden"             userColor="Golden"       

                                starColor="Green"              userColor="Green"
                                     
                                starColor="Emerald"          userColor="Emerald"
         
                                starColor="Blue"                userColor="Blue"

                                starColor="Indigo"             userColor="Indigo"

                                starColor="Violet"              starColor="Ruby"

        read more

        Como expandir y contraer elmentos en blogger.
        {[['', '']]}

        Esto es un script que nos sirve para Hacer que aparezca y desaparezca por ejemplo: textos, vídeos, links, imagenes....etc .

        • Bueno lo primero que tienes que hacer es lo siguiente:
        Home → Diseño → Edición de HTML → Expandir plantillas de artilugios
        •  Y una vez que ya estas hay buscas </head> y pegas justo antes este codigo:

        <script type='text/JavaScript'>
             function verocultar(cual) {
                  var c=cual.nextSibling;
                  if(c.style.display=='none') {
                       c.style.display='block';
                  } else {
                       c.style.display='none';
                  }
                  return false;
             }

        • una vez que hemos puesto este código solo tenemos que poner el siguiente código donde queramos contraer y expandir elemento en cualquier parte de nuestro blog.

        <a onclick="return verocultar(this);" href="javascript:void(0);">Enlace</a><div style="display: none; text-align: left; ">
        
        --------------------aqui el texto,video...etc que queramos ocultar--------------------------
        </div>

        • si queremos poner una imagen para mostrar y ocultar el texto solo tenemos que poner este código donde pone "enlace" en el codigo anterior.
        <img  src='AQUÍ LA URL DE NUESTRA IMAGEN' />

        y os debería quedar algo como esto:


        Ver demo
        VideodarasGamen V2.0 es un buscador de Películas Online,SeriesOnline,Templates de Blogger,Tutorialales para blogs y de Informatica


        ejemplo con imagen

        VideodarasGamen V2.0 es un buscador de Películas Online,SeriesOnline,Templates de Blogger,Tutorialales para blogs y de Informatica

        read more

        Cómo poner un favicon en la nueva versión de Blogger.
        {[['', '']]}

        primero que sepáis que un favicon es un icono o logotipo que va asociado a nuestra web.

        bueno para poner un favicon en blogger solo tenéis que seguir estos pasos:
        1. tenéis que elegir la imagen que queréis ponerlle como logotipo a vuestro blog, si queréis también podéis ir a esta  pagina y crearos uno vosotros mismos :  http://www.chami.com/html-kit/services/favicon/

        2. a continuación pegáis el siguiente código en la plantilla justo despues de esto: </head>

        <link href='http://aqui la url de tu imagen' rel='icon' type='image/gif'>
        <link href='http://aqui la url de la imagen' rel='shortcut icon' type='image/GIF'>
        </link>
        </link>

        Yos deveria quedar algo como esto:

         


        nota:lo que esta en rojo lo sustituis por la url de vuestra imagen y listo.
        read more

        Como crear un buscador interno en blogger.
        {[['', '']]}

        solo tenéis que entrar en esta pagina con vuestra cuenta de gmail y podréis crear un buscador de google gratis para vuestras web o blog:

        Enlace:https://www.google.com/accounts/ServiceLogin?continue=http://www.google.com/cse/manage/all&service=cprose&hl=es&gl=us&passive=true  

        Una vez que ayas rellenado todos los campos y te dará un código lo copias y a continuación te vas blogger  entras en diseño y le das a "añadir un gadget" y selcionas "HTML/Javascript" como se ve en la imagen de abajo



        y  a continuación le dais a añadir "HTML/javascript" y  pegáis el código  del buscador que a veis obtenido antes y pulsas guardar y listo ya tenéis un buscador interno de google totalmente gratis.
        read more

        como crear un índice en blogger.
        {[['', '']]}

        Es muy sencillo solo tendréis que crear una entrada o pagina en vuestro blog y pegar el siguiente código:

        <script style="text/javascript" src="http://dl.getdropbox.com/u/647003/CiudadBlogger/Scripts/tableindex.js"></script>
        
        <script src="http://www.tublog.blogspot.com/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc"></script>

        ahora solo tienes que sustituir lo que esta en verde por la url de tu blog, y ya tendrás un índice que se  actualiza solo calvez que hacemos una entrada, además a mi me llamo la atecion bastante que cuando creamos un post nuevo en el índice al lado del titulo aparece esto,Nuevo!
         
         
        read more

        Agregar boton +1 de google a tu sitio ,blog
        {[['', '']]}



        Para poner el botón es muy fácil solo tenéis que poner el siguiente codigo justo antes </head> en el template:


        <script type=“text/javascript src=“http://apis.google.com/js/plusone.js”></script>
        

        y luego ponemos el siguiente código donde queramos que aparezca el botón en nuestra pagina o blog:


        <g:plusone></g:plusone>
         
         
        • entremedias de estas dos etiquetas tenemos que poner la url de nuestro blog o web y deberia de quedaros algo como esto
         <g:plusone href="http://videodarasgamen-v2.blogspot.com/"></g:plusone>

        Sitio web | Botón +1 Google
        read more

        Como agregar paginación a blogger
        {[['', '']]}

        Asta ahora en blogger la única forma que había  de avanzar para ver los demás post era para:Avanzar (Newer Post) o Retroceder (Older Post); pero con el siguiente script podemos avanzar y retroceder por las distintas paginas como se ve en la siguiente foto.

        Lo único que tienes que hacer es copiar el siguiente código y tenemos buscar lo siguiente fragmento </body> y lo pegamos el codigo justo antes de este fragmento </body>.
        
        <script type='text/javascript'>
        var pageCount=10;
        var displayPageNum=8;
        var upPageWord =&#39;&#171;&#39;
        var downPageWord ='Siguiente>>';
        </script>
        <script type='text/javascript'>
        //<![CDATA[
        var home_page_url=location.href;function showpageCount(json){var thisUrl=home_page_url;var htmlMap=new Array();var thisNum=1;var postNum=1;var itemCount=0;var fFlag=0;var eFlag=0;var html='';var upPageHtml='Anterior';var downPageHtml='Siguiente';htmlMap[htmlMap.length]='/';postNum++;for(var i=pageCount-1,post;post=json.feed.entry[i];i=i+pageCount){var timestamp1=post.published.$t.substring(0,19)+post.published.$t.substring(23,29);timestamp=encodeURIComponent(timestamp1);var title=post.title.$t;if(thisUrl.indexOf(timestamp)!=-1){thisNum=postNum}postNum++;htmlMap[htmlMap.length]='/search?updated-max='+timestamp+'&max-results='+pageCount}var banyaknomer=htmlMap.length;if(json.feed.entry.length%pageCount==0){var banyaknomer=htmlMap.length-1;postNum=postNum-1};for(var p=0;p<banyaknomer;p++){if(p>=(thisNum-displayPageNum-1)&&p<(thisNum+displayPageNum)){if(fFlag==0&&p==thisNum-2){if(thisNum==2){upPageHtml='<span class="showpage"><a href="/">'+upPageWord+'</a></span>'}else{upPageHtml='<span class="showpage"><a href="'+htmlMap[p]+'">'+upPageWord+'</a></span>'}fFlag++}if(p==(thisNum-1)){html+='<span class="showpagePoint">'+thisNum+'</span>'}else{if(p==0){html+='<span class="showpageNum"><a href="/">1</a></span>'}else{html+='<span class="showpageNum"><a href="'+htmlMap[p]+'">'+(p+1)+'</a></span>'}}if(eFlag==0&&p==thisNum){downPageHtml='<span class="showpage"> <a href="'+htmlMap[p]+'">'+downPageWord+'</a></span>';eFlag++}}}if(thisNum>1){html=''+upPageHtml+' '+html+' '}html='<div class="showpageArea"><span class="showpageOf"> Page '+thisNum+' of '+(postNum-1)+'</span>'+html;if(thisNum<(postNum-1)){html+=downPageHtml}if(postNum==1)postNum++;html+='</div>';var pageArea=document.getElementsByName("pageArea");var blogPager=document.getElementById("blog-pager");if(postNum<=2){html=''}for(var p=0;p<pageArea.length;p++){pageArea[p].innerHTML=html}if(pageArea&&pageArea.length>0){html=''}if(blogPager){blogPager.innerHTML=html}}function showpageCount2(json){var thisUrl=home_page_url;var htmlMap=new Array();var isLablePage=thisUrl.indexOf("/search/label/")!=-1;var thisLable=isLablePage?thisUrl.substr(thisUrl.indexOf("/search/label/")+14,thisUrl.length):"";thisLable=thisLable.indexOf("?")!=-1?thisLable.substr(0,thisLable.indexOf("?")):thisLable;var thisNum=1;var postNum=1;var itemCount=0;var fFlag=0;var eFlag=0;var html='';var upPageHtml='';var downPageHtml='';var labelHtml='<span class="showpageNum"><a href="/search/label/'+thisLable+'?&max-results='+pageCount+'">';var thisUrl=home_page_url;htmlMap[htmlMap.length]=labelHtml;postNum++;for(var i=pageCount-1,post;post=json.feed.entry[i];i=i+pageCount){var timestamp1=post.published.$t.substring(0,19)+post.published.$t.substring(23,29);timestamp=encodeURIComponent(timestamp1);var title=post.title.$t;if(thisUrl.indexOf(timestamp)!=-1){thisNum=postNum}if(title!='')postNum++;htmlMap[htmlMap.length]='/search/label/'+thisLable+'?updated-max='+timestamp+'&max-results='+pageCount;itemCount++}var banyaknomer=htmlMap.length;if(json.feed.entry.length%pageCount==0){var banyaknomer=htmlMap.length-1;postNum=postNum-1};for(var p=0;p<banyaknomer;p++){if(p>=(thisNum-displayPageNum-1)&&p<(thisNum+displayPageNum)){if(fFlag==0&&p==thisNum-2){if(thisNum==2){upPageHtml=labelHtml+upPageWord+'</a></span>'}else{upPageHtml='<span class="showpage"><a href="'+htmlMap[p]+'">'+upPageWord+'</a></span>'}fFlag++}if(p==(thisNum-1)){html+='<span class="showpagePoint">'+thisNum+'</span>'}else{if(p==0){html=labelHtml+'1</a></span>'}else{html+='<span class="showpageNum"><a href="'+htmlMap[p]+'">'+(p+1)+'</a></span>'}}if(eFlag==0&&p==thisNum){downPageHtml='<span class="showpage"> <a href="'+htmlMap[p]+'">'+downPageWord+'</a></span>';eFlag++}}}if(thisNum>1){if(!isLablePage){html=''+upPageHtml+' '+html+' '}else{html=''+upPageHtml+' '+html+' '}}html='<div class="showpageArea"><span class="showpageOf"> Page '+thisNum+' of '+(postNum-1)+'</span>'+html;if(thisNum<(postNum-1)){html+=downPageHtml}if(postNum==1)postNum++;html+='</div>';var pageArea=document.getElementsByName("pageArea");var blogPager=document.getElementById("blog-pager");if(postNum<=2){html=''}for(var p=0;p<pageArea.length;p++){pageArea[p].innerHTML=html}if(pageArea&&pageArea.length>0){html=''}if(blogPager){blogPager.innerHTML=html}}var thisUrl=home_page_url;if(thisUrl.indexOf("/search/label/")!=-1){if(thisUrl.indexOf("?updated-max")!=-1){var lblname1=thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?updated-max"))}else{var lblname1=thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?&max"))}}var home_page="/";if(thisUrl.indexOf("?q=")==-1&&thisUrl.indexOf(".html")==-1){if(thisUrl.indexOf("/search/label/")==-1){document.write('<script src="'+home_page+'feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" ><\/script>')}else{document.write('<script src="'+home_page+'feeds/posts/full/-/'+lblname1+'?alt=json-in-script&callback=showpageCount2&max-results=99999" ><\/script>')}}
        //]]></script>

        • var pageCount=esto se escarga de determinar el numero de post o entradas que se muestran en cada pagina, pon con un numero decimal exacto para determinar el numero de post que quieres que aparezca. 

        Ahora para darle una apariencia como la de la foto de la derecha tenemos que pegar el siguiente cogido justo antes de este fragmento ]]></b:skin>, os dejo 6 estilos diferente el orden de los estilos se corresponde con el orden en el que aparecen en la foto para que elijáis el que mas os guste, espero que os sirva yo lo he probado en mi blog ya y la verdad es que me a gustado bastante como queda, os recomiendo que os lo pogais en vuestro blog adios . 



        • Estilo 1

        .showpageArea {
          font-family:verdana,arial,helvetica;
          color: #000;
          font-size:11px; 
          margin:10px;
          }
          
        .showpageArea a {
          color: #000;
          text-shadow:0 1px 2px #fff;
            font-weight: 700;
          }
          
        .showpageNum a {
          padding: 3px 8px;
          margin:0 4px;
          text-decoration: none;
          border:1px solid #999;
          -webkit-border-radius:3px;-moz-border-radius:3px;
          background: #ddd url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp1.jpg) 0 -50px repeat-x;
          }
          
        .showpageNum a:hover {
          border:1px solid #888;
          background: #ccc url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp1.jpg) 0 -25px repeat-x;
          }
        
        .showpageOf{
          margin:0 8px 0 0;
          }
        
        .showpagePoint {
          color:#fff;
          text-shadow:0 1px 2px #333;
          padding: 3px 8px;
          margin: 2px;
          font-weight: 700;
          -webkit-border-radius:3px;-moz-border-radius:3px;
          border:1px solid #999;
          background: #666 url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp1.jpg) 0 0 repeat-x;
          text-decoration: none;
          }

        • Estilo 2

        .showpageArea {
          font-family:verdana,arial,helvetica;
          color: #000;
          font-size:11px; 
          margin:10px;
          }
          
        .showpageArea a {
          color: #000;
          text-shadow:0 1px 2px #fff;
            font-weight: 700;
          }
          
        .showpageNum a {
          padding: 3px 8px;
          margin:0 4px;
          text-decoration: none;
          border:1px solid #919106;
          -webkit-border-radius:3px;-moz-border-radius:3px;
          background: #ddd url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp2.jpg) 0 -50px repeat-x;
          }
          
        .showpageNum a:hover {
          border:1px solid #aeae0a;
          background: #ccc url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp2.jpg) 0 -25px repeat-x;
          }
        
        .showpageOf{
          margin:0 8px 0 0;
          }
        
        .showpagePoint {
          color:#fff;
          text-shadow:0 1px 2px #333;
          padding: 3px 8px;
          margin: 2px;
          font-weight: 700;
          -webkit-border-radius:3px;-moz-border-radius:3px;
          border:1px solid #919106;
          background: #666 url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp2.jpg) 0 0 repeat-x;
          text-decoration: none;
          }

        • Estilo 3

        . showpageArea {
          font-family: Verdana, Arial, Helvetica;
          color: # 000;
          font-size: 11px;
          margin: 10px;
          }
          
        . showpageArea a {
          color: # fff;
          }
          
        . showpageNum a {
          padding: 3px 8px;
          margin: 0 4px;
          text-decoration: none;
          background: # 363636 url (http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp3.jpg) 0-25px repeat-x;
          }
          
        . showpageNum a: hover {
          background: # 044697 url (http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp3.jpg) 0-50px repeat-x;
          }
        
        . showpagePoint {
          color: # fff;
          padding: 3px 8px;
          margin: 2px;
          font-weight: 700;
          background: # e30000 url (whttp: / / i879.photobucket.com/albums/ab351/bloggerblogimage/wp3.jpg) 0 0 repeat-x;
          text-decoration: none;
          }
        
        . showpageOf {
          margin: 0 8px 0 0;
          }

        • Estilo 4

        .showpageArea {
          font-family:verdana,arial,helvetica;
          color: #000;
          font-size:11px; 
          margin:10px;
          }
          
        .showpageArea a {
          color: #fff;
          }
          
        .showpageNum a {
          padding: 3px 4px;
          margin:0 4px;
          text-decoration: none;
          border-top:2px solid #000;
          border-left:1px solid #000;
          border-right:1px solid #000;
          border-bottom:1px solid #000;
          background: #666 url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp4.jpg) 0 -25px repeat-x;
          }
          
        .showpageNum a:hover {
          border-top:2px solid #999;
          border-left:1px solid #999;
          border-right:1px solid #999;
          border-bottom:1px solid #999;
          background: #999 url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp4.jpg) 0 -50px repeat-x;
          }
        
        .showpagePoint {
          color:#fff;
          padding: 3px 8px;
          margin: 2px;
          font-weight: 700;
          border-top:2px solid #000;
          border-left:1px solid #000;
          border-right:1px solid #000;
          border-bottom:1px solid #000;
          background: #000 url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp4.jpg) 0 0 repeat-x;
          text-decoration: none;
          }
        
        .showpageOf{
          margin:0 8px 0 0;
          }


        • Estilo 5

        .showpageArea {
          font-family:verdana,arial,helvetica;
          color: #000;
          font-size:11px; 
          margin:10px;
          }
          
        .showpageArea a {
          color: #fff;
          }
          
        .showpageNum a {
          padding: 3px 8px;
          margin:0 4px;
          text-decoration: none;
          background: #333 url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp5.jpg) 0 -50px repeat-x;
          }
          
        .showpageNum a:hover {
          background: #666 url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp5.jpg) 0 -25px repeat-x;
          }
        
        .showpagePoint {
          color:#fff;
          padding: 3px 8px;
          margin: 2px;
          font-weight: 700;
          background: #06a2b9 url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/wp5.jpg) 0 0 repeat-x;
          text-decoration: none;
          }
        
        .showpageOf{
          margin:0 8px 0 0;
          }

        • Estilo 6

        . showpageArea {
          font-family: Verdana, Arial, Helvetica;
          color: # fff;
          font-size: 11px;
          margin: 10px;
          padding: 8px 20px;
          background: # 333;
          }
          
        . showpageArea a {
          color: # fff;
          }
          
        . showpageNum a {
          padding: 3px 8px;
          margin: 0 4px;
          text-decoration: none;
          background: # 666;
          }
          
        . showpageNum a: hover {
          background: # 888;
          }
        
        . showpagePoint {
          color: # fff;
          padding: 3px 8px;
          margin: 2px;
          font-weight: 700;
          background: # da6100;
          text-decoration: none;
          }
        
        . showpageOf {
          margin: 0 8px 0 0;
          }
        read more

        Poner estrellas de calificacion en mi blogs con js-kit-rating
        {[['', '']]}

        bueno js-kit-rating es un widget gartuito que sirve para que nuestros usuarios puedan calificar nuestros post es tan facil como copiara es código



        <script src="http://www.yourjavascript.com/15890923101/JS-Kit_by_ShinoxAyuda.js"></script>

        y pegarlo en la plantilla justo antes de </body>, A continuación para que aparezca en nuestro post tenemos que copiar el siguiente código

        <div class='js-kit-rating' userColor='Violet' starColor='Golden' expr:path='data:post.url' expr:permalink='data:post.url' expr:title='data:post.title'>
        </div>

        y lo pegamos dependiendo de en que zona queramos que aparezca, si queremos que aparezca debajo del titulo del post lo pegaremos justo debajo de esto


        <div class='post-header-line-1'/>

        pero si por el contrario queremos que aparezca al final del post, tendremos que pegarlo detras del siguiente codigo

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



        read more

        Como poner botón ir hacia arriba con efecto deslizante jQuery
        {[['', '']]}

        1. Lo primero que hay que hacer es ir a blogger entrar en el escritorio y seleccionar Diseño/Editor de HTML.
        2. Después de todo esto seleccionamos la pestaña: "expandir plantilla de artilugios" y buscamos </head>.
        3. Una una vez encontrado </head>, copiamos y pegamos justo antes de </head> el siguiente codigo:

        <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>
        
        <script type='text/javascript'>
        
        //<![CDATA[
        
        /*
        Author: mg12
        Update: 2008/05/05
        Author URI: http://www.neoease.com/
        */
        (function() {
        
        function $(id) {
        return document.getElementById(id);
        }
        
        function setStyleDisplay(id, status) {
        $(id).style.display = status;
        }
        
        function goTop(a, t) {
        a = a || 0.1;
        t = t || 16;
        
        var x1 = 0;
        var y1 = 0;
        var x2 = 0;
        var y2 = 0;
        var x3 = 0;
        var y3 = 0;
        
        if (document.documentElement) {
         x1 = document.documentElement.scrollLeft || 0;
         y1 = document.documentElement.scrollTop || 0;
        }
        if (document.body) {
         x2 = document.body.scrollLeft || 0;
         y2 = document.body.scrollTop || 0;
        }
        var x3 = window.scrollX || 0;
        var y3 = window.scrollY || 0;
        
        var x = Math.max(x1, Math.max(x2, x3));
        var y = Math.max(y1, Math.max(y2, y3));
        
        var speed = 1 + a;
        window.scrollTo(Math.floor(x / speed), Math.floor(y / speed));
        if(x > 0 || y > 0) {
         var f = "MGJS.goTop(" + a + ", " + t + ")";
         window.setTimeout(f, t);
        }
        }
        
        function switchTab(showPanels, hidePanels, activeTab, activeClass, fadeTab, fadeClass) {
        $(activeTab).className = activeClass;
        $(fadeTab).className = fadeClass;
        
        var panel, panelList;
        panelList = showPanels.split(',');
        for (var i = 0; i < panelList.length; i++) {
         var panel = panelList[i];
         if ($(panel)) {
          setStyleDisplay(panel, 'block');
         }
        }
        panelList = hidePanels.split(',');
        for (var i = 0; i < panelList.length; i++) {
         panel = panelList[i];
         if ($(panel)) {
          setStyleDisplay(panel, 'none');
         }
        }
        }
        
        function loadCommentShortcut() {
        $('comment').onkeydown = function (moz_ev) {
         var ev = null;
         if (window.event){
          ev = window.event;
         } else {
          ev = moz_ev;
         }
         if (ev != null && ev.ctrlKey && ev.keyCode == 13) {
          $('submit').click();
         }
        }
        $('submit').value += ' (Ctrl+Enter)';
        }
        
        function getElementsByClassName(className, tag, parent) {
        parent = parent || document;
        
        var allTags = (tag == '*' && parent.all) ? parent.all : parent.getElementsByTagName(tag);
        var matchingElements = new Array();
        
        className = className.replace(/\-/g, '\\-');
        var regex = new RegExp('(^|\\s)' + className + '(\\s|$)');
        
        var element;
        for (var i = 0; i < allTags.length; i++) {
         element = allTags[i];
         if (regex.test(element.className)) {
          matchingElements.push(element);
         }
        }
        
        return matchingElements;
        }
        
        window['MGJS'] = {};
        window['MGJS']['$'] = $;
        window['MGJS']['setStyleDisplay'] = setStyleDisplay;
        window['MGJS']['goTop'] = goTop;
        window['MGJS']['switchTab'] = switchTab;
        window['MGJS']['loadCommentShortcut'] = loadCommentShortcut;
        window['MGJS']['getElementsByClassName'] = getElementsByClassName;
        
        })();
        
        
        //]]>
        
        </script>

        • Luego buscamos:"]]></b:skin>"y justo antes pegamos el siguiente codigo:

        a#to_top {
        width:24px;
        height:30px;
        background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhU3zNHoNLSazt7ky3W1q2cYtwderE2seCTuPAvv5pWRxgkYYcXeuJCkovMz4bTsM4IEMlCriezpd57R8h8a8O-xPOqMHhMSDHyO9BQG0kfktGwgAIGcq-XSoEuVo6WWt8XHRvMRr9rMO8/s1600/ico_subir.png) repeat-x scroll 0px 0px;
        bottom: 5px;
        position: fixed;
        right:0px;
        z-index:0;
        -moz-border-radius-bottomleft:12px;
        -webkit-border-radius-bottomleft:12px;
        -moz-border-radius-topleft:12px;
        -webkit-border-radius-topleft:12px;
        border-top: 3px solid #282828;
        border-left:3px solid #282828;
        border-bottom: 3px solid #282828;
        }

        • Luego se van al final del codigo de la plantilla y justo antes de </body> pegais el siguiente codigo:
        <a id="to_top" class="to_top" href="#to_top" onclick='MGJS.goTop();return false;' style="display: block; "></a>

        Y una vez echo todo esto os debería quedar algo como lo que aparece en la imagen del la derecha,y al pulsar sobre el icono os llevara al principio de la pagina.




        read more

        Poner un icono delante de: Etiquetas, Lista de enlaces.
        {[['', '']]}

        Para poner un icono delante de los widgets de lista de enlaces y las etiquetas en blogger como este"", lo primero tienes que ir a "blogger" luego  ir a "diseño" y picar en "Editor de HTML" le das a expandir plantilla de artilugios y justo antes de ]]></b:skin> pegas los siguientes códigos html:

        • Este es el cogido de widgets del "lista de enlaces":

        #LinkList{
         background: url( IMAGEN DEL ICONO DE 16X16) left 12px no-repeat;
         padding: 6px 0px 6px 25px;
         margin: 0;
                border-bottom: 1px solid #8A0808;
                color:#ccc;
         } 

        • Este es el cogido de widgets del "Etiquetas":

        .sidebar ul {
         list-style-type: none;
         margin: 0px 0px 10px 0px;
         padding: 0px;
         }
         
        .sidebar ul li {
         list-style-type: none;
         margin: 0px 0px 5px 0px;
         padding: 0px;
         }
        
        .sidebar ul ul {
         list-style-type: none;
         margin: 0px;
         padding: 0px;
         }
         
        .sidebar ul li, .sidebar ul li ul li {
         background: url(IMAGEN DEL ICONO DE 16x16) left 12px no-repeat;
         padding: 6px 0px 6px 25px;
         margin: 0;
                border-bottom: 1px solid #8A0808;
                color:#ccc;
         }
        
        .sidebar li a:link, .sidebar li a:visited {
                font-size: 16px;
                color:#ccc;
        }
        
        .sidebar li a:hover {
                color:#FFC600;
                text-decoration: none;
        }
        

        • IMAGEN DEL ICONO DE 16X16:Aqui de pone la url del icono que vas a poner ,"NOTA:EL TAMAÑO DEL ICONO QUE PONGAN TIENE QUE SER DE 16x16".
        • Padding: NO TOCAR.
        • Margin:No Tocar.
        • Border-bottom:Es el color de la linia que aparece ceparando cada link.
        • Color:regula el color del testo el color tiene que estar escrito en html.

        NOTA: El color esta determinado  por  estos cogidos  de colores html como este "#8A0808"Si quiere obtener el codigo de colores html puede acerloen es pagina: http://videodarasgamen-v2.blogspot.com/2011/05/html-color-codes.html 

        read more

        D Directa Torrent TV Online Mini juegos