Bloggerinck

Botón de Twitter fijo en Blogger

noreply@blogger.com (Tecnocgh) — Fri, 13 Aug 2010 16:31:00 -0700

En esta oportunidad voy a enseñarles a crear y añadir un botón de Twitter fijo.

La ventaja de este botón de Twitter fijo es que será siempre visible no importa en que parte del blog estemos situados, lo cual llamará mucho más la atención de los visitantes logrando así ganar nuevos seguidores.

Añadir el botón de Twitter fijo en Blogger es realmente muy sencillo, y para ello debemos ir a la edición HTML de la plantilla (Diseño > Edición HTML) y buscar por este código:

<div id='main-wrapper'>

Luego debemos pegar el siguiente código justo antes del anterior:

<div id="twitterfijo">
<a style="display:scroll;position:fixed;bottom:345px;right:0px;" href="URL-DE-TWITTER">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-gg9Cf8bRWd9jWGRQ0u_n9v3h6Dwfp-tioY8KhTFHkVJdyjNDsNQOExKjlSm6siLPmHSGpWS5-GK0RROWzt8Pxu_J0YLEr7A3XtXIZ82PfuV8B5LgA9jw5WtowAZTq0QkmLajEADa_VQ/s320/66666.png"/></a>
</div>

Antes de guardar los cambios debemos hacer una modificación: donde dice URL-DE-TWITTER debes ingresar la URL de tu perfil de Twitter para que te sigan.
También podes modificar la imagen cambiando lo que aparece en color rojo por la url de tu imagen.
Hacemos vista previa, y si todo está en condiciones ya podemos guardar los cambios y tenemos el botón de Twitter fijo en Blogger.

noreply@blogger.com (Tecnocgh) — Mon, 9 Aug 2010 16:42:00 -0700

Este es un truco muy sencillo y de gran utilidad. Se trata de una lista con los títulos de tus publicaciones, que va cambiando. De esta manera se invita a los que llegan al blog a que lean diferentes entradas y no solamente las últimas. Te animo a usarlo. Es simple de colocar y si no te gusta... lo retiras y listo. No hay que tocar la plantilla.
Comenzamos: En síntesis, copiar este codigo colocando tu URL donde está el pedacito destacado en rojo.

1- Lo que tenes que hacer es Copiar y pegar el código que dejo abajo en un Gadget HTML. Para hacer esto tenes que ir a Diseño>Elementos de la pagina>Añadir un Gadget>HTML/Javascript,
2- Allí pegamos el siguiente código:

<div id="random-posts">
<script type="text/javascript">
function getRandomPosts(json) {
var maxEntries = 10;
var numPosts = json.feed.openSearch$totalResults.$t;
var indexPosts = new Array();
for (var i = 0; i < numPosts; ++i) {
indexPosts[i] = i;
}
indexPosts.sort(function() {return 0.5 - Math.random()});
if (maxEntries > numPosts) {
maxEntries = numPosts;
}
var container = document.getElementById('random-posts');
var ul = document.createElement('ul');
for (i = 0; i < maxEntries; ++i) {
var entry = json.feed.entry[indexPosts[i]];
var li = document.createElement('li');
var a = document.createElement('a');
a.title = entry.title.$t;
for (var j = 0; j < entry.link.length; ++j) {
if (entry.link[j].rel == 'alternate') {
a.href = entry.link[j].href;
break;
}
}
a.appendChild(document.createTextNode(entry.title.$t));
li.appendChild(a);
ul.appendChild(li);
}
container.appendChild(ul);
}
</script>
<script src="http://NOMBRE_DE_TU_BLOG.blogspot.com/feeds/posts/summary?alt=json-in-script&callback=getRandomPosts&max-results=999" type="text/javascript"></script>
</div>

3- Ahora modifica donde dice "NOMBRE DE TU BLOG". También puedes modificar la cantidad de enlaces que se mostrarán: 10 es lo que muestra este codigo.

