Agregar responder comentario en Blogger.

Para agregar el botón:

1.- Vamos a Diseño luego a Edición HTML y Expandir plantillas de artilugios.

2.- Ahora buscamos el siguiente código <b:include data='comment' name='commentDeleteIcon'/> </span> y debajo pegamos este código (Si pegamos abajo de este código el botón estará al costado de cada autor de comentario):

<span class='comment-reply'>
<a expr:href='"https://www.blogger.com/comment.g?blogID=ID_DE_TU_BLOG

&postID=" + data:post.id + "

&isPopup=true&postBody=%40%3C%61%20%68%72%65%66%3D%22%23" + 

data:comment.anchorName + "%22%3E" + data:comment.author + 

"%3C%2F%61%3E#form"' 

onclick='javascript:window.open(this.href, "bloggerPopup", 

"toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=yes,width=400,

height=450"); return false;'>RESPONDER</a>
</span>

 4.- Modificamos ID_DE_TU_BLOG por tu id de tu blogger como lo conseguimos muy fácil vamos Diseño en la url veremos la id que son solo los números los copiamos y los pegamos en su lugar de ID_DE_TU_BLOG. Como se muestra la imagen siguiente:

3.- Por ultimo Guardamos.

Si deseamos podemos sustituir RESPONDER por una imagen solo remplazamos por este código:

<img src="URL_DE_LA_IMAGEN_AQUI"/>

Cómo compartir las entradas de Blogger en Google+.

Para los usuarios de blogger el poder compartir sus entradas con sus amigos (circulos) de google+ ha sido unas de las opciones más esperadas. En el mes de octubre del pasado año Google nos indicaba la posibilidad de cambiar de perfil del que usamos en Blogger, por el que creamos en Google+. 


 Ahora está interrelación ha dado un paso más y ya es posible compartir nuestras entradas directamente en nuestra cuenta de Google+.


¿Donde indicar que queremos compartir nuestras entradas de blogger?
* Tenemos que conectarnos a nuestra cuenta de blogger.
* Vamos a la pestaña configuración y luego hacemos clic en Entradas y comentarios. 
* En la lista de Compartir en Google+, seleccionamos si y guardamos la configuración.

Ahora cada vez que se publique algo, automáticamente te dará la opción de compartirlo a los circulos sociales que le indiques de Google+. Con está opción de ahora en adelante no tendrás que copiar y pegar la entrada para colocarla en el botón de compartir.

---

Los invitó a dejar su comentario lo cuál nos ayuda a mejorar nuestras publicaciones, si les ha gustado está publicación, y no quieren perderse alguna otra pueden seguirnos en: FACEBOOK y/o RSS.

Situar un gadget junto al titulo del blog o en otro sitio cualquiera.

Un buen lugar para colocar gadgets, es en la parte superior del blog, más o menos a la altura del titulo, o sea dentro de la cabecera. Esto hace que el lugar de entradas quede más limpio. 

Las modificaciones las podemos hacer desde la plantilla para esto vamos a hacer lo siguiente:  

Lo primero que haremos será acceder a Plantilla ► Edición HTML para modificar las sección que corresponde a la cabecera de manera que nos admita un widget o más widgets. Por defecto esta parte viene con unos parametros maxwidgets y showaddelement.

Buscamos el siguiente código: 

<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>

Ahora cambiamos los parámetros

maxwidgets = '2' //esto nos permite que podamos poner otro gadget a parte del titulo. 

showaddelement="yes" //para que podamos agregar elementos.

Y con esto ya podemos agregar un gadget cualquiera en la parte superior. 

Numerar comentarios en blogger.

Comenzando con nuestro primer post del año 2012, les traigo como enumerar los comentarios que recibimos en nuestro blogger. Para comenzar a realizar lo que tenemos que hacer es ir:
DISEÑO --> EDICIÓN HTML --> EXPANDIR PLANTILLA DE ARTILUGIOS. 


Ahora lo primero que haremos será buscar el siguiente código, podemos ayudarnos de CTRL + F:

