domingo, 20 de octubre de 2013

Mostrar tus likes de tumblr

Si tenes una cuenta en tumblr.com habrás notado que algunos sitios te muestran no solo sus posts, y reblogueos, sino tambien las cosas que dichos usuarios "gustan"... es decir los "Likes". 

Para aquellos que aun no esten familiarizados con el servicio de tumblr.com, os explico que un usuario que tiene una cuenta, mientras "sigue" a otros usuarios, va mirando las cosas que otros postean. Con un post puede "reblogg" o "like" ... si los rebloggea es como que lo postea en su espacio para sus amigos... lo que en Twitter seria un RT. Mientras que si le coloca un "Like" ... le queda marcado en sus favoritos, en una seccion que puede ser oculta para él, o visible para todos.

En fin, vi algunos sitios de tumblr.com que mostraban en el sidebar cuales eran sus ultimos favoritos... me llamó la atención. Yo quiero tambien hacer eso, como lo hicieron?

Bueno, en este post... el codigo necesario. =)


Primero entras a tu sitio de tumblr.com.
Habrá que editar el HTML de tu theme, por lo tanto ves a http://www.tumblr.com/customize

Despues de  <style type="text/css">  pegas esto:


/*_____________________________________
ul#likes {
list-style-type: none;
margin: 0 0 0 0;
padding: 0 0 0 0;
}
li.like_post {
/* Should match the width specified in the Likes tag */
width: 150px;
padding: 0 40px 0 0;
float: left;
}
li.like_post img {
max-width: 100%;
}
li.like_post blockquote {
margin: 0;
padding: 0 0 0 10px;
border-left: 1px solid #eee;
}
li.like_post ol,
li.like_post ul {
margin: 0 0 0 15px;
padding: 0;
}
li.like_post .like_link a {
font-weight: bold;
}
li.like_post .like_title {
font-weight: bold;
}
li.like_post .post_info_bottom {
margin: 10px 0 0 0;
display: block !important;
}
/*___________________________________________



Y dentro del sidebar (columna lateral), donde mas te guste pegas ésto:
?

<div style="clear:both;"></div>
{block:Likes}
            <div id="likes_container">
                <h2>Stuff I like</h2>
                      {Likes limit="5" summarize="100" width="150"}
            </div>
        {/block:Likes}
<!--<div class="space"></div>-->
<div style="clear:both;"></div>

jueves, 5 de septiembre de 2013

Fecha y hora actualizada

Este código lo puedes poner donde quieras. Aunque recomiendo situarlo en alguna columna lateral para que sea más visible.

<head> 
<title>Pagina nueva 1</title> 
<script> 
function mueveReloj(){  
var LaFecha=new Date(); 
var Mes=new Array("Enero","Febrero","Marzo","Abril","Mayo","Junio","Julio","Agosto","Septiembre","Octubre","Noviembre","Diciembre"); 
var diasem=new Array('Domingo','Lunes','Martes','Miércoles','Jueves','Viernes','Sábado'); 
var diasemana=LaFecha.getDay(); 
var FechaCompleta=""; 
var NumeroDeMes="12"; 
var hora = LaFecha.getHours(); 
if(hora<10){hora="0"+hora;}; 
var minuto = LaFecha.getMinutes();  
if(minuto<10){minuto="0"+minuto;}; 
var segundo = LaFecha.getSeconds(); 
if(segundo<10){segundo="0"+segundo;}; 
NumeroDeMes=LaFecha.getMonth(); 
FechaCompleta=diasem[diasemana]+" "+LaFecha.getDate()+" de "+Mes[NumeroDeMes]+" de "+LaFecha.getFullYear()+" "+hora+":"+minuto+":"+segundo; 
document.getElementById('pepe').innerHTML=FechaCompleta; 
setTimeout('mueveReloj()',1000) 
}  
</script>  

<body onload="mueveReloj()"> 
<div id="pepe"></div> 
</body> 
</html> 

lunes, 22 de julio de 2013

Añadir sidebar (columna lateral) a un tema que no lo tiene.

  • Paso 1: Ves a http://www.tumblr.com/customize para editar tu tumblr.

    Paso 2: Haz clic en “Editar HTML” para poder editar tu tumblr mediante códigos HTML.

    Paso 3: Busca (ctrl+f)  <style type="text/css">  y añade algunas líneas en blanco pulsando la tecla "Enter".
    Paso 4: Agrega el siguiente código en tu tema, debajo de la etiqueta <style type="text/css"> :
    #sidebar {
    float:left;
    width:250px;
    height:100%;
    }
    Paso 5: Cambia el "float: left" a "float: right" si deseas tener la barra lateral a la derecha de tu Tumblr. Ajusta el valor de "width" para cambiar el ancho a tu gusto.
    Paso 6: Busca la etiqueta <div id="wrapper"> debajo de la sección <body> y añade algunas líneas en blanco pulsando la tecla "Enter".
    Paso 7: Escribe lo siguiente en el área en blanco que acabas de crear:
    <div id="lateral">
    Paso 8: AQUÍ IRÁN TODOS LOS CÓDIGOS HTML QUE QUIERAS AÑADIR. Pulsa la tecla "Enter" para ir a la línea siguiente. Añade cualquier tipo de código HTML o el contenido que deseas mostrar en la barra lateral inmediatamente después de la etiqueta.

    <div id="lateral">
    Paso 9: Cierra el sidebar escribiendo </div>  después de la última parte del contenido sidebar.
    Paso 10: Guarda el tema. Cada vez que hagas un cambio en tu tema recomiendo que lo guardes en un documente de texto en tu ordenador, así en caso de cagarla puedes volver a como lo tenias antes.

    Si no te ha funcionado o no sabes hacerlo, copia y pega CODE de esta web:
    http://forums.htmlhelp.com/index.php?showtopic=12660

lunes, 27 de mayo de 2013

Muchos efectos del mouse, texto y pantalla.

Presiona CTRL+F (cmd+F en MAC) para acceder a la función de “Buscar”. Esto te permitirá localizar ciertas palabras en el código.

Teclea “
text/javascript” (sin las comillas) en la barra de “Búsqueda”. Y pegalo en la linea de abajo


Metete en esta pagina y copia y pega el codigo HTML que quieras (Arriba tienes un menú con todos los apartados) :   http://www.mf2fm.com/


Quedara así (Purpurina que suelta el ratón) :


Para editar el color.
Atento a:

var colour="NUMERO_DEL_COLOR";      

En cada código sale esto, solamente tienes que remplazar NUMERO_DEL_COLOR por el código RGB del color que quieras

Ejemplos:


  • var colour="FF0000";    ROJO
  • var colour="09FF00";    VERDE
  • var colour="2200FF";    AZUL
Los colores RGB: http://html-color-codes.info/codigos-de-colores-hexadecimales/

martes, 14 de mayo de 2013

Editar el tamaño de las imágenes publicadas en tu tumblr.

Hay temas de tumblr específicamente diseñados para mostrar fotos grandes. Puedes elegir un tema de esos desde: http://www.tumblr.com/themes/

Tambien puedes personalizar el tamaño de las fotos en cualquier tema. Para ello debes ir a http://www.tumblr.com/customize

Luego buscas (CTRL+F o cmd+F en MAC) la parte del código referida a las fotografías: {block:Photo} 

Verás que ahí dice algo como: <img src="{PhotoURL-500}"



Debes añadir: width="TAMAÑO_QUE_ELIJAS"

Quedara asi: <img src="{PhotoURL-500}" width="TAMAÑO_QUE_ELIJAS"
  

Por defecto es “500” cuento más alto sea la cifra mas grande sera la imagen.
Hazlo con cuidado, a veces cambiar el tamaño de las fotografías puedes hacer que se vean mal o descentradas.

lunes, 13 de mayo de 2013

15 consejos para optimizar tu blog de tumblr



1.-Publica diariamente, y para las horas que no estés conectado deja publicaciones en la cola.


2.-Manda aportes a otros tumblr. Para interactuar con otros usuarios y conseguir visitas.


3.-Consigue tumblrs con tus mismas visitas, ponle un banner y que el te ponga a ti, y asi poco a poco ir subiendo entre tus colegas o gente a la que publicites. Tutorial de como poner un banner: http://codigoshtmlparatumblr.blogspot.com.es/2012/07/banner.html


4.-Edita tu tumblr a mejor siempre que puedas, con nuevos códigos HTML y fondos.


5.-Interactua con tus seguidores. Y con quien no te sigue, gracias a tu ayuda ganaras seguidores y así visitas.


6.-Centrarte en una temática 

Para atraer la atención de los demás es fundamental, dentro del inmenso caudal de información existente y además de ofrecer contenidos de calidad, ser originales y exclusivos. Para ello, será más fácil tener relevancia si tu blog se centra en una temática concreta. Si quieres diversificarte puedes hacerlo abriendo varios blogs con la misma cuenta. 
7.-Añadir comentarios 

Tips Tumblr 1 

Tumblr utiliza el sistema de comentarios externo Disqus. Mantener comunicación directa con tus seguidores y establecer conversaciones acerca de lo que publicas te servirá para crear y consolidar tu propia comunidad. Para activar el sistema, una vez registrado en Disqus.com, escribe tu nombre de usuario de Disqus en "Personalizar tema > Disqus shortname".
 8.-Incluir texto y palabras clave 

Tips Tumblr 2 

Tumblr es ideal para publicar todo tipo de contenido inmediato obtenido en movilidad. Te sorprenderá la rapidez y sencillez con la que se pueden publicar fotos y vídeos. Sin embargo, ganarás en claridad y posicionamiento si añades breves descripciones (1) y etiquetas (2), en los espacios habilitados para ello en el editor de posts. Incluye siempre dos o tres palabras clave como etiquetas; es decir, aquellas palabras por las que los usuarios llegarán a tu post mediante los buscadores. En la descripción emplea dichas palabras clave. 

9.-Incluir RSS 

Tips Tumblr 3 

Aunque Tumblr incluye en el escritorio su propio agregador de los blogs a los que sigues, también dispone de archivo RSS con el que puedes invitar a tus lectores a suscribirse. La URL del archivo RSS se forma siempre añadiendo /rss a la dirección del blog; por ejemplo: blogpocket.tumblr.com/rss. 

Para redirigir el archivo RSS a FeedBurner, dirígete a la página de configuración del blog y activa el campo "Redireccionar las RSS de este blog a una URL de FeedBurner" con el nombre del fichero rss en Feedburner. 

10.-Permalinks amigables 

Tips Tumblr 4 

Si no se personalizan las URLs de los posts (permalinks) éstas son del estilo: blogpocket.tumblr.com/#23793453799. Que tus permalinks tengan una estructura amigable hará fácil la lectura tanto para tus segudires como para los buscadores. Convierte tus permalinks en amigables personalizándolos en el editor de post, rellenando el campo "URL personalizada". 
11.-Rebloguear 

Tips Tumblr 5 

En Tumblr, no hace falta que publiques tu propio contenido. Tus seguidores también agradecerán que compartas con ellos ese contenido interesante que has encontrado en tu timeline. Para ello se emplea el botón "reblog". 

El botón "reblog" (icono del reciclado) se encuentra en la barra de navegación de la parte superior de la pantalla, cuando visitas un blog de Tumblr o en el escritorio dentro del agregador de los blogs que sigues. Al lado del botón "reblog" también hallamos el botón "like" para indicar que nos gusta el post. 
12.-Añadir sistema de preguntas 

Tips Tumblr 6 

Otra forma de crear comunidad y favorecer la conversación es mediante el sistema de preguntas que proporciona Tumblr. Con ello, permites a tus lectores que te envén mensajes con comentarios, sugerencias y preguntas. El formulario para preguntar se encuentra añadiendo /ask a la URL de tu blog; por ejemplo: lostumblrykenny.tumblr.com/ask. Y los mensajes enviados por tus seguidores los hallarás en el icono del correo en el escritorio. 
13.-Añadir colaboraciones 

Tips Tumblr 7 

Y aún existe otra vía de particación para tus seguidores. Se trata de la posibilidad de enviar colaboraciones; es decir, publicar en tu blog contenidos elaborados por otros. El formulario lo hallarás añadiendo /submit a la URL de tublog; por ejemplo: lostumblrykenny.tumblr.com/submit 

Tanto las preguntas como las colaboraciones se deben autorizar en el apartado de configuración del escritorio, activando las casillas "Let people ask questions" (1) y "Let people submit posts" (2) respectivamente. También se pueden personalizar los textos que verán los usuarios para invitarles a participar, si se permtien preguntas anónimas, qué tipos de posts se pueden enviar y qué etiquetas se incluirán por defecto en el caso de las colaboraciones. 
14.-Seguidores y seguidos 

Tips Tumblr 8 

Un blogroll muy interesante que puedes añadir a la página de tu blog de Tumblr es el tu lista de seguidos. La URL se forma añadiendo /#following a la dirección de tu blog; por ejemplo: lostumblrykenny.tumblr.com/#following
Los seguidores los encontrarás en el apartado "Followers" de tu escritorio, con el botón de "Seguir" correspondiente. 


Si no sabes agregar la lista: http://codigoshtmlparatumblr.blogspot.com/2013/05/lista-de-los-tumblr-que-sigues.html
15.-Conexión con Twitter y Facebook 

Tips Tumblr 9 

Y, finalmente, Tumblr también permite llevar los contenidos que publiques a Twitter y Facebook, con lo que ampliarás el eco de los mismos, aumentando las posibilidades de lograr nuevos seguidores. 

Activa las casillas "Share posts on your Timeline" (1) y "Share posts on your Twitter" (2) para conectarte a Facebook y Twitter respectivamente. 



Algo que te servirá y esta bastante bien: 

------------------------------------------------------------------------------------------------------------------------------------


ESPERO QUE TE HAYA SIDO DE AYUDA, UN SALUDETE.

viernes, 10 de mayo de 2013

Crear apartados en la columna lateral.


Paso 1: Ves a http://www.tumblr.com/customize para editar tu tumblr.


Paso 2: Haz clic en “Editar HTML” para poder editar nuestro tumblr mediante códigos HTML.

Paso 3: Una vez aquí, elige el apartado que quieres crear. Vídeo destacado, gente a  la que sigo, contador de visitas, etc.
Vamos a crear por ejemplo un apartado de MIS ÚLTIMOS TWEETS.

Paso 4: Nos vamos al código (buscalo con ctrl+f si hace falta) , y ponemos antes y después del código esto:     
         <br />     
 </div>
 <br />
<div id="top">
        <br /> 

SIRVE PARA CUALQUIER CÓDIGO QUE PONGAS EN EL SIDEBAR.