viernes 5 de marzo de 2010

Hacer una copia del blog

46 comentarios |

Ya sabemos lo importante que es hacer una copia de la plantilla cada vez que se hace una modificación importante, pero a veces nos olvidamos de tener un respaldo del blog, me refiero a tener una copia de todas las entradas publicadas y sus respectivos comentarios.

Son frecuentes los casos de usuarios que dicen que les han "robado" su blog o Blogger se los ha eliminado, si bien más adelante abordaremos estos temas es importante tener siempre un respaldo del blog para evitar futuros dolores de cabeza.

El proceso es sencillo, sólo entra en Configuración > Básico y en la primera opción verás que dice Herramientas de blog, ahí vienen tres opciones, Importar blog, Exportar blog y Suprimir blog. Hacemos click en la segunda.

blogger

Se guardará un archivo XML en su equipo, ese archivo es el respaldo de tus entradas y comentarios publicados. Si algún día perdieran su blog sólo abren otro blog, van ahí mismo y seleccionan Importar blog, buscamos el archivo de respaldo del blog y todas las entradas y comentarios serán publicados en el nuevo blog.

Como Blogger últimamente nos ha dado mucha desconfianza por tantos errores que ha presentado veremos en la próxima entrada cómo hacer el respaldo a través de un software.
Tantos códigos me han dado mucha sed ¿qué tal una cerveza?

jueves 4 de marzo de 2010

Glider: Mostrar entradas destacadas

40 comentarios |

Son muchos quienes piden un gadget que muestre las entradas destacadas en forma de slide, es decir que se desplace el resumen de la entrada junto con una imagen representativa, así que podemos hacerlo usando JQuery y un script de Dynamicdrive.
Para que sepas mejor de qué hablo puedes ver un ejemplo en este blog de pruebas.

Ponerlo en el blog no es complicado pero el sistema no es automático, así que cada vez que se desee que se muestren otras entradas se tiene que editar dicho gadget, así que no es un gadget para perezosos.