4- Guardar los cambios. Listo.

Con esto ya tenemos instalado el gadget para mostrar entradas aleatorias .

Para que nos agreguen a FAVORITOS

noreply@blogger.com (Tecnocgh) — Mon, 9 Aug 2010 16:28:00 -0700

Este código les permitirá a tus lectores añadirlos a sus listas de FAVORITOS o MARCADORES.
Lo que tenes que hacer es Copiar y pegar el código que dejo abajo en un Gadget HTML. Para hacer esto tenes que ir a Diseño>Elementos de la pagina>Añadir un Gadget>HTML/Javascript,
<a href="javascript:window.external.AddFavorite('http://bloggerinck.blogspot.com','Bloggerink')"><small><font face="Verdana" size="2">Agregar a favoritos</font></small></a>

Ustedes reemplazarán los sectores: url del blog, nombre del blog, letra y tamaño.
Yo lo dejo como lo coloqué en el mío así les resulta mas sencillo identificar lo que van a reemplazar.
Lo copian, pegan en el bloc de notas, editan y a guardarlo en sus blogs.

Como mejorar un blog en 10 pasos

noreply@blogger.com (Tecnocgh) — Sun, 25 Jul 2010 06:23:00 -0700

Hay muchas formas de mejorar un blog, algunas implican inversión de dinero, otras no, pero sí de tiempo y esfuerzo. Entre las principales mejoras que se le pueden hacer a tu blog, están:

Comprarle un dominio. No es lo mismo que tu blog sea blog4u.blogspot.com o blog4u.wordpress.com, a que sea blog4u.com por ejemplo. Un dominio independiente te permite ser dueño de tu propia marca y conservarla junto con su pagerank.
Comprarle un hosting. Este paso te servirá si quieres modificar tu blog a tu antojo ya que los blogs alojados en wordpress.com tienen muchas limitaciones. De este modo además podrás almacenar todas las fotos que quieras para tus posts.
Cambiarle de theme(plantilla). Tanto para wordpress como para blogger existen numerosas plantillas gratuitas por todo internet. Sólo asegurate de guardar tu plantilla antigua por si la necesitas y sé consciente de que al cambiar de plantilla tendrás que volver a agregar todos tus artilugios de nuevo(widgets, plugins, scripts, tus propias modificaciones, etc).
Incrementar el número de posts. Una de las formas más rápidas y simples de mejorar tu posicionamiento es escribir más y más posts. Cuantos más posts tengas, más posibilidades de haber escrito algo que los usuarios busquen y al mismo tiempo le das más opciones a Google para que te posicione. Sin mencionar los posibles enlaces que podrías conseguir si el contendio de tus posts es interesante. Por ejemplo si escribías 2 veces a la semana, sube a 3, si escribías 3, sube a 4 y así según tus posibilidades.
Enganchar a tus lectores. Dos de las muchas formas de hacerlo son: Publicitar tus feeds en tu sidebar y al final de cada post. Y darles la posibilidad de seguir posibles comentarios en un post de su interés(wordpress).
Empezar a usar twitter. Tanto como para conocer nuevos bloggers, conseguir lectores y publicitar tus posts.
Interactuar con la blogósfera. Puedes participar en iniciativas, sorteos y concursos organizados por otros blogs. Simplemente con participar irás conociendo otros blogs y bloggers, y al mismo tiempo tu blog será conocido por ellos.
Incluye referencias en tus posts. A veces cuando escribimos algo, lo hacemos basados en nuestros conocimientos previos o en información que vamos encontrando por internet. Pero para nuestros lectores que probablemente no estén muy familiarizados con el tema, les será mucho mas útil que también enlacemos algunas posibles fuentes que nos hayan servido. De ese modo nuestro blog les habrá sido realmente útil.
Promociona tu blog. Te recomiendo inscribirte en Blogalaxia, en Blogupp y enviar tus noticias a Apezz para empezar.
Poténcialo con complementos. Aprovecha todos los widgets, plugins y demás cosas que puedas agregarle a tu blog siempre y cuando sean realmente útiles, no como un mero adorno. Además, colocar imágenes y videos que guarden relación con tus posts o en tu sidebar, es algo que le dará un plus a tu blog.