<b:loop values='data:post.comments' var='comment'>

Encima de lo antes encontrado pegamos lo siguiente:

<script type='text/javascript'>var num_comm = 1;</script>

Y después pegamos lo siguiente:

<a class='num_comments' expr:href='data:blog.url + "#comment-" + data:comment.anchorName' expr:id='"comment-" + data:comment.anchorName' expr:title='"Comentario hecho por " + data:comment.author'><script type='text/javascript'>document.write(num_comm); num_comm=num_comm+1 ;</script></a>

Ahora buscamos lo siguiente:

]]></b:skin>

Y pegamos lo siguiente antes de lo anterior: 

/* Numeracion de comentarios */
.num_comments { 
color:#0101DF;
float:right;
text-decoration:none;
font-size:24px;
}

De esta manera ya debe quedar listo, tendremos nuestros comentarios enumerados.

Optimizar los títulos en blogger.

Optimizar los títulos de las entradas en Blogger es importante ya que nos hace obtener más visitas. Esto había dejado de funcionar anteriormente pero ahora es posible de nuevo se ha agregado un nuevo código el cuál nos da la posibilidad de hacer la tarea que antes.

El código permite mostrar el nombre de la entrada sin traer consigo el nombre del blog. Para optimizar los títulos podemos realizar lo siguiente:

1. Dirígete a la pestaña “Diseño” y posteriormente a la opción “Edición HTML”.
2. Busca el código correspondiente a los títulos:

   <title><data:blog.pageTitle/></title>

3. Sustituye ese código por el siguiente condicional:

   <b:if cond='data:blog.pageType == "item"'>
    <title><data:blog.pageName/> | <data:blog.title/></title>
   <b:else/>
    <title><data:blog.pageTitle/></title>
   </b:if>

Poner botón y al presionarlo mostrar bóton ME gusta de Facebook.

Lo que aprenderemos a hacer es un botón que al ser pulsado mostrara un botón adicional en el cuál podemos darle me gusta o sea el botón me gusta. Esto lo vamos a hacer de una manera sencilla utilizando código JavaScript y código XHTML. 

Lo que queremos hacer es algo como esto: 

Fig. 1.1 Al presionar aparecera la fig. 1.2

Fig. 1.2

Eso es lo que haremos colocaremos el botón y al ser presionaro aparecera el botón de Me gusta, como hacer eso, sinceramente admito que a mi no se me ha ocurrido yo lo he visto en ciudadblogger.com pero no he visto en ningún lugar como hacerlo simplemente comencé a realizarlo desde 0. 

Entramos a PLANTILLA --> EDICIÓN HTML. 

Pegamos esto antes de </head>. 

<script> var i=false; function mostrarface() { if (i== false) { i=true; document.getElementById('veoFacebook').style.visibility='visible'; } else { i=false; document.getElementById('veoFacebook').style.visibility='hidden'; } } </script>

Pegamos esto antes de </body>. 

<p align="right" style="display:scroll;position:fixed;bottom:30px;right:200px;"><b> <span id="botonenviar"></span> <input style="position:absolute; height: 49px; width: 200px;" type="button" id="gusta" name="gusta" value="Te gusta Trucos con Blogger?" onclick="mostrarface();"/> </b> </p> <div name="veoFacebook" id="veoFacebook" class="fb-like" data-href="http://www.facebook.com/Mundoenlaweb" data-send="false" data-layout="box_count" data-width="60" data-show-faces="false" align="right" style="display:scroll;position:fixed;bottom:50px;right:140px;visibility:hidden;"></div>

Donde tengo el código en color rojo pondrás el código que te genera el face para tu propio botón de me gusta.

Esto lo podemos visualizar en esté blog, al dar click aparece el botón de me gusta de facebook el botón se encuentra situado en está página en la parte inferior.
De cualquier manera si tienes dudas puedes dejarme un comentario. Saludos. Espero que les sirva.

Poner Bordes a Entradas y Gadgets.