Para empezar entramos en Diseño > Edición de HTML y pegamos antes de ]]></b:skin> lo siguiente:
#glidercontent{
margin:0px 0px 20px 10px;
font-family: 'Lucida sans unicode', tahoma, Verdana, Arial, Sans-Serif; /* Tipo de letra */
background:#ccc; /* Color de fondo */
-moz-border-radius:10px;
-khtml-border-radius:10px;
-webkit-border-radius:10px;
border-radius:10px;
border: 1px solid #000; /* Color del borde */
}
.glidecontentwrapper{
position: relative;
width: 480px; /* Ancho */
height: 250px; /* Alto */
overflow: hidden;
padding:0;
margin:0;
}
.glidecontent{
position:absolute;
padding:20px 10px 0px 8px;
width:445px;
color:#fff; /* Color del texto */
background:#ccc; /* Color de fondo */
margin:0px 0px;
height: 250px;
overflow:hidden;
float:left;
}
.glidim{
float:left;
width:150px;
}
.glidim img{
margin:10px 5px 5px 10px;
padding:3px 3px;
background:#fff; /* Color de fondo de las imágenes */
}
.glidmeta h2{ /* Propiedades de los títulos */
margin:0px 0px 5px 0px;
font-size:20px;
font-weight:bold;
overflow:hidden;
height:27px;
}
.glidmeta h2 a:link, .glidmeta h2 a:visited{
text-decoration:none;
color:#fff; /* Color del texto del título */
}
.glidmeta{
float:right;
text-align:justify;
width:260px;
padding:0 10px 0px 5px;
margin:10px 0px 0 0;
color:#fff;
font-size:12px;
}
.gmore{ /* Propiedades del enlace Leer más */
float:right;
height:28px;
background:#585858;
width:75px;
line-height:30px;
padding-left:27px;
font-size:12px;
margin-top:5px;
}
.gmore a:link, .gmore a:visited{
color:#fff;
}
.gnav{
width: 100px;
height:50px;
z-index:150;
float:right;
padding-right:25px;
}
.glidecontenttoggler{
height:35px;
z-index:150;
width: 940px;
}
.glidecontenttoggler a{
display: -moz-inline-box;
display: inline-block;
color: #000;
font-weight: bold;
text-decoration: none;
}
.glidecontenttoggler a.selected{
background: #E4EFFA;
color: #000;
}
.glidecontenttoggler a:hover{
background: #E4EFFA;
color: #000;
}
.glidecontenttoggler a.toc{
}
.glidecontenttoggler a.prev{ /* Flecha izquierda */
top:5px;
right:42px;
position:absolute;
display:block;
background:url(http://2.bp.blogspot.com/_dsEG33PDaHw/S47Ce61OscI/AAAAAAAAANo/zjzEoN6jwP0/s400/left.png)no-repeat left;
height:29px;
width:40px;
}
.glidecontenttoggler a.next { /* Flecha derecha */
float:right;
display:block;
background:url(http://2.bp.blogspot.com/_dsEG33PDaHw/S47CfGWB-NI/AAAAAAAAANw/OynjKKmZtn8/s400/right.png)no-repeat right;
width:40px;
height:29px;
position:absolute;
top:5px;
right:15px;
}


Luego pegamos antes de </head> el contenido de este archivo. Y esto:
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'/>


Ahora ahí mismo en Edición de HTML y SIN expandir los artilugios buscamos esta parte:
<div id='crosscol-wrapper' style='text-align:center'>
<b:section class='crosscol' id='crosscol'/>

Si no lo tiene tu plantilla puedes ponerlo debajo de <div id='main-wrapper'> aunque si el ancho de tus entradas es menor a 480px el gadget no se mostrará por completo.
En fin, pegamos debajo de esa línea lo siguiente:
<b:if cond='data:blog.pageType != &quot;item&quot;'>

<script type='text/javascript'>
featuredcontentglider.init({
gliderid: &quot;glidercontent&quot;,
contentclass: &quot;glidecontent&quot;,
togglerid: &quot;togglebox&quot;,
remotecontent: &quot;&quot;,
selected: 1,
persiststate: true,
speed: 200,
direction: &quot;leftright&quot;,
autorotate: true,
autorotateconfig: [5000, 1] //if auto rotate enabled, set [milliseconds_btw_rotations, cycles_before_stopping]
})
</script>

<b:section class='glide' id='glide1' showaddelement='no'>
<b:widget id='HTML99' locked='true' title='Glider: Contenido destacado' type='HTML'/>
</b:section>
</b:if>

Guarda los cambios y ahora entra en Diseño > Elementos de la página y verás un nuevo gadget llamado Glider, haz click en Editar.
Ahí pega esto:
<div class="glidecontent">
<div class="glidim">
<a href="URL de la entrada"> <img src="URL de la imagen" width="100" height="100" /> </a>
</div>
<div class="glidmeta">

<h2><a href="URL de la entrada">Título de la entrada</a></h2>
...Aquí va el resumen de la entrada...

<div class="gmore">
<a href="URL de la entrada">Leer más</a>
</div>
</div>
</div>

Cambia donde se indica la URL de la entrada del post al que llevará, así como la URL de la imagen.
Si quieres cambiar el tamaño de la miniatura busca en este último código donde dice width="100" height="100" y cámbialo por otros valores.
Puedes poner tantas entradas destacadas como quieras sólo pega debajo de ese mismo código un código igual (con distintos datos obviamente) por cada entrada que quieras mostrar en el gadget. Este gadget puede servirte para promocionar las entradas que quieras que tus lectores vean.
Tantos códigos me han dado mucha sed ¿qué tal una cerveza?
 

Ciudad Blogger. Copyright 2008 All Rights Reserved Revolution Two Church theme by Brian Gardner Converted into Blogger Template by Bloganol dot com

Ir arriba Ir abajo