Etiquetado: HTML Mostrar/Ocultar Comentarios | Atajos de teclado

  • jodacame 7:30 pm el December 27, 2009 Permalink | Responder
    Etiquetas: , , HTML, share this,   

    Agregar barra compartir (share this) Facebook y twitter en wordpress.com 

    Como todos saben wordpress.com no permite instalar plugins, por tal motivo no se puede agregar una barrtita de “Share This” o “Compartir esto” en nuestro blog, la manera mas facil que encontre para agregarla como se pueden dar cuenta en mis ultimos post es la siguiente manera:

    Cuando estemos escribiendo la entrada cambiamos a la vista “HTML” (boton derecho a la pestaña Visual) y luego en la parte de abajo de nuestra entrada escribimos en siguiente codigo:

    
    <strong>Compartirlo</strong>
    <hr>
    <a href="http://twitter.com/home/?status=Recomiendo este articulo:%20url_entrada"><img src="https://jodacame.files.wordpress.com/2009/12/twitter1.png"></a>  <a href="http://www.facebook.com/sharer.php?u=url_entrada"><img src="https://jodacame.files.wordpress.com/2009/12/facebook.png"></a>
    
    



    En donde “url_entrada” es el link del post que queremos compartir, les recomiendo recortar el link con tinyurl o bit.ly para que pueda ser publicado sin problema en twitter,

    La barra quedaría como la siguiente:

    Compartirlo


     
    • RUFO 11:42 am el enero 24, 2010 Permalink

      en lugar de copiar ese codigo en cada post, puedes copiar el siguiente en un cuadro de texto de la columna lateral

      Asi podras compartir exactamente el post o subpagina que tengas abierto en ese momento

    • RUFO 11:43 am el enero 24, 2010 Permalink

    • RUFO 11:45 am el enero 24, 2010 Permalink

      por alguna razon no sale el texto que te escribo; prueba entrando en http://www.addtoany.com/buttons

    • jodacame 11:48 am el enero 24, 2010 Permalink

      Gracias por tu aporte, pero el link para compartir que me has dado no funciona para post solo comparte el blog completo, si conoces un blog de wordpress que este usando este método puedes dejar el link para mirar como funciona.

      Gracias por visitar mi blog.

      PD: los codigos html no estan permitidos en los comentarios de este blog xD

    • jodacame 11:53 am el enero 24, 2010 Permalink

      Ok ya lo he probado, muy buena información.

      Gracias.

    • RUFO 11:55 am el enero 24, 2010 Permalink

      en mi blog funciona perfectamente http://rufoart.wordpress.com/blog
      si estas viendo solo un post y pinchas en el boton, solo comparte ese post

    • jodacame 11:57 am el enero 24, 2010 Permalink

      Ok, gracias, ya lo probé y funciona perfectamente. el código que yo doy es para compartir directamente a facebook y/o twitter usando las apis de ellos.

      Gracias.

    • LORD KIAN 12:31 pm el febrero 1, 2010 Permalink

      Hay alguna forma de que la URL del post sea insertado de forma automatica y no tener qe estarla colocando cada que escribo un post?
      Solo la URL…

    • jodacame 6:24 pm el febrero 1, 2010 Permalink

      Hola Lord Kian, si estas usando el hosting gratuito de wordpress no conozco una forma de hacer eso, la forma mas facil que veo es dar click en el botón de obtener url corta que ofrece wordpress al momento de estar escribiendo el post y luego insertarla en el post. Tendrías que verificar si algún tema (Theme) de lo de wordpress ofrece esta opción, pero la verdad lo dudo mucho.

    • bv 5:46 pm el febrero 24, 2010 Permalink

      gracias amigo muy util justamente lo q estaba buscando

    • jodacame 9:31 am el febrero 25, 2010 Permalink

      Gracias a ti por visitar mi blog.

      Exitos.

    • Dogguie 9:40 pm el marzo 18, 2010 Permalink

      Justo lo que buscaba!. Muchas gracias. Lo estoy usando ahora en http://www.cofregrafico.com

    • jodacame 8:55 am el marzo 19, 2010 Permalink

      Hola Dogguie, gracias por tu comentario. SI tienes un hosting pago y configuras wordpress a medida puedes probar otras formas para compartir tus entradas, prueba buscando http://www.google.com.co/search?sourceid=chrome&ie=UTF-8&q=plugin+share+this+wordpress son mas eficientes para las personas que tienen dominio propio.

      Éxitos.

    • userpuntocero 3:35 pm el mayo 4, 2010 Permalink

      Muy bueno tu codigo, que conste en apta que me lo guardo para mi, por cierto, lo modificado y actualizado.
      Espero que lo aproveches. Un saludo.

      strong>Compartirlo

    • sila 1:10 am el mayo 21, 2010 Permalink

      pero como hacer para que en facebook se coloque algo en la publica porque solo copia el enlace..

    • LiizQ 9:55 pm el septiembre 19, 2010 Permalink

      Excelente , sirve de maravilla =) Gracias

    • RUFO 8:36 am el septiembre 22, 2010 Permalink

      WordPress ha añadido por fin la opcion de compartir; podeis activarla en la seccion “opciones” : “compartir”

    • εχθρός 1:42 pm el noviembre 11, 2010 Permalink

      bravo lo acabo de acer fácil
      M ,,, gracias

    • Leandro 3:27 am el diciembre 8, 2010 Permalink

      Facil y excelente

    • Jon Villada Pelayo 10:26 am el marzo 10, 2011 Permalink

      Hola! Tengo un problema, hago exactamente lo que dices y no me funciona. Sale así:

      Compartirlo

      </a> </a>

      ¿Alguna idea?

    • HectorEscribano 5:57 am el abril 19, 2011 Permalink

      Gracias por el aporte, lo probaré.

    • Mariah Zuzuvecha 3:33 am el julio 14, 2015 Permalink

      Estoy probando , es la solucion que estaba buscando pero para dominio propio.

  • jodacame 3:31 pm el April 2, 2009 Permalink | Responder
    Etiquetas: , , , HTML, personalizacion,   

    Iconos al Lado de los Link CSS – Personalizacion WEB 

    Si quieres agregar un icono al lado de tus link, solo tienes q escribir este código en tu css y listo, cada vez que agregues un link te pondrá un icono automáticamente al lado de este.

    cambia el “.exe” por la extencion que quieras personalizar, puedes agregar tantas extenciones como quieras.

    a[href$='.exe'] { 
    
    	padding-left:20px;  
    
    	background: transparent url(icons/icon_exe.gif) no-repeat center left;
    
    }
    

    Para los videos de Youtube y otros

    a[href *="youtube.com/watch?"], a[href *="sevenload.com/videos/"], a[href *="metacafe.com/watch/"] { 
    
    	padding-left:20px;  
    
    	background: transparent url(icons/icon_film.gif) no-repeat center left;
    
    }
    

    Solo funciona en IE7 y Firefox

     
  • jodacame 11:38 am el December 4, 2008 Permalink | Responder
    Etiquetas: , , HTML,   

    Cajas de texto con imagenes css 

    Quieres personalizar tus cajas de texto en tu pagina web al estilo de google, aqui te dejo el código:

    Cajas Personalizadas con CSS

    Cajas Personalizadas con CSS



    CSS

    
    <style>
    .searchBox
    {
    background-image:url('http://www.google.com/images/poweredby_transparent/poweredby_FFFFFF.gif');
    background-repeat:no-repeat;
    background-color:#FFFFFF;
    color:#000000;
    padding-left:70px;
    border-width:1px;
    height:20px;
    border-style:solid;
    border-color:#000000;
    
    }
    
    .userBox
    {
    background-image:url('img2.png');
    background-repeat:no-repeat;
    padding-left:25px;
    border-width:1px;
    border-style:solid;
    border-color:#CC0000;
    }
    
    TD
    {
    font-size:12px;
    }
    
    </style>
    

    HTML

    <table>
    <tr>
    <td><input type="text" name="buscar" class="searchBox" size="18"/></td><td>(Google)</td>
    </tr>
    <tr>
    <td><input type="text" name="nombre" class="userBox" size="18"/></td><td>(Personalizado)</td>
    </tr>
    </table>
    
    
     
c
Crea una nueva entrada
j
Siguiente entrada / Siguiente comentario
k
anterior entrada/anterior comentario
r
Responder
e
Editar
o
mostrar/ocultar comentarios
t
ir al encabezado
l
ir a iniciar sesión
h
mostrar/ocultar ayuda
shift + esc
Cancelar