Finalmente

No es necesario hacer todos los cambios ni hacerlos todos de una sola vez, se pueden hacer gradualmente y probando sus resultados. Cualquier cosa que agreguemos la podremos sacar luego si no nos gusta.
Siempre que le dediquemos algo más tiempo y esmero del que ya le dedicamos, mejoraremos nuestro blog.
Y ustedes, qué han hecho para mejorar su blog?

Como poner la letra capital en las entradas

noreply@blogger.com (Tecnocgh) — Fri, 23 Jul 2010 18:01:00 -0700

Una vez que realices los cambios te quedara la letra capital así de grande cada vez que publiques algo

Como poner la letra capital al inicio de cada entrada.

Lo único que hay que hacer es agregar el pseudo-elemento first-letter que hará que tome la primera letra del texto y le aplique los estilos que hayamos elegido.

Para realizarlo sólo entra en Diseño | Edición de HTML y antes de ]]></b:skin> lo siguiente:

.post-body:first-letter {
font-size: 40px;
color: #0B243B;
padding-right: 2px;
}

A partir de ahí ya aparecerá la letra capital en todas las entradas, pero también puedes agregar otros estilos a la letra, tales como el tipo de fuente, grosor, etc.

Estos son algunos otros atributos que puedes agregar:

font-weight: bold; /* letra en negrita */
font-family: Arial; /* tipo de letra */
font-style: italic; /* letra cursiva */

El procedimiento es muy sencillo y se puede aplicar a muchas áreas, por ejemplo:

Si quieres que los comentarios también tengan letra capital agrega esto:

.comment-body:first-letter {
font-size: 40px;
color: #0B243B;
padding-right: 2px;
}

Si quieres que el título de las entradas tenga letra capital agrega esto:

.post h3 a:first-letter {
font-size: 40px;
color: #0B243B;
padding-right: 2px;
}

Si quieres que el título del blog tenga letra capital agrega esto:

#header h1:first-letter {
font-size: 40px;
color: #0B243B;
padding-right: 2px;
}

Si quieres que los bloques entrecomillados tengan letra capital agrega esto:

.post-body blockquote:first-letter {
font-size: 40px;
color: #0B243B;
padding-right: 2px;
}

Consideraciones finales:

Funciona en todos los navegadores.
Si hubiera una imagen antes del texto entonces no se mostrará la letra capital.
Si la letra capital tuviera un signo antes o después de ella estas también se verán afectadas con los estilos.

Flecha o (Botón) para ir hacia arriba o hacia abajo

noreply@blogger.com (Tecnocgh) — Tue, 20 Jul 2010 16:37:00 -0700

Colocar las flechas o indicar con un cartel para navegar mas rápido por la página del blog , sobre todo si tu post es extenso.

Este truco tiene dos partes.
Primera: se trata de colocar un script antes de </head> .
Vas a Diseño > HTML > y busca </head>. Recuerda que puedes usar Ctrl. + F para acelerar la búsqueda.

Justito antes de pegas este código.

<script src='http://www.google.com/jsapi'/>

<script>

google.load("prototype","1.6.0.3");

google.load("scriptaculous", "1.8.2");

</script>

Guarda el cambio.
Segunda parte: ahora vamos a las flechitas y la posición en tu blog. Debes buscar </body> . Vuelve a usar Ctr. + F. Justito antes pega este código:

<a href='#outer-wrapper' onclick='new Effect.ScrollTo("outer-wrapper",{offset:-140}); return false'><img border='0' src='URL de la imagen' style='position:fixed; top:0; right:0;' title='Arriba'/></a>

