Colocar páginas numeradas.

7 de enero de 2014


Un bonito efecto que sirve para las plantillas blogger. Para colocarlo en tu blog debes seguir dos pasos muy sencillos~

1. Primero ve a Plantilla / Editar HTLM busca con Ctrl + F </body> y coloca encima, el siguiente script:
<script style='text/javascript'> var pageCount=5;var displayPageNum=5;var upPageWord=&quot;Anterior&quot;;var downPageWord=&quot;Próxima&quot;;</script> <script src='http://static.tumblr.com/y66747w/DqWm7hhf3/page-nav.js' style='text/javascript'> </script>

2. Luego arriba de ]]></b:skin> coloca lo siguiente:
.showpageArea {
   font-family:tahoma; /* fuente */
   font-size: 8pt;
   color: #fff; /* color de texto */
   margin:10px;
 }
.showpageArea a {
   padding: 3px 8px;
   margin: 2px;
   text-decoration: none;
   color:#fff;  /* color de texto */
   border:1px solid #000; /* borde de próxima pagina */
   background: #FF7F51; /* color de fondo de próxima pagina */
}
.showpageNum a {
  padding: 3px 8px;
  margin:0 4px;
  text-decoration: none;
  color: #666; /* color de texto */
  border:1px solid #000; /* Borde de la numeración */
  background: #A0D0A0; /* color de fondo de la numeración */
}
.showpageNum a:hover {
   color: #fff; /* color de texto */
   border:1px solid #000; /* borde la numeración cuando el cursor esta encima de ella */
   background: #FF7F51; /* color de fondo la numeración  */
}

.showpageOf{
   margin:0 8px 0 0;
}
.showpagePoint {
   text-decoration: none;
   padding: 3px 8px;
   margin: 2px;
   font-weight: 400;
   background: #FF7F51; /* color de fondo de la numeracion activa */
   color:#fff; /* color de texto */

Solo faltaría personalizarlo a su gusto~ eso es todo, espero les sirva el tuto!
A veces tarda un poco en aparecer cuando lo colocas, es por el script que usa, si le das tiempo aparecerá ♥

Efecto zoom para los afiliados

5 de enero de 2014




Buenos días para todos mis angelitos, hoy les traigo otro nuevo tutorial. Este es sobre como colocar un efecto zoom a los links de afiliados ♥

Vista previa:

Love Love Love Love



También puedes verlo ya personalizado en el sidebar de mi blog de pruebas♥
Para tener este efecto en tu sección de afiliados debes  seguir los siguientes pasos:

Paso 1

Ve a la edición HTML de tu plantilla y con Ctrl + F busca ]]></b:skin y arriba el siguiente código:

.sunny {
background:#000 url(urldetuimagen) top right;
color: #fff;
padding-top: 30px;
text-align: center;
display: inline-block;
width: 75px;
height: 45px;
text-decoration: none;
box-shadow: 0px 0px 20px #fafafa;
text-shadow: 0px 3px 2px #fafafa;
white-space: nowrap;
font: 15px 'Arial'; letter-spacing: 0px;
-moz-transform: scale(0.8);
-ms-transform: scale(0.8);
-o-transform: scale(0.8);
-webkit-transform: scale(0.8);
transform: scale(0.8);
-webkit-transition: all 0.3s linear;
-moz-transition: all 0.3s linear;
-o-transition: all 0.3s linear;
-ms-transition: all 0.3s linear;
transition: all 0.3s linear;
border-radius: 100px;}
.sunny:hover {
-webkit-transition-duration: 1s;
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
-webkit-transform: scale(1);
transform: scale(1);
border-radius: 100px;}
a.sunny {
color: #fff;}

Paso 2

Modifica los colores y tamaños señalados arriba. Y luego pega el siguiente código en donde quieres que se encuentren tus afiliados. Si es en una entrada o página de tu blog debes pegarlo en la edición HTML del post.

<a target="_blank" class="sunny" href="link"> Love </a>
<a target="_blank" class="sunny" href="link"> Love </a>
<a target="_blank" class="sunny" href="link"> Love </a>
<a target="_blank" class="sunny" href="link"> Love </a>

Para agregar mas botones solo copia y pega cuantas veces desees la línea entera que señalé en negrita.

Espero les haya servido el tutorial .. besos ♥


Crear links de descargas directas con Google Drive

4 de enero de 2014

Es muy útil a la hora de tener que subir pequeños archivos para compartirlos en tu bloggie.. a la hora de descargar es muy cómodo ya que no te re direcciona a ningún lado.. y en mi caso que soy una perezosa me salva de andar registrándome en paginas de descargas.

  
Para hacerlo debes primero iniciar sesión en tu cuenta de google+ y dirigirte a Google Drive, una vez allí debes hacer clip en Subir y seleccionar tu carpeta o archivo..



Cuando lo hagas te aparecerá una ventanita que indica que esta cargando..


Una vez que se el archivo se cargue por completo le das clip en compartir ...

Te saldrá una ventana, copias el link y te aseguras de que el archivo este compartido de forma publica..

Una vez que copies el link debes sacar de este el id de tu archivo..

Ej: mi link https://drive.google.com/file/d/0B3tg4gWKfU_iNlRpdnQ4ZEg2VE0/edit?usp=sharing
solo  sirve lo que está en negrita, según tu link lo copias y lo pegas en el siguiente código:

https://docs.google.com/uc?export=download&id=acavaelIDquecopiaste



Y ya esta listo tu link de descarga .. pueden probarlo haciendo clip en el link de arriba se les descargará una imagen de agradecimiento nada más.

Nota:

Deben tener en cuenta que el pequeño inconveniente que existe es que a veces el navegador bloquea las descargas de este tipo.
Para desbloquearlo solo hay que hacer clip en permitir siempre donde muestra la imagen de abajo:



Eso es todo espero les haya sido de utilidad el tutorial