Algunas veces las plantillas son muy planas y nos hacen sentir que las entradas se pierdan entre ellos mismos en donde empiezan y en donde terminan las entradas. Así que una opción para delimitar esto puede ser colocar bordes a cada uno de estos espacios. Podemos elegir si se lo aplicamos solo a las entradas o únicamente a los gadgets.

Veamos pues cómo enmarcar entradas y gadgets tanto en las plantillas "nuevas" como en las "antiguas" de Blogger. Para cualquiera de las dos entra en Diseño | Edición de HTML, y ahora...

Para plantillas hechas con el Diseñador de plantillas de Blogger

Antes de ]]></b:skin> agrega esto:

.post-outer {
border: 1px solid #000;
border-radius:0px;
-moz-border-radius:0px;
-webkit-border-radius:0px;
padding:15px;
margin: 20px 0;
}

.column-right-outer .widget, .column-left-outer .widget {
border: 1px solid #000;
border-radius:0px;
-moz-border-radius:0px;
-webkit-border-radius:0px;
padding:10px;
margin: 10px 0;
}

.footer-inner .widget {
border: 1px solid #000;
border-radius:0px;
-moz-border-radius:0px;
-webkit-border-radius:0px;
padding:10px;
margin: 10px 0;
}

Poner botón ir abajo e ir abajo.

Los botones arriba y abajo facilitan al usuario al desplazamiento sobre el contenido de la página, sobre todo esto es muy indispensable cuando en la página hay demasiadas entradas o cuando las entradas tienen muchos comentarios o demasiado texto. Ahora les explicare la manera de poner los botones arriba y abajo. 

Hasta el momento conocía manera pero en la web encontré una manera más sencilla de igual manera les pondré las dos maneras para que ustedes decidan cuál les agrada más. 

Entra en Diseño > Edición de HTML y antes de </body> pega lo siguiente:

Sin importar cuál forma utilicemos vamos a ver lo siguiente, si usamos la nueva plantilla de Blogger tenemos que hacer lo siguiente antes que nada: 

<div class='body-fauxcolumns'>

Y lo cambiaremos por lo siguiente:

<div id='outer-wrapper' class='body-fauxcolumns'>

Ahora buscaremos lo siguiente:

<div class='content-cap-bottom cap-bottom'>

y lo cambiaremos por esto:

<div id='footer-wrapper' class='content-cap-bottom cap-bottom'

FORMA QUE UTILIZÓ.

Lo primero que tienes que hacer antes de </head> pegamos el codigo siguiente: 

<!-- Prototype y Scriptaculous-->
<script src='http://www.google.com/jsapi'/>
<script>
google.load(&quot;prototype&quot;,&quot;1.6.0.3&quot;);
google.load(&quot;scriptaculous&quot;, &quot;1.8.2&quot;);
</script>
<!-- Prototype y Scriptaculous-->

Ahora antes de </body> pega lo siguiente:

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


<a href='#footer-wrapper' onclick='new Effect.ScrollTo(&quot;footer-wrapper&quot;,{offset:-140}); return false'><img border='0' src='URL de la imagen' style='position:fixed; bottom:400px; right:0;' title='Ir abajo'/></a>

Poner Páginas en Blogger de una manera sencilla.

Podemos poner la páginas en blogger de manera sencilla y rápida, ¿Cómo lo podemos hacer? si tu blogger aún no tiene la barra de paginas y quieres hacerla en este post te diremos cómo la hicimos nosotros de manera sencilla y rápida. 

Poner Páginas en blogger rápido y fácil. 

Este método consta de agregar el codigo CSS necesario en la plantilla y agregar un gadget HTML/Javascript únicamente. 

Agregar código en la plantilla. 

Diseño > Edición HTML > ahora buscamos lo siguiente ]]></b:skin> lo podemos usar presionando ctrl + f en nuestro navegador. 

Pegamos lo siguiente justo antes de la etiqueta encontrada. 