Reemplaza donde dice URL de la imagen por la imagen que quieras usar. Puede ser una flecha, un cartelito, lo que desees.
Si quieres uno completo te lo dejo armado a continuación, así lo insertas y listo.

Guarda los cambios.

Verás a la derecha de tu blog las imágenes, para subir y bajar por el blog con efecto deslizante. Les dejo una página con miles de íconos. Este es el enlace a las flechas (arrows).http://icons.mysitemyway.com/free-icons-clipart-tagged/arrow/748/.
Espero les sea útil.Saludos y una excelente semana!

Nuevos Botones oficiales para “compartir” en Blogger

noreply@blogger.com (Tecnocgh) — Mon, 19 Jul 2010 17:46:00 -0700

Blogger ha agregado un nuevo detalle a su plataforma, se trata de botones para compartir el contenido de un post en servicios sociales como: Facebook, Twitter, Blogger, Google Buzz y el mail de toda la vida.

¿Cómo agregarlos?

Primero hay que activarlos en:

Escritorio → Diseño → Blog Posts → Editar

Si con esto no se muestran en tu blog, seguramente tienes una plantilla modificada, así que hay que agregar el código manualmente. En el código de tu plantilla (Escritorio → Diseño → Edición de HTML → Expandir plantilla de artilugios ), busca algo como lo siguiente:

<div class='post-footer-line post-footer-line-3'>

Nota: también puedes buscar por post-footer-line-2 o post-footer-line-1.

Justo después agrega el siguiente código:

<div class='post-share-buttons'><b:include data='post' name='shareButtons'/></div>

Ten cuidado de que las etiquetas se abran y cierren correctamente, de otro modo, obtendrás un error.

Personalización

A partir de las clases que Blogger pone por defecto, es posible dar estilos a estos iconos y así personalizar su ubicación, dimensiones o cualquier otra propiedad con CSS. Las clases que agrega Blogger son:

.post-share-buttons {} /* Contenedor de los botones */

.share-button {} /* Aplicada a todos los botones */

.sb-email {} /* Botón para compartir por email */

.sb-blog {} /* Botón para compartir en un blog de Blogger */

.sb-twitter {} /* Botón para compartir en un Twitter */

.sb-facebook {} /* Botón para compartir en un Facebook */

.sb-buzz {} /* Botón para compartir en un Google Buzz */

Conclusión

Fieles a su costumbre, Blogger llega años tarde con características que sus usuarios ya usaban sin su ayuda. Me parece que la opción es completa, pues ofrece los servicios más usados por los usuarios: Facebook, Twitter y el correo electrónico. Este último, quizá es el mayor aporte de esta función, pues agrega una nueva página con un formulario fácil de usar, que además hace uso de los contactos guardados en GMail.

Blogger ahora hay estadísticas en tiempo real

noreply@blogger.com (Tecnocgh) — Sun, 18 Jul 2010 13:04:00 -0700

Blogger in Draft presenta una característica: Estadísticas web desde el panel de Blogger. Este sistema de estadísticas es independiente de Google Analytics y tiene como principal característica brincar datos casi en tiempo real.

¿Cómo funciona?

Por ahora, solo esta disponible entrando desde Blogger in Draft ( draft.blogger.com ), una vez ahí existe una nueva pestaña en cada blog llamada, precisamente, estadísticas, que a su vez, se divide en 4 secciones:

1. Visión general

2. Posts o entradas.

Que muestra las estadísticas de los posts, pero también de las páginas estáticas.

3. Fuentes de tráfico.

Con las búsquedas que traen más tráfico y las páginas que nos envían más visitantes.

4. Audiencia.

Con información general sobre los visitantes: País de procedencia, navegador y sistema operativo usado.

Por ahora no funciona en blogs privados.

Conclusión

