Las plantillas de Vistas Dinámicas son muy modernas e interesantes, pero a algunas personas no les gusta que esté el logo de Blogger en todas partes. Cada vez que nuestro blog está cargando nos aparece una imagen con el logo de Blogger diciendonos que nuestro blog se está cargando. La imagen es la siguiente :





Para cambiarla debemos hacer lo siguiente :



Si usas la antigua interfaz entra en Diseño | Diseñador de plantillas | Avanzado | Añadir CSS.
Y si usas la nueva interfaz entra en Plantilla | Personalizar | Avanzado | Añadir CSS


Si buscas que no aparezca ningún icono agregá lo siguiente:


.blogger-gear {background-image:none !important;}

Guarda los cambios y listo. Con eso no aparecerá nada mientras cargue el blog.


Si buscas reemplazar la imagen que viene por defecto (la del logo de Blogger con los engranajes) agregá lo siguiente :

.blogger-gear {
background-image:url( https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbuyYrh2ib6VrowCokcIzdwUzej2ulclsceZcdgS-Go2WqvqlwYVJcoDHH3ta2Et8nyb0D-vVCSx6tUAOiMSD8qh0EFGqs1RXyhM1H0Tax3hdqRYb5rY86JdQbNNVFSlnywaTUqxjpvNQW/s1600/cargando.gif );
width:128px; /* Ancho de la imagen */
height:128px; /* Alto de la imagen */
}

Si quieres cambiar la imagen por otra, cambia la URL que está en color verde.

Leer mas

Hola amigos, hoy les traigo una interesante caja flotante hecha con Css, la cual nos va a permitir tener la opcion de copartir en Google +, Twitter y Facebook. Para utilizarla en nuestro blog debemos hacer lo siguiente:

Antes de ]]></b:skin> pegamos el siguiente código:

/****** Contenedor de botones facebook, twitter y Google ********/
#caja-botones {
position: fixed;
top:207px;
bottom: 30%;
margin: 120px 0 0 -160px;
left: auto;
z-index: 2;
width: 85px;
height: 245px;
background-color:#f7fcfd;
border: 1px solid #ffffff;
-webkit-border-radius:  6px;
-moz-border-radius: 6px;
border-radius: 6px;
border-top-left-radius: 6px;
border-bottom-left-radius: 6px;
}
#caja-botones h4{
font-size: 11px;
margin: 4px 0 3px 0;
padding: 0;
text-align: center;
color: #0d72fb;
font-weight: normal;
background: none;
letter-spacing: 0em;
}

.boton-facebook {
float: left;
display: block;
margin: 3px 0 2px 7px;
padding: 0;
width: 80px;
height: 70px;
}
.boton-twitter {
float: left;
display: block;
width: 80px;
height: 70px;
margin: 4px 0 2px 9px;
padding: 0;
}
.boton-google {
float:left;
display: block;
text-align: center;
margin: 2px 0 0 7px;
padding: 0;
width: 70px;
height: 65px;
}



Una vez realizado el paso anterior buscamos <div class='post-footer'> y antes de esto pegamos el siguiente código:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='caja-botones'><h4>&#161;Compartir!</h4>
 <div class='boton-twitter'>
<a class='twitter-share-button' data-count='vertical' data-lang='es' data-via='facu_b' href='http://twitter.com/YOUR_USERNAME'>Twettear</a>
<script src='http://platform.twitter.com/widgets.js' type='text/javascript'/>
 </div>
<div class='boton-facebook'><iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?locale=es_ES&amp;href=&quot; + data:post.url+ &quot;&amp;layout=box_count&amp;show_faces=false&amp;width=80&amp;height=70&amp;action=like&amp;font=arial&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:80px; height:70px'/>
 </div>
<div class='boton-google'>
<g:plusone size='tall'/>
</div>
 </div>
  </b:if>


Pueden ver un ejemplo funcionando en este blog de pruebas.

Leer mas

Icono de vídeo Vídeo de muestra de Windows 8



Windows 8 Consumer Preview

 

 

Un Windows renovado y reinventado a partir de las robustas características de velocidad y seguridad de Windows 7. Una interfaz táctil completamente nueva. Un nuevo Windows para nuevos dispositivos. Y tienes la oportunidad de ser uno de los primeros en probarlo.
El programa de instalación de Windows 8 Consumer Preview comprobará si tu PC puede ejecutar Windows 8 Consumer Preview y seleccionará la descarga correcta para tu equipo. El programa de instalación incorpora también un informe de compatibilidad y ayuda para la actualización. Hay disponibles herramientas integradas para crear un ISO o una unidad flash de arranque para la mayoría de las versiones anteriores de Windows (a excepción de Windows XP y versiones anteriores). Encontrarás los requisitos del sistema e información adicional en la lista de Preguntas frecuentes y en los vínculos de esta página.
Ten en cuenta lo siguiente antes de realizar la descarga: Windows 8 Consumer Preview es una versión de software preliminar que puede sufrir modificaciones antes de que se publique la versión comercial. Microsoft no otorga ninguna garantía, expresa o implícita, con respecto a la información que aquí se proporciona. Algunas características y funcionalidades del producto pueden requerir hardware o software adicional. Si decides volver al sistema operativo anterior, tendrás que reinstalarlo por medio de recuperación o instalación incluido con tu PC.





Fuente : http://windows.microsoft.com/es-ES/windows-8/download

Leer mas

Hola gente, hoy les vengo a mostrar como insertar iconos de suscripcion arriba del titulo de las entradas , esto es muy facil y realmente util. Podes ver un ejemplo funcionando en este blog de pruebas .

Antes de ]]></b:skin> pegamos este código :