.showpageArea a {
text-decoration:underline;
}
.showpageNum a {
text-decoration:none;
border: 1px solid #cccccc;
margin:0 3px;
padding:3px;
}
.showpageNum a:hover {
border: 1px solid #cccccc;
background-color:#cccccc;
}
.showpagePoint {
color:#333;
text-decoration:none;
border: 1px solid #cccccc;
background: #cccccc;
margin:0 3px;
padding:3px;
}
.showpageOf {
text-decoration:none;
padding:3px;
margin: 0 3px 0 0;
}
.showpage a {
text-decoration:none;
border: 1px solid #cccccc;
padding:3px;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link,.showpage a:link {
text-decoration:none;
color:#333333;
}

Ahora ve a Diseño > Añadir gadget > elije HTML/Javascript y pega el siguiente código:

<style type='text/css'>.showpageArea a {text-decoration:underline;}.showpageNum a {text-decoration:none;border: 1px solid #cccccc;margin:0 3px;padding:3px;}.showpageNum a:hover {border: 1px solid #cccccc;background-color:#d10000;}.showpagePoint {color:#333;text-decoration:none;border: 1px solid #cccccc;background: #cccccc;margin:0 3px;padding:3px;}.showpageOf {text-decoration:none;padding:3px;margin: 0 3px 0 0;}.showpage a {text-decoration:none;border: 1px solid #cccccc;padding:3px;}.showpage a:hover {text-decoration:none;}.showpageNum a:link,.showpage a:link {text-decoration:none;color:#333333;}</style><script style='text/javascript'>var pageCount=5;var displayPageNum=5;var upPageWord="Anterior";var downPageWord="Siguiente";</script><script style='text/javascript' src='http://dl.dropbox.com/u/3373498/PazosBlogger-blogger-page-nav-v2.js.txt'></script>

Bueno aquí lo que tenemos que destacar principalmente es lo que remarcamos mas fuerte: 

var pageCount=5;   es el código para que muestre 5 entradas por cada página cambialo por el número que quieras. 

var displayPageNum=5; es el código para el número de páginas que habrá en la lista.

Importar contenido de mi blog a pagina en facebook.

Facebook se ha convertido en una herramienta que nos permite comercializar nuestros productos rápidamente, por lo que tener enlazado nuestro sitio web a facebook es muy importante si queremos crecer más rápidamente, existen varias formas para importar nuestro contenido desde nuestro sitio web a nuestra páginas de facebook y/o perfil de facebook. Ahora lo que utilizaremos es lo que a mi perspectiva es la manera más eficiente de utilizarlo vamos a usar una aplicación que se llama RSS Graffiti en Facebook. 

Esta aplicación nos permitirá enlazarnos fácilmente para compartir nuestro contenido: 

Lo primero que tenemos que hacer es buscar la aplicación y permitir el acceso y llegaremos a tener algo así como la imagen mostrada a la derecha. Vamos a presionar el botón Añadir feed. 

Para comenzar el proceso de la importación. 

Lo mas importante es llenar con el feed correcto de nuestro blogger para esto vamos a nuestro perfil de blog, seleccionamos configuraciones, otros y ahi encontramos Publicar URL direccionada al feed esa la colocamos en el campo URL de feed ya solo damos actualizar en la pantalla central de vista previa y nos mostra como se vera nuestras importaciones. 

Ahora solamente necesitamos guardar los cambios y tendremos activo para que cada publicación este apareciendo en nuestra página o perfil de facebook. 

Santa Claus en tu blog volando con su trineo.

Hola a todos, bueno ahora que estamos en este periodo navideño, ahora les traigo un pequeño script el cuál nos ayudara a adornar nuestro blogger, si pueden observar mi blog en estos momentos tiene o en algunos momentos aparecen regalos, copos de nieve, etc algunas cosas las cuales son relacionadas con navidad si ustedes quieren tenerlas ahora les dire como: tambien si visitan http://compuroo.blogspot.com veran un trineo con Santa Claus con destellos muy padre como el siguiente:

Para ponerlo sólo entra en la Edición HTML de la plantilla y agrega antes de </head> este script:

<!-- Santa Claus volando por el blog -->
<script type="text/javascript" src="http://blogparts.giffy.me/0017/parts.js" />
<!-- Santa Claus volando por el blog -->

SI deseas los destellos de cosas navideñas coloca lo siguiente en la Edición HTML de la plantilla y agrega antes de </head> este script:

<!-- Destellos de navidad -->
<script type="text/javascript" src="http://blogparts.giffy.me/0001/parts.js" />
<!-- Destellos de navidad  -->

Es todo lo que necesitas para darle a tus lectores un poco de vista navideña. Les comento que esté script lo he encontrado desde el siguiente sitio donde podrán ver más scripts como este: 

http://blogparts.giffy.me/

Saludos y felices fiestas.

Artisteer generador de plantillas.

Cuantos de nosotros no queremos crear una plantilla para nuestro blog de la manera que nos agrede, bueno yo lo he echo y pues bien o mal la plantilla la adecuamos a nuestro gusto. Existe un software que se conoce como Artisteer este software nos permite manipular nuestra plantilla. 

Artisteer es una aplicación para Windows aunque investigando encontré que también está para Mac, la cuál permite diseñar increíbles plantillas para Joombla, Blogger, Wordpress, Drupal, aplicaciones .NET, y cualquier sitio web estático sin la necesidades de tener conocimientos de programación web en especial sobre XHTML y CSS. El usuario puede modificar las estructuras, tipografía, menús, imágenes, texturas, etc. Además dispone de sugerencias que sirve para que tu plantilla quede mejor aún. 

Si deseas descargarlo hazlo aquí. 

Descargas
EL PACK DE ARCHIVOS:
http://www.mediafire.com/?8v83ce1r10zmee9

EL VIDEO TUTORIAL PARA QUE LO HAGAN PASO A PASO. 
http://www.mediafire.com/?bivlztpw084f7tm

Mostrar entradas de blog en facebook.

Para importar nuestras entras o mostrar nuestras entradas de blogger en nuestro facebook, lo podemos realizar de distintas maneras una manera relativamente fácil es la siguiente:

* En el cuadro de facebook buscar colocamos el siguiente nombre RSS Graffiti o vamos a la siguiente dirección:  RSS Graffiti.
* En la siguiente aplicación después de permitir lo único que hacemos es dar clic en el botón + add feed.

Lo único que debemos agregar es lo siguiente:
- Agregamos feed url, este lo encontramos en nuestro blogger, en configuración y vamos a otros, donde dice publicar url relacionada al feed, la copiamos y la pegamos donde no la pide en la aplicación RSS Graffiti.
- Source Name: Puedes colocar el nombre de tu blog.
- Source URL: Colocar la URL de tu página web.

Presionas el botón donde dice Preview ( Click here to generate previwe).
Si aparecen tus entras correctamente puedes guardarlo para que comience a trabajar en unos minutos en caso contrario repite los pasos principalmente revisa la URL del Feed que sea correcta.

Poner Botón "Me Gusta" en Blogger.

Desde hace ya tiempo facebook tiene pluggins sociales, estos pluggins pueden ser incorporados a cualquier sitio web, mediante un código que nos proporciona facebook (javascript/html). Entre otras cosas, existe lo que es un botón de Me Gusta. Este botón es el que vemos siempre en todas las publicaciones que existen en facebook y ahora está la posibilidad de poderlo tener en nuestra web.

Ventajas de contar con este pluggin en nuestra web. 

Las ventajas que para mi cuenta este servicio son: 

- Poder identificar que a los usuarios les gusta la información, citada en nuestra web. 

- Así también, sirve para que al momento de que el usuario pulsa el botón Me Gusta está compartiendo inmediatamente en su perfil información de nosotros para que nos ayude a ser visitados. 

Agregar el bóton "Me gusta" a Blogger. 

1.- Podemos ir a la siguiente página Personalizar Redes sociales, está nos proporciona una ventana para que nosotros podamos editar nuestro botón me gusta con las características que deseemos, es relativamente fácil solo hay que interactuar con los combos y botones nos ira mostrando el diseño. 

2.- Ahora, tenemos que presionar el botón de obtener código, una vez que tengamos el código, vamos a (Incio --> Plantilla --> Edición de HTML) y pegamos el primer código que nos proporciono en sencillo para encontrarlo solo pulsen Ctrl + F y escriban sobre el patrón de busqueda la palbra y abajo de ella pegamos nuestro código. 

Nota: Les recomiendo dejar un comentario para posteriores accesos saber de que se trata ese código para colocar un comentario en la plantilla, sería de la siguiente manera: 

3.- El siguiente paso es guardar la plantilla, una vez guardada cerramos y vamos a la vista de diseño donde agregaremos el segundo codigo proporcionado por facebook. Guardamos y ya podemos ver nuestra web con el botón listo, lo pueden ver en está web, en la parte superior se encuentra mi botón Me Gusta. 

Botón Volver (Subir).

Este script nos permitirá colocar una imagen al lado derecho de nuestra pantalla en la parte inferior para que en el momento que estemos en una determinada posición nos permita llegar hasta arriba de nuestra página únicamente dando un solo clic en la imagen. 


Para esto necesitamos agregar un nuevo gadget, si como ya sabemos le ponemos que sea para código HTML/SCRIPT y escribimos el siguiente código: 


<a style="display:scroll;position:fixed;bottom:0px;right:0px;" href="#" title="VOLVER ARRIBA"><img src=" Url de la imagen del boton"/></a>


Lo único que deben cambiar es donde dice URL de la imagen del botón, colocamos la URL de la imagen que deseemos. 

Quitar barra de Blogger.

Hola a todos, hoy les traigo un nuevo truco para blogger el cuál consiste en lo siguiente, vamos a quitar la barra  de Blogger de nuestro blog para darle un mejor diseño a que nos referimos con quitarsela nuestro blog actualmente se ve así: 

Para quitar esta barra realizaremos lo siguiente: 

1. Da click en la pestaña “Plantilla” y después en la opción “Edición de HTML”
2. Busca en el código el siguiente texto:

1. body {
   ...

2. Busca en el código el siguiente texto:

   body {
   ...

3. Justo arriba de él pega el siguiente código de acuerdo a tu versión de Blogger:Para el Nuevo Blogger:

   #navbar-iframe {
   height:0px;
   visibility:hidden;
   display:none
   }

Cuadro de texto en blogger.

Una de las cosas muy sencillas que podemos insertar en nuestro blog que nos puede ser de utilidad para poner código fuente o lo que queramos para nuestro blog.

La manera de hacerlo en un post será la siguiente:
1. En primer lugar nos vamos a nuestro mensaje que queremos escribir, y escribimos lo que queramos en el mensaje y dejamos un espacio con un texto para ponerlo.

2. Cambiarmos la vista redarctar a “Edición de HTML” en la pestaña superior de donde escribimos la entrada.

3. Copiamos el siguiente código HTML en el lugar donde queremos que esté:
Estuve en compuroo.blogspot.com
Una vez hecho esto, cambiamos el texto entre las etiquetas textarea, para cambiar el número de filas para escribir habría que cambiar el 3 entre comillas por otro número. Para cabiar la anchura del campo de texto habría que dar mayor longitud de caracteres.

Guardamos y el resultado será algo similar a:

Titulo de la página con movimiento en el navegador.

El truco que traigo hoy para blogger es bastante sencillo, pero muy útil es uno de los trucos que la mayoría de los blogs estan utilizando actualmente, lo único que hace es ponerle al titulo que aparece en tu navegador movimiento para que se vea el texto como el que aparece aquí abajo: 

Así se mueve el titulo

Para poner este truco en tu blog vas a Diseño,Edicion HTML y buscas la etiqueta  </body> y encima de ella pegas lo siguiente:

<SCRIPT LANGUAGE='JavaScript'>
var txt=" Tecnología, ZetLaX y más locuras ";
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>

Ahora solo reemplazas Tecnología, ZetLaX y más locuaras... por el titulo de tu blog y listo