El sistema de estadísticas de Blogger es muy básico y no reemplaza a soluciones como Google Analytics, sin embargo, como una herramienta de acceso rápido para tener una idea de lo que pasa en nuestro blog en eso momento ¡es estupenda!

Además tiene la ventaja de que no requiere la instalación de script alguno y es compatible con otros sistemas de estadísticas, como el ya mencionado Analytics.

Fechas más amigables en Blogger

noreply@blogger.com (Tecnocgh) — Sun, 18 Jul 2010 12:49:00 -0700

Colocar fechas relativas o el tiempo transcurrido entre dos fechas (ejemplo: Publicado hace 2 días), es más amigable de interpretar que una fecha como tal. Este tipo de fechas son muy comunes en servicios como Twitter o Facebook

En Blogger es posible crear también este tipo de fechas con un poco de javascript y agregando un par de cosas en la plantilla, de manera muy rápida.

Procedimiento:

1. Entra al código de tu plantilla ( Escritorio → Diseño → Edición HTML → Expandir plantilla de artilugios ) y justo después del siguiente código: ]]></b:skin>

Añade el siguiente script:

/* Fechas amigables en Blogger: http://blogandweb.com/2784 */

function timeAgo(date1,date2,granularity){var self=this;periods=[];periods['semana']=604800;periods['día']=86400;periods['hora']=3600;if(!granularity){granularity=5;}

(typeof(date1)=='string')?date1=new Date(date1).getTime()/1000:date1=new Date().getTime()/1000;(typeof(date2)=='string')?date2=new Date(date2).getTime()/1000:date2=new Date().getTime()/1000;if(date1>date2){difference=date1-date2;}else{difference=date2-date1;}

output='';for(var period in periods){var value=periods[period];if(difference>=value){time=Math.floor(difference/value);difference%=value;output=output+time+' ';if(time>1){output=output+period+'s ';}else{output=output+period+' ';}}

granularity--;if(granularity==0){break;}}

return'Hace '+output;}

$(document).ready(function(){});

</script>

2. Ahora busca: <data:post.dateHeader/>

Nota: recuerda tener los artilugios expandidos o no encontraras este código.

Y sustitúyelo con:

3. El último paso es cambiar el formato de fecha para que sea compatible con el script entra a:Escritorio → Configuración → Formato → Formato de cabecera de fecha. Y cambia el formato de fecha por el sexto de arriba hacia abajo, es tipo: 7/18/2010. Guarda los cambios.

Y listo.

Compara ¿Qué tan rápido es tu sitio? con otros

noreply@blogger.com (Tecnocgh) — Sun, 18 Jul 2010 12:13:00 -0700

La velocidad de carga de un sitio web es uno de los factores más importantes para una buena experiencia al usuario, adicionalmente, Google ya ha comentado que es un factor que toma en cuenta en el posicionamiento en su buscador.

Captura:

Una manera hasta divertida de leer la velocidad de carga es Which loads faster con el que puedes poner a competir tu sitio con otro y ver quien carga más rápido. Incluso puedes comparar con varias repeticiones (repeat) o hacer una competencia con varias páginas.

Sitio para realizar la prueba: whichloadsfaster.com

Mapa 3D con contador de visitas

noreply@blogger.com (Tecnocgh) — Thu, 8 Jul 2010 19:25:00 -0700

Bueno hoy les voy a explicar como poner este contador de visitas como el que ves en este blog

Manos a la obra:
1- Tenes que entrar al enlace. http://www.revolvermaps.com/?target=setup
2- Luego podes configurar el mapa a tu gusto
3- Copias el código y guardar en una cajita HTML Para hacer esto tenes que ir a Diseño>Elementos de la pagina>Añadir un Gadget>HTML/Javascript. Pegas el código y le pones un titulo el que vos quieras ,Presionas guardar y listo entras a tu blog y te quedara así