#suscribir {
float: left;
margin-top:-38px;
margin-bottom:18px;
margin-left:-13px;
position: relative;
}

Los valores marcados en negrita nos permitiran cambiar la posición.


Abajo de <div id='outer-wrapper'> pegamos lo siguiente :

<div id='suscribir'>
<a href='http://EL NOMBRE DE TU BLOG.blogspot.com/feeds/posts/default' imageanchor='1' style='margin-left: 1em;'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVvEoMt2GCmNHU9PuyPZd_zfsjSmZsSwm72x2_bWt_tvIgMjMJ5HHFY4APH5QFrsLOSbBmezIbl1X9VBzAphKjcTRakPh_gWrckldAZJhuDhjA19b514_trpriE02aPakQV5TKq2xVv2ph/s1600/rss.png'/></a><a href='http://twitter.com/TU NOMBRE EN TWITTER'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZXr4WczeV8HnW36XBHO1NkjH57EbmYq-9CXhuXNVMvUoKYWPoU9wlHCRGT5lmWiN_zPlt7aAOTlzGrckeuHqVh7ekPVmhiun13z3WQ5t9ZaObzyRWO5COQsRjI_L1V4HJ656pdHIO0VJD/s1600/twitter.png'/></a><a href='TU PÁGINA DE FACEBOOK' imageanchor='1' style='margin-right: 1em;'><img border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiJnR_zWdAy2k0lx8wTNcnnylycYrTc6CdyVv7tWqiB55Zt-r8pVpjS0dCvWQrjWMYsR27H7xmu3B8GXQELUaiHtvPWoVwj5GCw2Ru6XUa8Ir3FDvb45xrmUndDUnU4KBx4feS265OtEpg7/s1600/facebook.png'/></a>
</div>



El resultado será algo como esto :

Leer mas

Hola amigos , en esta entrada les traigo un efecto genial para nuestras imagenes ,como lo dice el título de la entrada se trata de que las imagnes rotan y al rotar se agrandan.

Lo primero que debemos hacer es pegar el siguiente código antes de </b:skin>

@-webkit-keyframes rotater {
    0% { -webkit-transform:rotate(0) scale(1) }
50% { -webkit-transform:rotate(360deg) scale(2) }
100% { -webkit-transform:rotate(720deg) scale(1) }
}

a.advert    { width:125px; height:125px; display:block; }
a.advert:hover {
    /* safari / chrome */
    -webkit-animation-name:rotater;
    -webkit-animation-duration:500ms;
    -webkit-animation-iteration-count:1;
    -webkit-animation-timing-function: ease-out;
   
    /* mozilla */
    -moz-transform:rotate(360deg) scale(2);
    -moz-transition-duration:500ms;
    -moz-transition-timing-function: ease-out;
   
    /* opera */
    -o-transform:rotate(360deg) scale(2);
    -o-transition-duration:500ms;
    -p-transition-timing-function: ease-out;
   
    /* ie */
    -ms-transform:rotate(360deg) scale(2);
    -ms-transform-duration:500ms;
    -ms-transform-timing-function: ease-out;
}


Con esto ya tenemos los estilos , ahora debemos hacerlos actuar. Para eso vamos a utilizar el siguiente código para agregar las imagenes.


<div style="width:125px;float:left;overflow:hidden;height:125px;margin-right:20px;">
    <a href="#" class="advert"><img src="URL DE LA IMAGEN"/></a>
</div>

<div style="width:125px;float:left;overflow:hidden;height:125px;margin-right:20px;">
    <a href="#" class="advert"><img src="URL DE LA IMAGEN"/></a>
</div>

Para agregar otra imagen solamente debemos copiar este código y reemplazar lo que se pide.

<div style="width:125px;float:left;overflow:hidden;height:125px;margin-right:20px;">
    <a href="#" class="advert"><img src="URL DE LA IMAGEN"/></a>
</div>

 Aclaraciones : 

TODAS las cosas que se  encuentran en negrita pueden ser cambiadas.

width:125px y height:125px : Lo alto y lo ancho de la imagen .
# : Esto puede ser reemplazado por un link si queremos .




Las imagenes nos quedarán de este modo :













Leer mas

Hola amigos ,en esta oportunidad les vengo a mostrar como utilizar la letra capital en las entradas de sus blogs. Es muy fácil, a continuacion les voy a enseñar como utilizarlo para una entrada específica o para todas las entradas.


Para utilizarla en todas las entradas solamente tenemos que pegar el siguiente código antes de </b:skin> .

p:first-letter {
    display:block;
    margin:5px 0 0 5px;
    float:left;
    color:#2ECCFA;
    font-size:60px;
    font-family:Georgia;
}



Para agregarlo en una entrada específica pegaremos este código en la parte de "Edicion de HTML" la cual se encuentra justo al lado de "Redactar".



<style type="text/css">
p:first-letter {
    display:block;
    margin:5px 0 0 5px;
    float:left;
    color:#2ECCFA;
    font-size:60px;
    font-family:Georgia;
}
</style>



En ambos casos debemos pegar el siguiente código en nuestras entradas para poder usar la letra capital.

<p>TU TEXTO</p>

Leer mas

Para quietar en numero de etiquetas lo único que deberemos hacer será ir a Diseño -----> Edición html y expandimos los artilugios de nuestra plantilla y buscamos la siguiente etiqueta (con Ctrl + F al mismo tiempo)

<span dir='ltr'>(<data:label.count/>)</span>


Así debe quedarnos todo.


Una vez encontrada solamente debemos borrarlo, obteniendo como resultado lo siguiente :


Leer mas



  • Dehumanized EP
Facebook SoundcloudTwitterYoutube

Escuchalo en vivo

Seguidores

Ultimos comentarios