4- Tambien pueden hacer un boton como este,
que indica el lugar donde vives o te conectas.Para esto tenes que entrar al siguiente enlace http://www.revolvermaps.com/?target=setupbutton y realizas el mismo procedimiento que en el anterior También le podes cambiar los colores como al otro. La verdad queda muy lindo. Espero que te sirva.

Como poner Leer más automático menos en el primer post

noreply@blogger.com (Tecnocgh) — Thu, 8 Jul 2010 19:23:00 -0700

Guarda siempre una copia de tu plantilla. Utiliza la vista previa.. Para buscar elementos en la plantilla utiliza Ctrl + f .

Lo primero que haremos será aplicar el leer más automático en todas las entradas, así que primero vamos a Diseño | Edición de HTML marcamos la casilla Expandir plantillas de artilugios y buscamos esta etiqueta:

<data:post.body/>

Y la sustituimos por esto:

<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<div style='text-align:justify;' expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
<span class='rmlink' style='float:right;'><a expr:href='data:post.url'>Leer más...</a></span>
</b:if></b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>
<b:if cond='data:blog.pageType == "static_page"'><data:post.body/></b:if>

Ahora antes de </head> pegamos este script:

<script type='text/javascript'>
summary_noimg = 400;
summary_img = 300;
img_thumb_height = 125;
img_thumb_width = 125;
</script>
<script type='text/javascript'>
//<![CDATA[
/******************************************
(C)2008 by Anhvo
visit http://en.vietwebguide.com to get more cool hacks
********************************************/
function removeHtmlTag(strx,chop){
if(strx.indexOf("<")!=-1)
{
var s = strx.split("<");
for(var i=0;i<s.length;i++){
if(s[i].indexOf(">")!=-1){
s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}

function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;
if(img.length>=1) {
imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}

var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}

//]]>
</script>

Con esto ya tenemos el leer más en todas las entradas, ahora haremos que no se aplique en la primera entrada, para lograrlo buscamos esta línea:

<b:include data='post' name='post'/>

Y la cambiamos por esto:

<b:if cond='data:post.isFirstPost'>
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<div class='post hentry'>

<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>

<div class='post-body entry-content'>
<p><data:post.body/></p>
</div>

<div class='post-footer'>
<div class='post-footer-line post-footer-line-1'>
<span class='post-author vcard'>
<b:if cond='data:top.showAuthor'>
<data:top.authorLabel/>
<span class='fn'><data:post.author/></span>
</b:if>
</span>

<span class='reaction-buttons'>
<b:if cond='data:top.showReactions'>
<table border='0' cellpadding='0' cellspacing='0' width='100%'><tr>
<td class='reactions-label-cell' nowrap='nowrap' valign='top' width='1%'>
<span class='reactions-label'>
<data:top.reactionsLabel/></span> </td>
<td><iframe allowtransparency='true' class='reactions-iframe' expr:src='data:post.reactionsUrl' frameborder='0' name='reactions' scrolling='no'/></td>
</tr></table>
</b:if>
</span>

<span class='post-comment-link'>
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
</b:if>
</b:if>
</b:if>
</span>
<span class='post-icons'>

<b:if cond='data:post.emailPostUrl'>
<span class='item-action'>
<a expr:href='data:post.emailPostUrl' expr:title='data:top.emailPostMsg'>
<img alt='' class='icon-action' height='13' src='http://img1.blogblog.com/img/icon18_email.gif' width='18'/>
</a>
</span>
</b:if>
</span>
</div>
<div class='post-footer-line post-footer-line-2'>
<span class='post-labels'>
<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>
</b:loop>
</b:if>
</span>
</div>

</div>
</div>
<b:else/>
<b:include data='post' name='post'/>
</b:if>
<b:else/>
<b:include data='post' name='post'/>
</b:if>

Y listo, con eso ya tenemos el leer automático con miniaturas menos en la primera entrada de la página principal.

Imagen flotante en el blog

noreply@blogger.com (Tecnocgh) — Thu, 8 Jul 2010 16:59:00 -0700

Para poner una imagen flotante lo que tienes que hacer es poner el codigo que dejo abajo en una caja HTML para hacer esto tienes que ir a Diseño>Elementos de la pagina>Añadir un Gadget>HTML/Javascript Pero antes... debes decidir qué imagen colocar.

Acá te dejo el código

<img style="display: scroll; position: fixed; bottom: 10px; left: 10px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi84iGf-V-cg49Jgx36AOjwR0gN_x7RypdW2XUF-kiq_14VHQZLQAbV7YuDT_XCjIysYUV82J5l9W09-0XY4e0c27n2qVMZ-q45yTE1jt_N56P6shXeiBwomjqPYJbnTRavLt-mWSMNSFI/s320/vv.png"/>

Ustedes podrán reemplazar la parte verde, que es la URL de la imagen de mi imágen.

Tambien podes buscar IMAGENES en el buscador de Google, abrir la imagen elegida y copiar la URL. ( Botón derecho del ratón > opción Propiedades > URL. Entonces la reemplazan por la que yo les puse en verde.
Para los más detallistas: pueden cambiar la posición de la imagen reemplazando left (izquierdo) por right (derecho) según el lado en que quieran ubicarla y bottom (abajo) por top (arriba).

Culquier duda pregunten espero que les sirva.

Titulo Parpadeante en la pestaña

noreply@blogger.com (Tecnocgh) — Wed, 7 Jul 2010 17:19:00 -0700

Hola Gente acá les explico como poner títulos parpadeantes en la pestaña como aparece acá en Bloggerinck lo que lo hace llamativo y sobresalta de las demás pestañas destacandonos del resto. Puedes colocar una frase, el titulo de tu blog, lo que desees.
Empecemos:

Lo que tenes que hacer es Copiar y pegar el código que dejo abajo en un Gadget HTML. Para hacer esto tenes que ir a Diseño>Elementos de la pagina>Añadir un Gadget>HTML/Javascript, reemplazando la parte en verde con el texto que quieras, presionas guardar y ya esta entras en tu blog y veras como queda .

<!—Mas trucos en Bloggerinck --><SCRIPT LANGUAGE="JavaScript">

var txt=" :-) Aquí va tu texto - Bienvenidos - ";

var espera=100;

var refresco=null;

function rotulo_title() {

document.title=txt;

txt=txt.substring(1,txt.length)+txt.charAt(0);

refresco=setTimeout("rotulo_title()",espera);}

rotulo_title();

</SCRIPT>

Bueno espero que te haya quedado bien Gracias por tu visita y vuelve cuando quieras.

Como Modificar el gadget de búsqueda de Blogger

noreply@blogger.com (Tecnocgh) — Mon, 5 Jul 2010 19:29:00 -0700

Desde que Blogger publicó el gadget "Cuadro de búsqueda", son muchos los que se habrán preguntado cómo se puede modificar y así darle un estilo más atractivo y personal. En definitiva, adaptarlo más al diseño de tu blog.
Aunque este gadget presenta algunos parámetros de configuración, todos son referidos a la búsqueda y no a la imagen o diseño del mismo. Bueno, acá te voy a explicar como añadiendo unos sencillos códigos en tu plantilla, vas a poder modificarlo y adaptarlo a tu gusto.
El aspecto que este gadget presenta es este:

Y así podrás verlo una vez que lo modifiquemos :

Y he quitado la publicidad de Google. A continuación explico cómo hacerlo.

Eliminar la publicidad inferior de Google:

]]></b:skin>

.gsc-branding-text {display:none;}
.gsc-branding-img-noclear {display:none;}

Personalizar el botón de "Buscar":

input.gsc-search-button {
color: #ffffff;
height: 31px;
font-weight:bold;
font-size: 14px;
background: #cc0000;
border: 1px solid #000000;
}

color:

height:

width: 30px;

font-weight:

font-size:

background:

background: url('URL COMPLETA DE LA IMAGEN') no-repeat;

border:

Blogger

Personalizar la caja de búsqueda:

input.gsc-input {
color: #cc0000;
background: #e6e6e6;
}

color:

background:

Fuente

Como crear un blog

noreply@blogger.com (Tecnocgh) — Sun, 4 Jul 2010 07:32:00 -0700

Muchas personas se preguntan como hacer su propio blog hoy en día.
Se puede optar por usar muchas alternativas gratuitas, algunas de ellas verdaderamente profesionales. Algunas personas creen que hacerse un blog pude ser bastante difícil (saber programación, diseño, etc.) y es que en realidad tiene algo de cierto, pero a veces puede resultar un trabajo bastante divertido, y digo divertido porque para promocionar un blog hay que relacionarse con más bloggers, comentar en otros blogs etc.

Una vez decidido el tema y sabiendo algunas cosas antes de crear tu blog, ya puedes proceder a crear tu blog:

Eligiendo la plataforma

Elegir la plataforma es lo principal que debe hacer alguien que necesite crear un blog, la primera alternativa es Blogger o Blogspot como la conocen algunos, si quieren evitar perder el tiempo con la instalación del CMS esta es su opción, de lo contrario si quieren algo más profesionaldeben usar WordPress.

Para este último tienen dos alternativas, o crearse un blog desde el sitio web oficial o descargarlo e instalarlo en un hosting desde 0.
Una vez elegida la plataforma ya sabrás si vas a necesitar donde alojar tu web o no, es decir contratar un hosting o usar un hosting gratuito.

Crear blog en Blogger

Esta es la opción recomendada si es la primera vez que creas un blog. No necesitas casi ningún conocimiento especializado.
El video te da una idea de como hacerlo.

Crear blog en WordPress.com

Esta opción requiere de mayores conocimientos pero te da más libertad para hacer cualquier cosa con tu blog. Si vas en serio y vas a invertir en tu blog, usar wordpress alojado por ti mismo sería lo ideal.
Si quieres usar wordpress pero no tomarte la molestia de buscar hosting, puedes seguir los pasos del siguiente video.

Elegir la apariencia de tu blog

Otra cosa muy importante es elegir la apariencia de tu blog, es decir un theme o skin. Esto es importante ya que si quieres algo profesional debes elegir una buena plantilla que te permita modificar los espacios, ya sea para vender espacios publicitarios u otra necesidad.

Si quieres algo más personal pues una plantilla a tu gusto no esta mal, pero siempre debes tener en cuenta que hay algunas cosas que son importantes al elegir un template y así poder tener éxito.

Instalar todos los plugins necesarios

Es verdaderamente importante “preparar tu blog” antes de darlo a conocer o hacerle promoción en directorios, por eso debes instalar todos los plugins necesarios o puedes mirar en este artículo un listado de plugins básicosque son recomendados para su instalación y si no sabes como instalar un plugin de WordPress en otro artículo de TensaiWeb puedes ver como instalar plugins en WordPress.

Escribe cosas interesantes

Esto si que es importante, ya que el contenido de tu blog será lo que tus futuros lectores entrarán a ver. Tienes dos posibilidades o escribir muchoo hacer artículos de calidad y pocos, cuando digo artículos de calidad me refiero a crear entradas interesantes y que mucha gente busca es decir cosas que se encuentran fácilmente en un buscador escribiendo descripciones comunes.

Si careces de tiempo para redactar varios diarios artículos puedes leer esta entrada sobre “como redactar si el tiempo es poco” teniendo cuenta claro que lo que hay que hacer en estos casos es hacer entradas de calidad.

Finalmente

Crearse un blog es fácil, espero que esto le haya servido de guía a aquellos que no tenían idea de como crearse un blog

Via