Tube trucos

Mostrando entradas con la etiqueta blogger. Mostrar todas las entradas

Compartir tus entradas de blogger automáticamente a google plus

Por Unknown No comments

Desde hace un tiempo no teníamos alguna novedad de blogger,google, pero nos acaba de dar una sorpresita, es una nueva forma para compartir las entradas de blogger automáticamente a nuestro perfil de google plus, con esto el rey de Internet intenta ponerse a la altura de otras redes sociales como facebook que ya contaba con esta opción mediantes terceros la cual era una ventaja sobre google plus,con esto nos ahorramos tiempo de hacerlo manualmente.

Si entramos a nuestro menú,pagina principal en blogger van a ver donde dice Google+, OJO recuerden que las cuentas deben de estar conectadas si le damos click van a ver los perfiles que tienen en google plus si esta seleccionado el perfil personal y lo que quieren es que las entradas se publiquen en el perfil de pagina solo le damos click y este se pondrá hacia arriba y seleccionado.

Una ves seleccionado el perfil que queremos marcamos la casilla donde dice Compartir automáticamente después de publicar ,y es todo sus entradas a partir de ese momento se publicaran automaticamente en tu perfil o página de Google Plus según hayas seleccionado .

Como Instalar y personalizar el nuevo formulario de contacto de blogger

Por Unknown 10 comments

Desde hace un tiempo blogger nos sorprendió con un nuevo gadget, este se trata de un formulario de contacto,y porque es una sorpresa bueno ya que blogger no contaba con el mismo en comparacion con otros sitios y por lo tanto teníamos que recurrir a otras opciones para poder tener nuestro propio formulario,lo que pasa es que es un gadget por lo tanto aparecerá en nuestra sidebar,barra lateral.Lo que vamos a hacer es colocarlo en una página estática y no dejar que se muestre en un gadget.

Lo primero que vamos a hacer es ir a añadirlo para eso nos vamos a diseño y añadir un gadget y buscamos formulario de contacto.

Le damos a añadir,este lo pueden añadir en donde quieran ahora sin salirnos de diseño a la izquierda van a ver paginas.

Le damos click a paginas>>>> después a pagina nueva>>>> luego a pagina en blanco >>>> le van a dar el titulo que quieran darle >> formulario de contacto o contactame o como quieran luego selecionan HTML y pegan el siguiente código:

<style>
/*Formulário de contacto Blogger */
#formcontact{
padding: 8px 10px;
font-size:16px;/*-----tamaño del texto---*/
color:#000000;/*-----color del texto---*/
border:solid 1px #000000;/*-----color y ancho del borde del cuadro completo---*/
border-radius: 18px 18px; /*-----el radio del cuadro mas en numero mas redonda son las puntas ---*/
-moz-border-radius: 18px 18px;
-webkit-border-radius: 18px 18px;
box-shadow: inset 1px 1px 3px 0 #000;
-moz-box-shadow: inset 1px 1px 3px 0 #000;
-webkit-box-shadow: inset 1px 1px 3px 0 #000;
text-shadow: 1px 1px 0 #9d9d9d;
background:-moz-linear-gradient(0% 100% 90deg,#7e7e7e, #5e5e5e);/*-----color de fondo del cuadro ---*/
background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#5e5e5e), to(#7e7e7e));

}

#formcontact p{
}
.contact-form-name,
.contact-form-email,
.contact-form-email-message,
.contact-form-button-submit {
width: 400px;
max-width: 100%;
margin-bottom: 20px;
margin:5;
padding: 7px 12px;
font-size:16px;/*-----tamaño del texto que escribes---*/
color:#fff; /*-----color del texto que escribes---*/
border:solid 1px #000000;/*-----borde y color de los cuadros donde escribes---*/
border-radius: 18px 18px;
-moz-border-radius: 18px 18px;
-webkit-border-radius: 18px 18px;
box-shadow: inset 1px 1px 3px 0 #000;
-moz-box-shadow: inset 1px 1px 3px 0 #000;
-webkit-box-shadow: inset 1px 1px 3px 0 #000;
background:-moz-linear-gradient(0% 100% 90deg,#7e7e7e, #5e5e5e);/*-----color de fondo de los cuadros donde escribes---*/
background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#5e5e5e), to(#7e7e7e));

}

.contact-form-button-submit { /*-----como se ve el botón enviar sin pasar el mouse por encima---*/
width: 180px; /*-----ancho del botón---*/
height:40px;    /*-----altura del botón---*/
border:solid 1px #000;
color:#000;
font-size:18px;
background:-moz-linear-gradient(0% 100% 80deg,#5f5f5f, #000);/*-----color de fondo---*/
background:-webkit-gradient(linear, 0% 0%, 0% 80%, from(#000), to(#5f5f5f));
box-shadow: inset 1px 1px 3px 0 #000;
-moz-box-shadow: inset 1px 1px 3px 0 #000;
-webkit-box-shadow: inset 1px 1px 3px 0 #000;
text-shadow: 1px 1px 0 #ccc;

}
.contact-form-button-submit:hover { /*-----este código es para al pasar mouse por encima cambia boton enviar---*/
border-color: #ccc; /*-----color del borde---*/
background: #FF8C00;   /*-----color de fondo---*/
color: #fff;   /*-----color del texto---*/
text-shadow: 1px 1px 0 #000;

}

.Button2 { /*-----como se ve el botón borrar todo sin pasar el mouse por encima---*/
width: 180px; /*-----ancho del botón---*/
height:40px;    /*-----altura del botón---*/
border:solid 1px #000;
color:#000;
font-size:18px;
border-radius: 18px 18px;
-moz-border-radius: 18px 18px;
-webkit-border-radius: 18px 18px;
background:-moz-linear-gradient(0% 100% 80deg,#5f5f5f, #000);/*-----color de fondo---*/
background:-webkit-gradient(linear, 0% 0%, 0% 80%, from(#000), to(#5f5f5f));
box-shadow: inset 1px 1px 3px 0 #000;
-moz-box-shadow: inset 1px 1px 3px 0 #000;
-webkit-box-shadow: inset 1px 1px 3px 0 #000;
text-shadow: 1px 1px 0 #ccc;

}
.Button2:hover { /*-----este código es para al pasar mouse por encima cambia borrar todo---*/
border-color: #ccc; /*-----color del borde---*/
background: #FF8C00;   /*-----color de fondo---*/
color: #fff;   /*-----color del texto---*/
text-shadow: 1px 1px 0 #000;
border-radius: 18px 18px;
-moz-border-radius: 18px 18px;
-webkit-border-radius: 18px 18px;
} </style>

<br />
<div id="formcontact">
<br />
<form name="contact-form">
<div>
<br />
<br />
<b>    Su Nombre:</b> <span style="color: red;">*</span></div>
 <input class="contact-form-name" id="ContactForm1_contact-form-name" name="name" size="50" type="text" value="" />

<br />
<div>
<b>    Su E-mail:</b> <span style="color: red;">*</span></div>
 <input class="contact-form-email" id="ContactForm1_contact-form-email" name="email" size="50" type="text" value="" />

<br />
<div>
<b>    Mensage:</b> <span style="color: red;">*</span></div>
 <textarea class="contact-form-email-message" id="ContactForm1_contact-form-email-message" name="email-message" rows="6"></textarea><br />
   <input class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" type="button" value="Enviar" />
 <input class="Button2" id="Button2" type="reset" value="Borrar Todo" /><br />
<div style="max-width: 450px; text-align: center; width: 100%;">
<div class="contact-form-error-message" id="ContactForm1_contact-form-error-message">
</div>
<div class="contact-form-success-message" id="ContactForm1_contact-form-success-message">
</div>
</div>
</form>
</div>

Ahora le dan a publicar y si le dan a ver van a obtener la url de la página estática que crearon en este caso el formulario de contacto.

Por ultimo nos falta algo que es ocultar el gadget para que no se muestre doble en un gadget y en una página estática y nos vamos a ir a nuestra plantilla y con CTRL+F buscamos </head>
y una ves encontrado justo antes colocamos el siguiente :

<b:if cond='data:blog.url != ""'>
<style type='text/css'>
#ContactForm1 {
display: none;
}
</style>
</b:if>

Una vez puesto el codigo le damos a guardar plantilla y es todo ya cuentan con un formulario de contacto .

NOTA: los mensajes los van a recibir en su cuenta de correo de gmail.

Mostrar con efecto la fanBox de facebook al hacer Scroll

Por Unknown 5 comments

Hoy les voy a brindar un fabuloso código y muy sencillo de implementar en el blog,este lo tenia desde hace un tiempo previsto para una entrada pero no había tenido tiempo,este código venia original con solo un mensaje al deslizarse por la pagina este aparecía la autoría del mismo la desconosco,lo que hice fue implementarle la fanbox de facebook y como ya dije al hacer scroll en el blog este aparecerá,porque dije muy sencillo de implementar,por lo fácil que es,con solo añadirlo en un gadget es todo.

Cuando este se cierra dando click en la (x) este ya no volverá a aparecer hasta que no se cargue otra página Le podemos poner el color que queramos, con solo usar un poco de CSS,Para un ejemplo al hacer scroll en este sitio van a ver como aparece.

A continuación le brindo el código :

<script type="text/javascript">
jQuery.noConflict();
jQuery(window).scroll(function(){ if(jQuery(document).scrollTop()>=jQuery(document).height()/7) {
jQuery('#fanbox').show('slow');
} else {jQuery('#fanbox').hide('slow');}
});
function closefanbox(){
jQuery('#fanbox').remove();
;}
</script>

<style type="text/css">
/* Contenedor general */
#fanbox {
display: none;
overflow: hidden;
position: fixed;
bottom: 30px;
right: 21px;
width: 300px;
margin: 0;
padding: 0 0 5px;
z-index:1000;
}
/* Botón cerrar */
#fanbox a {
position: absolute;
top: 5px;
right: 6px;
color: #ccc;
font-size: 15px;
font-weight: bold;
}

/* facebook */
/* tubetrucos.com */
#fanbox {
background-image: -moz-linear-gradient(#696969, #000);background-image: -webkit-linear-gradient(#696969, #000);background-image: -o-linear-gradient(#696969, #000);background-image: linear-gradient(#696969, #000);
margin: 0px auto;
box-shadow: inset 0 0 8px #fff;
border-radius:8px 8px 8px 8px;
width:290px;
height:160px;
overflow:hidden;
}
div.fanbox10 iframe {margin:-1px}

</style>

<div style="display: none;" id="fanbox">
<a href="javascript:void(0);" onclick="return closefanbox();">X</a>



<div class='fanbox10'><iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2Ftube-trucos%2F161206907309924&width=300&height=180&colorscheme=dark&show_faces=true&border_color&stream=false&header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:180px;" allowtransparency="true"></iframe></div>

</div>

Lo que esta en color 000 es el color negro del fondo de la fanbox lo pueden remplazar por el color que ustedes quieran.
lo que esta en color 696969 es el color gris que esta tambien de fondo de la fanbox lo pueden remplazar por el color que ustedes quieran.

Donde dice pages%2Ftube-trucos%2F161206907309924 lo remplazan por el nombre de su pagina en facebook si todavia no tienen la url personalizada y tienen nombre y numeros lo copian desde donde dice page y las / la remplazan por %2F .

Para que este codigo funcione hace falta tener instalada la librería jQuery en nuestra plantilla. Si la tienen todo bien ,para el que no la tenga solo deben ir a plantilla y con CTRL + F buscan </head> y justo antes pegan lo siguiente.

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'/>

Eso es todo espero y lo disfruten.

Solucion al error bX-ga8xow de blogger

Por Unknown 2 comments

Efectivamente existe un herror bX-ga8xow en blogger.com/home al darle click en la pestaña a plantilla o cualquier otro como comentarios,diseño etc... el cual aparece en todos los navegadores ,en algunos sitios dicen que borrando las cookies de el navegador se soluciona el problema o haciendo una serie de detalles mas,en realidad estamos perdiendo nuestro tiempo en ir a las opciones de los navegadores la cual a veces funciona y a veces no.

Hay una solucion la cual no hay que dirigirse hacia ningun lugar del navegador ni borrar nada ,cuando te diriges a blogger.com/home te salen la lista de los blog que tienes si le das click a la pestaña.

Te habren las opciones plantillas ,comentarios etc..... y otras si le das click a una de esas a cualquiera te va a salir el error bX-ga8xow por lo tanto nada de esa pestaña te va a funcionar por ahora hasta que lo arreglen.

La solucion cuando vayas a blogger.com/home con solo darle click al titulo del blog que quieres editar a la isquierda te van a salir todas las opciones que estan en la pestaña.

Pero con la diferencia que estas si funcionan , y no te da error le das click a la que quieras abrir y todo perfecto.

Como recuperar nuestro código de Google Analytics

Por Unknown No comments

En varias ocasiones las personas me han preguntado como volver a recuperar e insertar en la plantilla su código de seguimiento de google Analytics,ya que por alguna razón lo han perdido.

La mayoría de las veces la pérdida de este código sucede porque al cambiar de plantilla en nuestro blog, nos olvidamos de guardar este código.

Para las personas que estén usando Google Analytics y piensan cambiar de plantilla, deberían de copiar y guardar antes de realizar algún cambio el código (en el notepad por ejemplo) y una vez hayas instalado la nueva plantilla, colocar el código en su lugar,este lo podemos colocar justo antes de </head> .
Para aquella persona que ya haya hecho el cambio de plantilla y se ha olvidado de guardar el código de google Analytics, podrás recuperarlo fácilmente desde tu cuenta de Google Analytics.lo que tendríamos que hacer es:

[1] Accedemos a la cuenta de Google Analytics.

[2] Una vez en nuestra cuenta, pinchamos en "Administrador" .

[3] Y entre varias opciones le damos click a Información de seguimiento.

[4] Al final copiamos el códigos que nos brindan y lo colocamos en nuestra plantilla justo antes de </head>

una ves hallas colocado el código en su lugar guardamos y es todo ya cuentan con Google Analytics otraves.

Nuevo gadget para mostrar tus seguidores de Google + en blogger

Por Unknown 2 comments

Trasteando un poco en el blog me aparece un mensaje de google+ el cual me dice que acaba de salir un gadget nuevo para blogger,el cual muestra los seguidores de google+ en tu blog,este se da un parecido a la fan box de facebook te muestra el nombre que tienes en la red social por ejemplo tube trucos ,te mustra las imagenes de los seguidores y cuantos tienes,por ahora es un paso mas que da google+ brindando este gadget y como todo con el tiempo ya podremos modificarlo un poco mas para darle estilo.

A continuacion les hice una toma de pantalla al mensaje .

Para añadirlo solo deben de ir a diseño añadir un gadget y en los primeros les va a aparecer este nuevo gadget que se llama seguidores de Google + le dan un click al cuadro azul con el signo de mas y este se te añadira en el blog.

Como añadir un autor a blogger usando el nuevo diseño

Por Unknown 2 comments

Muchos blogs cuentan con varios autores.lo cual es una ayuda para el mismo ya que mientras mas autores aiga mas entradas publican y es un muy buen beneficio para el blog.El que cuente con un blog y simplemente quisiera invitar a alguna persona a su blog y brindarles la posibilidad de acceso para publicar en en el mismo ,es bien cencillo de realizar este paso.

Un bloguero puede agregar hasta 100 autores en un blog, este cuenta con dos niveles de acceso que se le puede dar a los autores.

1-Darle acceso de autor, esto le dará a los invitados acceso a publicar únicamente .

2-Darle acceso de administrador, esto le dará a los invitados acceso completo a su blog. A las entradas ,paginas,estadisticas,comentarios,plantilla,y a la configuracion del mismo.

Para añadirlo nos dirigimos a nuestro control de panel en blogger,y en el blog que quieres añadir al invitado damos click en la pestaña y click en configuracion como muestro en la siguiente imagen.

Ahora nos dirigimos a permisos y damos click en añadir autores .

En el recuadro van a colocar la direccion de correo de la persona que quieren invitar y damos click en el boton invitar a autores.

Aquí van a ver que ya tienen la invitacion pendiente .

A la persona la cual le enviastes la invitacion va a recibir algo como en la siguiente imagen.

Una ves el invitado haga click en la invitacion lo va a dirigir a su control de panel que automaticamente tiene acceso solo a publicar eso si la persona a la cual invitas debe tener cuenta con google o blogger para poder entrar ahora si el dueño decea cambiar el acceso del invitado solo se dirige a la imagen 4 y en el cuadro del invitado va a ver una pestaña le das click para abrirla y le puedes cambiar a administrador.

Eso si el unico que tiene el acceso y control por completo a permitirle al invitado que sea autor para que publique o administrador para que tenga acceso a publicar y a otras cosas mas ,es el administrador del blog o sea el dueño como tambien tienes la opcion de eliminarlo por completo vas a configuracion >> permisos y pones el mouse,raton encima del invitado te va a aparecer la pestañita para darle el acceso como autor o administrador y al final te aparece una X le das click en ella y si lo que quieres es eliminarlo por completo y ya no tendra mas acceso a tu blog.

Señalando el código que añadimos en nuestra plantilla

Por Unknown No comments

A muchas personas le a sucedido que después de añadir un código en la plantilla de el blog, tiempo despues presentan problemas para quitarlo una vez quieren prescindir del código añadido.La solución para que no suceda eso es muy cencilla ,solo debemos señalizar ese código en la plantilla para poder localizarlo cuando ya lo quieras retiral.

Existen dos formas de marcar cualquier cosa,código que pongamos en la plantilla para saber donde se encuentra después y saber de que es cada código.Para el CSS hay una señalizacion y otra que se usa en la parte de HTML.

¿Como se distinge el CSS del HTML en la plantilla?

El CSS de nuestra plantilla es todo aquel código que se encuentra incluido entre las etiquetas <b:skin><![CDATA[/* y ]]></b:skin>.

El HTML de nuestra plantilla se considera desde la etiqueta (]]></b:skin>) hasta el final de la plantilla.

Como señalizar lo que se añade en el CSS

/* Aquí va el nombre que le quieras dar al código
------------------------------------------------------- */

Ejemplo:

/* Estilos de los comentarios o estilo del buscador etc....
------------------------------------------------------- */
aquí va el codigo que vas a añadir.

Añadiendo esas lineas ya sabremos definir de que es cada codigo que añadimos en nuestra plantilla en la parte del css.

Haciendo esto ya tendremos mas control sobre el código de nuestra plantilla.

Como ya les mencione arriba, desde la etiqueta ]]></b:skin> hasta el final de la plantilla se podría decir que es el código HTML, Nota: Siempre tomando la precaucion de no incluir nada entre las etiquetas </head> y <body>.

Ejemplo:

</head>

Aquí no puede ir nada

<body>

Como señalizar lo que se añade en el HTML

Para asegurarnos aún más podríamos marcar el código a comienzo y al final de este:

Ejemplo:



aquí va el código que vas a añadir.



De esta forma los navegadores no interpretarán lo que pongan dentro de /* ---- */ 

/* Aquí va el nombre que le quieras dar al código
------------------------------------------------------- */



, es decir, no se mostrará nada en el blog.

Como instalar el Sistema de estadísticas y visitas de Google Analytics

Por Unknown No comments

Google nos proporciona de forma gratuita a Google Analytics este es un completo sistema de estadísticas y con el que podremos obtener informes detallados sobre el número de visitas de nuestro blog,número de páginas vistas,el tiempo de cada visita que permanece en el sitio, ruta de entrada de las visitas (desde un buscador, desde otra página o tecleando directamente la dirección del blog), navegadores,sistemas operativos que utilizan para entrar a nuestro blog,las palabras que han utilizado en los buscadores para llegar al blog,páginas que nos enlazan, partes de nuestro sitio que son las más visitadas y mas......

1- Para utilizar este servicio, lo primero será acceder a su página de registro, una vez allí van a ver que hay dos opciones. Si ya contamos con una cuenta de Google, lo único es acceder con los datos de la cuenta. Si no tienen,la crearemos rellenando los datos requeridos.
Una vez hecha la cuenta, podremos acceder al sistema.

2-Una vez hayamos entrado,pulsaremos en el botón "Regístrese" que se encuentra a la derecha para dar de alta nuestro blog.especificaremos el nombre y la dirección de nuestro blog,mas abajo un nombre que lo identifique,puede ser tu nombre o el que quieran el país desde donde lo publicamos y la zona horaria. Luego Pulsamos en obtener ID de seguimiento.

3-Nos aparecera información sobre los términos de servicio y una vez aceptados nos aparecera toda la informacion que necesitamos,alli nos brindan un ID de propiedad web (UA-XXXXXXXX-X).

4-Al final nos brindan un codigo para ponerlo en nuestra plantilla como el siguiente :

El codigo ya biene listo para ponerlo en nuestra plantilla con el ID de propiedad web (UA-XXXXXXXX-X). que nos asignan.


<script type="text/javascript">

var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-XXXXXXXX-X']);
_gaq.push(['_trackPageview']);

(function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();

</script>


Copie el código que nos brinda Google Analytics y péguelo antes de la etiqueta de cierre </head> en su plantilla.

Una ves hecho eso guardan la plantilla y es todo ya cuentan con Google Analytics es su sitio

Los Símbolos y caracteres más utilizados en la red social Facebook

Por Unknown 2 comments

Desde hace unos dias he estado recopilando todos los simbolos y caracteres mas utilizados en la red social facebook ,estos mismos los pueden usar en twitter y en muchos lugares mas ,estos caracteres son muy populares por sus expreciones y muy facíl de implementar con solo copiar y pegarlo en donde quieras usarlo estos se obtienen mediante nuestro teclado si aprietas la tecla ALT numeros que quieras va a ver los simbolos todo depende de la variedad que hagas con los numeros ,pero yo se los voy a dejar aquí hoy si lo quieren mantener en su PC solo copien y pegenlo en el notepad lo guardan y cada ves que van a usarlos solo lo copian desde su computadora y pegan en donde lo quieran y es todo es muy facíl y le da un toque diferente a tu perfil .

A continuacion les dejo los caracteres y simbolos a su dispocicion.

█ ─ ─ ─ ─ █ ▀ ▀ █ ─ ▄ █ █ █ ▄ █ █ █ ▄ ─ █ ▀ ▀ ▀
█ ─ ─ ─ ─ █ ─ ─ █ ─ ▀ █ █ █ █ █ █ █ ▀ ─ █ ▄ ▄ ▄
█ ─ ─ ─ ─ █ ─ ─ █ ─ ─ ─ ▀ █ █ █ ▀ ─ ─ ─ █
▀ ▀ ▀ ▀ ─ ▀ ▀ ▀ ▀ ─ ─ ─ ─ ─ ▀ ─ ─ ─ ─ ─ ▀ ▀ ▀ ▀

(`'•.¸♥*♥ ¸.•'´) ¸.•'´)
(¸.•'´ (¸.•'´♥*♥ `'•.¸)

*♥*♥* Me Gusta *♥*♥*

        ☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆★☆

         ▀██▀───▀██▀─▀██──██─▀██▀▀ ─
        ██─────██───██▄█▀───██▄█─
         ▄██▄▄█─▄██▄─▄██──██─▄██▄▄

        ღ☻ღ☻ღ☻ღ☻ღ☻ღ☻ღ☻ღ☻ღ☻ღ☻ღ☻ღ

๑•ิ.•ั๑ ๑۩۞۩๑ ♬✿.｡.:* ★ ☆ εїз℡❣·۰•●○●ōゃ ♥ ♡๑۩ﺴ ☜ ☞ ☎ ☏♡ ⊙◎ ☺ ☻✖╄ஐﻬ ► ◄ ▧ ▨ ♨ ◐ ◑ ↔ ↕ ▪ ▫ ☼ ♦ ▀ ▄ █▌ ▐░ ▒ ▬♦ ◊ ◦ ☼ ♠♣ ▣ ▤ ▥ ▦ ▩ ◘ ◙ ◈ ♫ ♬ ♪ ♩ ♭ ♪ の ☆ → あぃ￡ ❤＃＠＆＊ ❁ ❀ ✿ ✾ ❃ ✺ ❇ ❈ ❊ ❉ ✱ ✲ ✩ ✫ ✬ ✭ ✮ ✰ ☆ ★ ✪ ¤ ☼ ☀ ☽ ☾ ❤ ♡ ღ☻ ☺ ❂ ◕ ⊕ ☉ Θ o O ♋ ☯ ㊝ ⊙ ◎◑ ◐ ۰ • ● ▪ ▫ ｡ﾟ ๑ ☜ ☞ ☂ ♨ ☎ ☏ × ÷ ＝ ≠ ≒ ∞ ˇ ± √ ⊥▶ ▷ ◀ ◁ ☀ ☁ ☂ ☃ ☄ ★ ☆ ☇ ☈ ☉ ☊ ☋ ☌ ☍ ☑ ☒☢ ☸ ☹ ☺ ☻ ☼ ☽ ☾ ♠ ♡ ♢ ♣ ♤ ♥ ♦ ♧ ♨ ♩ ✙ ✈ ✉ ✌ ✁♝ ♞♯♩♪♫♬♭♮ ☎ ☏ ☪ ♈ ♨ ₪ ™ ♂✿ ♥ の ↑ ↓ ← → ↖ ↗ ↙ ↘ ㊣ ◎ ○ ● ⊕ ⊙ ○　 △ ▲ ☆ ★ ◇ ◆ ■

□ ▽ ▼ § ￥〒￠￡ ※ ♀ ♂ &⁂ ℡ ↂ░ ▣ ▤ ▥ ▦ ▧ ✐✌✍✡✓✔✕✖ ♂ ♀ ♥ ♡ ☜ ☞ ☎ ☏ ⊙ ◎ ☺ ☻ ► ◄ ▧ ▨ ♨ ◐ ◑ ↔ ↕ ♥ ♡ ▪ ▫ ☼ ♦ ▀ ▄ █ ▌ ▐ ░ ▒ ▬ ♦ ◊ ◘ ◙ ◦ ☼ ♠ ♣ ▣ ▤ ▥ ▦ ▩ ◘ ◙ ◈ ♫ ♬ ♪ ♩ ♭ ♪ ✄☪☣☢☠░ ▒ ▬ ♦ ◊ ◦ ♠ ♣ ▣ ۰•● ❤ ●•۰► ◄ ▧ ▨ ♨ ◐ ◑ ↔ ↕ ▪ ▫ ☼ ♦♧♡♂♀♠♣♥❤☜☞☎☏⊙◎ ☺☻☼▧▨♨◐◑↔↕▪ ▒ ◊◦▣▤▥ ▦▩◘ ◈◇♬♪♩♭♪の★☆→あぃ￡Ю〓§♤♥▶¤๑⊹⊱⋛⋌⋚⊰⊹ ๑۩۩.. ..۩۩๑ ๑۩۞۩๑ ✲ ❈ ✿ ✲ ❈ ➹ ~.~ ◕‿- ❣ ✚ ✪ ✣ ✤ ✥ ✦❉ ❥ ❦ ❧ ❃ ❂ ❁ ❀ ✄ ☪ ☣ ☢ ☠ ☭ღღღ ▶ ▷ ◀ ◁ ☀ ☁ ☂ ☃ ☄ ★ ☆ ☇ ☈ ⊙ ☊ ☋ ☌ ☍ⓛⓞⓥⓔ๑•ิ.•ั๑ ๑۩۞۩๑ ♬✿ ☉♡ ♢ ♣ ♤ ♥ ♦ ♧ ♨ ♩ ✙✈ ✉ ✌ ✁ ✎ ✐ ❀ ✰ ❁ ❤ ❥ ❦❧ ➳ ➽ εїз℡❣·۰•●○●ゃōゃ♥

♡๑۩ﺴ ☜ ☞ ☎ ☏♡ ⊙◎ ☺ ☻✖╄ஐﻬ ► ◄ ▧ ▨ ♨ ◐ ◑ ↔ ↕ ▪ ▫ ☼ ♦ ▀ ▄ █▌ ▐░ ▒ ▬♦ ◊ ◦ ☼ ♠♣ ▣ ▤ ▥ ▦ ▩ ◘ ◙ ◈ ♫ ♬ ♪ ♩ ♭ ♪ の ☆ → あぃ￡ ❤ ❁ ❀ ✿ ✾ ❃ ✺ ❇ ❈ ❊ ❉ ✱ ✲ ✩ ✫ ✬ ✭ ✮ ✰ ☆ ★ ✪ ¤ ☼ ☀ ☽ ☾ ❤ ♡ ღ☻ ☺ ❂ ◕ ⊕ ☉ Θ o O ♋ ☯ ㊝ ⊙ ◎ ◑ ◐ ۰ • ● ▪ ▫ ｡ﾟ ๑ ☜ ☞ ☂ ♨ ☎ ☏▶ ▷ ◀ ◁ ☀ ☁ ☂ ☃ ☄ ★ ☆ ☇ ☈ ☉ ☊ ☋ ☌ ☍ ☑ ☒☢ ☸ ☹ ☺ ☻ ☼ ☽ ☾ ♠ ♝ ♞♯♩♪♫♬♭♮ ☎ ☏ ☪ ♈ ♨ ºº ₪ ¤ 큐 « »™ ♂✿ ♥ の ↑ ↓ ← → ↖ ↗ ↙ ↘ ㊣ ◎ ○ ● ⊕ ⊙ ○　 △ ▲ ☆ ★ ◇ ◆ ■ □ ▽ ▼ § ￥〒￠￡ ※ ♀ ♂ © ® ⁂ ℡ ↂ░ ▣ ▤ ▥ ▦ ▧ ✐✌✍✡✓✔✕✖ ♂ ♀ ♥ ♡ ☜ ☞ ☎ ☏ ⊙ ◎ ☺ ☻ ► ◄ ▧ ▨ ♨ ◐ ◑ ↔ ↕ ♥ ♡ ▪ ▫ ☼ ♦ ▀ ▄ █ ▌ ▐ ░ ▒ ▬ ♦ ◊ ◘ ◙ ◦ ☼ ♠ ♣ ▣ ▤ ▥ ▦ ▩ ◘ ◙ ◈ ♫ ♬ ♪ ♩ ♭ ♪ ✄☪☣☢☠㊊㊋㊌㊍㊎㊏㊐㊑㊒㊓㊔㊕㊖㊗㊘㊜㊝㊞㊟㊠㊡㊢㊣㊤㊥㊦㊧㊨㊩㊪㊫㊬㊭㊮㊯㊰

✗✘✚✪✣✤✥✦✧✩✫✬✭✮✯✰ ✱✲✳❃❂❁❀✿✾✽✼✻✺✹✸✷ ✶✵✴❄❅❆❇❈❉❊❋❖☀☂☁【】┱ ┲ ❣ ✪ ✣ ✤ ✥ ✦ ❉ ❥ ❦ ❧ ❃ ❂ ❁ ❀ ✄ ☪ ☣ ☢ ☠ ☭ ♈ ➸ ✓ ✔ ✕ ✖ .: ◢ ◣ ◥ ◤ ▽ ▧ ▨ ▣ ▤ ▥ ▦ ▩ ◘ ◙ ▓ ▒ ░ ™ ℡ 凸の ๑۞๑ ๑۩ﺴ ﺴ۩๑ o(‧”’‧)o ❆ べò⊹⊱⋛⋋ ⋌⋚⊰⊹ ⓛⓞⓥⓔ ☀ ☼ ☜ ☞ ⊙® ◈ ♦ ◊ ◦ ◇ ◆ εїз❃❂❁❀✿✾✽✼✻✺✹✸✷ ✶✵✴❄❅❆❇❈❉ ❊❋❖❤❥❦❧↔ ↕ ▪ → ︷╅╊✿ (¯`•._.• •._.•´¯)(¯`•¸•´¯) ❤`•.¸¸.•´´¯`•• .¸¸.•´¯`•.•●•۰• ••.•´¯`•.•• ••.•´¯`•.••—¤÷(`[¤* *¤]´)÷¤——(•·÷[ ]÷·•)—
①②③④⑤⑥⑦⑧⑨⑩ ⑪⑫⑬⑭⑮⑯⑰⑱⑲⑳ ⒶⒷⒸⒹⒺⒻ ⒼⒽⒾⒿⓀⓁ ⓂⓃⓄⓅⓆⓇ ⓈⓉⓊⓋⓌⓍ ⓎⓏ ⓐⓑⓒⓓⓔⓕ ⓖⓗⓘⓙⓚⓛ ⓜⓝⓞⓟⓠⓡ ⓢⓣⓤⓥⓦⓧ ⓨⓩ(⊙▂⊙✖ )(づ￣ ³￣)づ ( c//”-}{-*\\x)(-’๏_๏’-)(◐ o ◑ )(⊙…⊙ )๏[-ิ_•ิ]๏(•ิ_•ิ)$•ิ_•ิ$ (/•ิ_•ิ)(︶︹︺)

Interensante estos simbolos, se pueden hacer muchisimas cosas con ellos todo va en la imaginacion de cada cual .

Personalizar el Gadget de etiquetas dandole un estilo diferente

Por Unknown No comments

El gadget Labels,etiquetas es muy usado en los blog,muchos los usan como menú otros simplemente muestran las etiquetas que tienen,en este tutorial van a saber como personalizar esas etiquetas dándole un estilo diferente y no el que viene por defecto que solo son palabras sin ningún fondo o color.

Para personalizar las etiquetas en Blogger es muy sencillo y no nos toma mucho tiempo,y así vamos mejorando poco a poco cada parte del blog.

Para añadirlo se los voy a brindar de dos formas una mediante el siguiente botón ,solo dan click y escogen el blog al que quieres añadirle este estilo.también pueden editarlos una ves se instale buscan el gadget con el titulo Estilos de las etiquetas lo abren y lo pueden editar ustedes mismos cambiándole el color a sus gustos y le borran el titulo solo se lo pongo para que sepan donde se encuentra el código y no se pierdan.

.label-size a:hover{background:#000;}

.label-size a:hover:before{border-color:transparent #000 transparent transparent;}</style>

Si lo quieren añadirlo ustedes mismos van a Diseño >>> Añadir un gadget >>> y buscan :

Una ves encontrado pegan el siguiente código :

<style>
.label-size{ margin:0; padding:0; position:relative; } .label-size a{ float:left; height:20px; line-height:20px; position:relative; font-size:12px; margin-bottom: 9px; margin-left:5px; padding:0 10px 0 5px; background-color: #696969;background-image: -moz-linear-gradient(#000, #696969);background-image: -webkit-linear-gradient(#000, #696969);background-image: -o-linear-gradient(#000, #696969);background-image: linear-gradient(#000, #696969); color:#fff; text-decoration:none; -moz-border-radius-bottomright:4px; -webkit-border-bottom-right-radius:4px; border-bottom-right-radius:4px; -moz-border-radius-topright:4px; -webkit-border-top-right-radius:4px; border-top-right-radius:4px;-moz-border-radius-bottomleft:4px; -webkit-border-bottom-left-radius:4px; border-bottom-left-radius:4px; -moz-border-radius-topleft:4px; -webkit-border-top-left-radius:4px; border-top-left-radius:4px; }

.label-size a:hover{background:#000;} .label-size a:hover:before{border-color:transparent #000 transparent transparent;}</style>

Si se fijan al final de este blog pueden ver que lo tengo implementado en este sitio, le di dos tonos, el cual ustedes pueden darle el color que quieran .

Lo que esta en color rojo es el color negro que es el color de arriba.
Lo que esta en color naranja es el color gris que es el color de abajo.
Lo que esta en color amarillo es el color negro que aparecerá cuando le pases el mouse por encima.

Si no saben que color ponerle ,pueden encontrarlos aquí.

Mostrar la fanbox de twitter en una lightbox al cargar la pagina con Jquery

Por Unknown No comments

Este Widget es muy parecido al de Mostrar la fanbox de facebook en una lightbox al cargar la pagina con Jquery con la diferencia que este es para la fanbox de twitter,este al igual que el de facebook son muy útil para usarlo en Blogger,se muestra un cuadro emergente ( Popup ) con un fondo oscuro el cual este es obtenido con JQuery ,seguro han visto este efecto en imagenes en videos etc.. pero ahora lo que vamos a mostrar es la fanbox de twitter cada ves que un visitante entre al sitio esta le aparecera de primero, con un efecto muy bonito proponiendole seguirte en twitter al igual si no quieren tienen la opcion de cerrar.

Hay dos alternativas una si quieres que aparesca cada ves que carge la pagina o mediante las cookie esta lee la IP del visitante y solo le aparecera una sola ves.
Eso si solo se puede usar uno o el de facebook o el de twitter .
Este widget es muy facíl de implementar en solo unos pasos ya esta listo no tenemos que tocar la plantilla para nada solo lo añadiremos a un gadget para eso nos vamos a blogger >>> Diseño >>> Añadir un gadget >>> y buscamos HTML/Javascript y ponemos el siguiente codigo :

<style>
div.fanbox {
width:290px;
height:160px;
overflow:hidden;
}
div.fanbox iframe {margin:-1px}

#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:fixed;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}

#cboxOverlay{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKVwdqFxw8iT8pY5OLLhJcsbFXMP_ITsIn2xFo9_wV8Gq-1-PDkba0ACKHHHNs8Hdsfgr1OnOSI_VMSg_YCP8xUDDbHD4fHlh2CqkVQhyi6Q3AqN_pZ8JsySqhWBCSa3qzujBb0wwbSTmA/s1600/overlay.png) repeat 0 0;}
#colorbox{}
    #cboxTopLeft{width:21px; height:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1l7_2yLvzF-gCQan3_dDnCutnB1yBehTX4-B51zXHuIDOxzZf29m5HiHBaBEXeNEXgMOZUiA5Dhm_FjsgLF1SJnpSqm3yJJDC2lWvvY8nxQLCfScbVwCoxNPqe1huG1LDK8ksg-koXt1V/s1600/controls.png) no-repeat -101px 0;}
    #cboxTopRight{width:21px; height:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1l7_2yLvzF-gCQan3_dDnCutnB1yBehTX4-B51zXHuIDOxzZf29m5HiHBaBEXeNEXgMOZUiA5Dhm_FjsgLF1SJnpSqm3yJJDC2lWvvY8nxQLCfScbVwCoxNPqe1huG1LDK8ksg-koXt1V/s1600/controls.png) no-repeat -130px 0;}
    #cboxBottomLeft{width:21px; height:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1l7_2yLvzF-gCQan3_dDnCutnB1yBehTX4-B51zXHuIDOxzZf29m5HiHBaBEXeNEXgMOZUiA5Dhm_FjsgLF1SJnpSqm3yJJDC2lWvvY8nxQLCfScbVwCoxNPqe1huG1LDK8ksg-koXt1V/s1600/controls.png) no-repeat -101px -29px;}
    #cboxBottomRight{width:21px; height:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1l7_2yLvzF-gCQan3_dDnCutnB1yBehTX4-B51zXHuIDOxzZf29m5HiHBaBEXeNEXgMOZUiA5Dhm_FjsgLF1SJnpSqm3yJJDC2lWvvY8nxQLCfScbVwCoxNPqe1huG1LDK8ksg-koXt1V/s1600/controls.png) no-repeat -130px -29px;}
    #cboxMiddleLeft{width:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1l7_2yLvzF-gCQan3_dDnCutnB1yBehTX4-B51zXHuIDOxzZf29m5HiHBaBEXeNEXgMOZUiA5Dhm_FjsgLF1SJnpSqm3yJJDC2lWvvY8nxQLCfScbVwCoxNPqe1huG1LDK8ksg-koXt1V/s1600/controls.png) left top repeat-y;}
    #cboxMiddleRight{width:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1l7_2yLvzF-gCQan3_dDnCutnB1yBehTX4-B51zXHuIDOxzZf29m5HiHBaBEXeNEXgMOZUiA5Dhm_FjsgLF1SJnpSqm3yJJDC2lWvvY8nxQLCfScbVwCoxNPqe1huG1LDK8ksg-koXt1V/s1600/controls.png) right top repeat-y;}
    #cboxTopCenter{height:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTE5VPtyBqXcTvmmE0BFyBM1_UCEPB9vvIpEiu6Diit2f-hytgZ2P22ykebloWeBoag3Q1HmguD7436bYAf_XybZQzNlgQYO05cUD-k5Dy_9AODYDePF_C1EX4Kcu9F_VsXS2yvSpj1CVQ/s1600/border.png) 0 0 repeat-x;}
    #cboxBottomCenter{height:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTE5VPtyBqXcTvmmE0BFyBM1_UCEPB9vvIpEiu6Diit2f-hytgZ2P22ykebloWeBoag3Q1HmguD7436bYAf_XybZQzNlgQYO05cUD-k5Dy_9AODYDePF_C1EX4Kcu9F_VsXS2yvSpj1CVQ/s1600/border.png) 0 -29px repeat-x;}
    #cboxContent{background:#fff; overflow:hidden;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{margin-top:28px;}
        #cboxTitle{position:absolute; top:4px; left:0; text-align:center; width:100%; color:#949494;}
        #cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;}
        #cboxSlideshow{position:absolute; top:4px; right:30px; color:#0092ef;}
        #cboxPrevious{position:absolute; top:0; left:0; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1l7_2yLvzF-gCQan3_dDnCutnB1yBehTX4-B51zXHuIDOxzZf29m5HiHBaBEXeNEXgMOZUiA5Dhm_FjsgLF1SJnpSqm3yJJDC2lWvvY8nxQLCfScbVwCoxNPqe1huG1LDK8ksg-koXt1V/s1600/controls.png) no-repeat -75px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxPrevious:hover{background-position:-75px -25px;}
        #cboxNext{position:absolute; top:0; left:27px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1l7_2yLvzF-gCQan3_dDnCutnB1yBehTX4-B51zXHuIDOxzZf29m5HiHBaBEXeNEXgMOZUiA5Dhm_FjsgLF1SJnpSqm3yJJDC2lWvvY8nxQLCfScbVwCoxNPqe1huG1LDK8ksg-koXt1V/s1600/controls.png) no-repeat -50px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxNext:hover{background-position:-50px -25px;}
        #cboxLoadingOverlay{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhk_YW5eugFbTnfYVr8G-9TSzqUIpk1i4npJXbNooSDmJRHRZGPsTNjaaCQOxiIwEseXQBOj26hxw2IoSv189rHKTOBeZgh7f80_3MHnofwFdJVSd0sVthOg0KexqV5dOOpdWyk3u5gvA4W/h120/loading.gif) no-repeat center center;}
        #cboxLoadingGraphic{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhk_YW5eugFbTnfYVr8G-9TSzqUIpk1i4npJXbNooSDmJRHRZGPsTNjaaCQOxiIwEseXQBOj26hxw2IoSv189rHKTOBeZgh7f80_3MHnofwFdJVSd0sVthOg0KexqV5dOOpdWyk3u5gvA4W/h120/loading.gif) no-repeat center center;}
        #cboxClose{position:absolute; top:0; right:0; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1l7_2yLvzF-gCQan3_dDnCutnB1yBehTX4-B51zXHuIDOxzZf29m5HiHBaBEXeNEXgMOZUiA5Dhm_FjsgLF1SJnpSqm3yJJDC2lWvvY8nxQLCfScbVwCoxNPqe1huG1LDK8ksg-koXt1V/s1600/controls.png) no-repeat -25px 0; width:20px; height:20px; text-indent:-9999px;}
        #cboxClose:hover{background-position:-25px -25px;}

/*-----------------------------------------------------------------------------------*/
/*   fanbox popup For Blogger
/*-----------------------------------------------------------------------------------*/
#subscribe {
    font: 12px/1.2 Arial,Helvetica,san-serif; color:#fff;
}
#subscribe a,
#subscribe a:hover,
#subscribe a:visited {
    text-decoration:none;
}
.box-title {
   color: #00008b;
   font-size: 15px !important;
   font-weight: bold;
   margin: 2px 0;
border:1px solid #000;
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
box-shadow: 5px 5px 5px #00000;
padding:10px;
line-height:5px; font-family:arial !important;
}
.box-tagline {
   color: #000;
   margin: 0;
   text-align: center;
}
#subs-container {
    padding: 35px 0 30px 0;
    position: relative;
}
a:link, a:visited {
border:none;
}
.demo {
display:none;
}
</style>

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js'></script>
<script src="http://img89.xooimage.com/files/b/b/1/jquery.colorbox-min-381970d.js"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
   if (document.cookie.indexOf('visited=false') == -1) {
       var fifteenDays = 1000*60*60*24*30;
       var expires = new Date((new Date()).valueOf() + fifteenDays);
       document.cookie = "visited=true;expires=" + expires.toUTCString();
   $.colorbox({width:"340px", inline:true, href:"#subscribe"});
       }
});
</script>

<div style='display:none'>
   <div id='subscribe' style='padding:1px; background-color: #;
-moz-border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
border-radius: 5px;
-moz-box-shadow:5px 5px 8px #000;
'>
/*-----------------------------------------------------------------------------------*/
/* Despues de estas lineas podrian poner un titulo con el codigo que les voy a dar
/*-----------------------------------------------------------------------------------*/

<center><div class='fanbox'><div class="textwidget">
<script type="text/javascript" src="http://s.moopz.com/fanbox_init.js"></script><div id="twitterfanbox">
<script type="text/javascript">fanbox_init("tubetrucos");</script></div>
</div>

<style>
.FB_SERVER_IFRAME {
width: 290px !important; /* Ancho del gadget */
height: 250px !important; /* Alto del gadget */
}
</style></div></center></div></div>

El siguiente codigo es por si quieren añadirle un titulo donde les indique en el codigo anterior donde dice Te unes en Twitter lo pueden remplazar por lo que ustedes quieran eso es a gusto de cada persona todo va en la imaginacion .

<h4 class="box-title"><center>Te unes en Twitter</center></h4>

Donde dice false lo pueden remplazar por true ,con false aparece siempre que carge la pagina con true solo una ves .

Donde dice tubetrucos lo remplazan por su ID de twitter ,

Hecho todo le dan a guardar al gadget y nos vamos a la pagina ya podran apreciar que al cargar les aparece este fabuloso widget.

Mostrar la fanbox de facebook en una lightbox al cargar la pagina con Jquery

Por Unknown 13 comments

Este Widget que les presento en el dia de hoy es muy útil para usarlo en Blogger,se muestra un cuadro emergente ( Popup ) con un fondo oscuro el cual este es obtenido con JQuery ,seguro han visto este efecto en imagenes en videos etc.. pero ahora lo que vamos a mostrar es la fanbox de facebook cada ves que un visitante entre al sitio esta le aparecera de primero, con un efecto muy bonito proponiendole seguirte en facebook al igual si no quieren tienen la opcion de cerrar.

Tenemos dos alternativas una si quieres que aparesca cada ves que carge la pagina o mediante las cookie esta lee la IP del visitante y solo le aparecera una sola ves.

Este widget es muy facíl de implementar en solo unos pasos ya esta listo no tenemos que tocar la plantilla para nada solo lo añadiremos a un gadget para eso nos vamos a blogger >>> Diseño >>> Añadir un gadget >>> y buscamos HTML/Javascript y ponemos el siguiente codigo :

<style>
div.fanbox {
background-color: #dcdcda;background-image: -moz-linear-gradient(#000, #dcdcda);background-image: -webkit-linear-gradient(#000, #dcdcda);background-image: -o-linear-gradient(#000, #dcdcda);background-image: linear-gradient(#000, #dcdcda);
-moz-border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
border-radius: 5px;
-moz-box-shadow:5px 5px 8px #000;
-ms-filter:
"progid:DXImageTransform.Microsoft.Shadow(color=#000,direction=125,strength=5)";filter: progid:DXImageTransform.Microsoft.Shadow(color=#000,direction=125,strength=5);-webkit-box-shadow: 5px 5px 8px #000;
width:290px;
height:160px;
overflow:hidden;
}
div.fanbox iframe {margin:-1px}

#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:fixed;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}

#cboxOverlay{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKVwdqFxw8iT8pY5OLLhJcsbFXMP_ITsIn2xFo9_wV8Gq-1-PDkba0ACKHHHNs8Hdsfgr1OnOSI_VMSg_YCP8xUDDbHD4fHlh2CqkVQhyi6Q3AqN_pZ8JsySqhWBCSa3qzujBb0wwbSTmA/s1600/overlay.png) repeat 0 0;}
#colorbox{}
    #cboxTopLeft{width:21px; height:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1l7_2yLvzF-gCQan3_dDnCutnB1yBehTX4-B51zXHuIDOxzZf29m5HiHBaBEXeNEXgMOZUiA5Dhm_FjsgLF1SJnpSqm3yJJDC2lWvvY8nxQLCfScbVwCoxNPqe1huG1LDK8ksg-koXt1V/s1600/controls.png) no-repeat -101px 0;}
    #cboxTopRight{width:21px; height:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1l7_2yLvzF-gCQan3_dDnCutnB1yBehTX4-B51zXHuIDOxzZf29m5HiHBaBEXeNEXgMOZUiA5Dhm_FjsgLF1SJnpSqm3yJJDC2lWvvY8nxQLCfScbVwCoxNPqe1huG1LDK8ksg-koXt1V/s1600/controls.png) no-repeat -130px 0;}
    #cboxBottomLeft{width:21px; height:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1l7_2yLvzF-gCQan3_dDnCutnB1yBehTX4-B51zXHuIDOxzZf29m5HiHBaBEXeNEXgMOZUiA5Dhm_FjsgLF1SJnpSqm3yJJDC2lWvvY8nxQLCfScbVwCoxNPqe1huG1LDK8ksg-koXt1V/s1600/controls.png) no-repeat -101px -29px;}
    #cboxBottomRight{width:21px; height:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1l7_2yLvzF-gCQan3_dDnCutnB1yBehTX4-B51zXHuIDOxzZf29m5HiHBaBEXeNEXgMOZUiA5Dhm_FjsgLF1SJnpSqm3yJJDC2lWvvY8nxQLCfScbVwCoxNPqe1huG1LDK8ksg-koXt1V/s1600/controls.png) no-repeat -130px -29px;}
    #cboxMiddleLeft{width:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1l7_2yLvzF-gCQan3_dDnCutnB1yBehTX4-B51zXHuIDOxzZf29m5HiHBaBEXeNEXgMOZUiA5Dhm_FjsgLF1SJnpSqm3yJJDC2lWvvY8nxQLCfScbVwCoxNPqe1huG1LDK8ksg-koXt1V/s1600/controls.png) left top repeat-y;}
    #cboxMiddleRight{width:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1l7_2yLvzF-gCQan3_dDnCutnB1yBehTX4-B51zXHuIDOxzZf29m5HiHBaBEXeNEXgMOZUiA5Dhm_FjsgLF1SJnpSqm3yJJDC2lWvvY8nxQLCfScbVwCoxNPqe1huG1LDK8ksg-koXt1V/s1600/controls.png) right top repeat-y;}
    #cboxTopCenter{height:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTE5VPtyBqXcTvmmE0BFyBM1_UCEPB9vvIpEiu6Diit2f-hytgZ2P22ykebloWeBoag3Q1HmguD7436bYAf_XybZQzNlgQYO05cUD-k5Dy_9AODYDePF_C1EX4Kcu9F_VsXS2yvSpj1CVQ/s1600/border.png) 0 0 repeat-x;}
    #cboxBottomCenter{height:21px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTE5VPtyBqXcTvmmE0BFyBM1_UCEPB9vvIpEiu6Diit2f-hytgZ2P22ykebloWeBoag3Q1HmguD7436bYAf_XybZQzNlgQYO05cUD-k5Dy_9AODYDePF_C1EX4Kcu9F_VsXS2yvSpj1CVQ/s1600/border.png) 0 -29px repeat-x;}
    #cboxContent{background:#fff; overflow:hidden;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{margin-top:28px;}
        #cboxTitle{position:absolute; top:4px; left:0; text-align:center; width:100%; color:#949494;}
        #cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;}
        #cboxSlideshow{position:absolute; top:4px; right:30px; color:#0092ef;}
        #cboxPrevious{position:absolute; top:0; left:0; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1l7_2yLvzF-gCQan3_dDnCutnB1yBehTX4-B51zXHuIDOxzZf29m5HiHBaBEXeNEXgMOZUiA5Dhm_FjsgLF1SJnpSqm3yJJDC2lWvvY8nxQLCfScbVwCoxNPqe1huG1LDK8ksg-koXt1V/s1600/controls.png) no-repeat -75px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxPrevious:hover{background-position:-75px -25px;}
        #cboxNext{position:absolute; top:0; left:27px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1l7_2yLvzF-gCQan3_dDnCutnB1yBehTX4-B51zXHuIDOxzZf29m5HiHBaBEXeNEXgMOZUiA5Dhm_FjsgLF1SJnpSqm3yJJDC2lWvvY8nxQLCfScbVwCoxNPqe1huG1LDK8ksg-koXt1V/s1600/controls.png) no-repeat -50px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxNext:hover{background-position:-50px -25px;}
        #cboxLoadingOverlay{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhk_YW5eugFbTnfYVr8G-9TSzqUIpk1i4npJXbNooSDmJRHRZGPsTNjaaCQOxiIwEseXQBOj26hxw2IoSv189rHKTOBeZgh7f80_3MHnofwFdJVSd0sVthOg0KexqV5dOOpdWyk3u5gvA4W/h120/loading.gif) no-repeat center center;}
        #cboxLoadingGraphic{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhk_YW5eugFbTnfYVr8G-9TSzqUIpk1i4npJXbNooSDmJRHRZGPsTNjaaCQOxiIwEseXQBOj26hxw2IoSv189rHKTOBeZgh7f80_3MHnofwFdJVSd0sVthOg0KexqV5dOOpdWyk3u5gvA4W/h120/loading.gif) no-repeat center center;}
        #cboxClose{position:absolute; top:0; right:0; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1l7_2yLvzF-gCQan3_dDnCutnB1yBehTX4-B51zXHuIDOxzZf29m5HiHBaBEXeNEXgMOZUiA5Dhm_FjsgLF1SJnpSqm3yJJDC2lWvvY8nxQLCfScbVwCoxNPqe1huG1LDK8ksg-koXt1V/s1600/controls.png) no-repeat -25px 0; width:20px; height:20px; text-indent:-9999px;}
        #cboxClose:hover{background-position:-25px -25px;}

/*-----------------------------------------------------------------------------------*/
/*   Facebook fanbox popup For Blogger
/*-----------------------------------------------------------------------------------*/
#subscribe {
    font: 12px/1.2 Arial,Helvetica,san-serif; color:#fff;
}
#subscribe a,
#subscribe a:hover,
#subscribe a:visited {
    text-decoration:none;
}
.box-title {
   color: #00008b;
   font-size: 16px !important;
   font-weight: bold;
   margin: 10px 0;
border:1px solid #000;
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
box-shadow: 5px 5px 5px #00000;
padding:10px;
line-height:25px; font-family:arial !important;
}
.box-tagline {
   color: #000;
   margin: 0;
   text-align: center;
}
#subs-container {
    padding: 35px 0 30px 0;
    position: relative;
}
a:link, a:visited {
border:none;
}
.demo {
display:none;
}
</style>

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js'></script>
<script src="http://img89.xooimage.com/files/b/b/1/jquery.colorbox-min-381970d.js"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
   if (document.cookie.indexOf('visited=false') == -1) {
       var fifteenDays = 1000*60*60*24*30;
       var expires = new Date((new Date()).valueOf() + fifteenDays);
       document.cookie = "visited=true;expires=" + expires.toUTCString();
   $.colorbox({width:"340px", inline:true, href:"#subscribe"});
       }
});
</script>

<div style='display:none'>
   <div id='subscribe' style='padding:1px; background-color: #;
-moz-border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
border-radius: 5px;
-moz-box-shadow:5px 5px 8px #000;
'>
/*-----------------------------------------------------------------------------------*/
/* Despues de estas lineas podrian poner un titulo con el codigo que les voy a dar
/*-----------------------------------------------------------------------------------*/

      <center><div class='fanbox'><iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2Ftube-trucos%2F161206907309924&width=300&height=180&colorscheme=dark&show_faces=true&border_color&stream=false&header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:180px;" allowtransparency="true"></iframe></div></center></div></div>

El siguiente codigo es por si quieren añadirle un titulo donde les indique en el codigo anterior donde dice Te unes en Facebook lo pueden remplazar por lo que ustedes quieran eso es a gusto de cada persona todo va en la imaginacion .

<h4 class="box-title"><center>Te unes en Facebook</center></h4>

Lo que esta en color   000   es el color negro del fondo de la fanbox lo pueden remplazar por el color que ustedes quieran.
lo que esta en color dcdcda   es el color gris que esta tambien de fondo de la fanbox lo pueden remplazar por el color que ustedes quieran.

Donde dice    false   lo pueden remplazar por true ,con false aparece siempre que carge la pagina con true solo una ves .

Donde dice pages%2Ftube-trucos%2F161206907309924 lo remplazan por el nombre de su pagina en facebook si todavia no tienen la url personalizada y tienen nombre y numeros lo copian desde donde dice page y las / la remplazan por %2F una ves hecho eso la colocan donde les dije en el codigo .

Hecho todo le dan a guardar al gadget y nos vamos a la pagina ya podran apreciar que al cargar les aparece este fabuloso widget.

Personalizar la caja de comentarios de blogger añadiendole un fondo

Por Unknown 7 comments

Hasta no hace mucho hacer cambios en la caja de comentarios de blogger era inposible,debido al nuevo sistema de comentarios anidados que añadio blogger pero indagando un poco vi la forma de personalizar lo que es la caja de comentario añadiendole un fondo para cambiar el aspecto.

Entonces para darle este toque personal solo hay que seguir unos pocos pasos recuerden siempre guardar una copia de seguridad de su plantilla para eso nos dirigimos a plantilla >>> Edicion de html >>> Continuar >>> marcan Expandir plantillas de artilugios Y buscamos.

]]></b:skin>
Una ves encontrado pegamos el siguiente codigo justo encima :

#tube-trucos-form iframe{
background:#000000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEifIWdKBnYiLdz7Y6cMoDRDA5wDF5XXK05wkbUs81n4XSlG0zWu5S8hpA4nPJN20slXOBINjw8nCenyEfUrsNJjRxeNpwrLrkdKBAaQwbj79-ECL9wJ5sDdP0G4TeosNhptt46P4m-KLP0/s1600/fondos-graciosos-pc.jpg) repeat;
-webkit-transition:all 0.4s ease-in-out;
-moz-transition:all 0.4s ease-in-out;
-ms-transition:all 0.4s ease-in-out;
-o-transition:all 0.4s ease-in-out;
border:1px solid #ddd;
-moz-border-radius:6px;
-webkit-border-radius:6px;
box-shadow: 5px 5px 5px #CCCCCC;
padding:5px;
font:normal 12pt "ms sans serif", Arial;
color:#000000;
width:560px; height:213px !important;
}
#tube-trucos-form iframe{
background:#000000 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEifIWdKBnYiLdz7Y6cMoDRDA5wDF5XXK05wkbUs81n4XSlG0zWu5S8hpA4nPJN20slXOBINjw8nCenyEfUrsNJjRxeNpwrLrkdKBAaQwbj79-ECL9wJ5sDdP0G4TeosNhptt46P4m-KLP0/s1600/fondos-graciosos-pc.jpg) repeat;
border:2px dotted #F35C1B;

Lo que esta marcado en rojo lo cambian por su url ,por la imagen de sus gusto.

Recuerden que para una busqueda mas rapida usen Ctrl+F
Ahora buscan

<div class='comment-form'>

Y lo sustituyen por el siguiente:

<div id='tube-trucos-form'>

Una ves hecho los pasos correspondientes guardan la plantilla y van a una entrada para ver como les quedo el fondo en la caja de comentarios.

Nuevo widget de twitter para mostrar nuestra timeline en cualquier sitio web o blog

Por Unknown No comments

Twitter da un paso adelante con este widget,a pesar que ya existen algunas herramientas que te permiten mostrar tu timeline de Twitter en tu sitio web o blog, este es el primero creado por la famoza red social y es que han presentado este widget el cual nos va a permitir mostrar cualquier tipo de tweet en nuestro sitio web.

Gracias a este nuevo widget vamos a poder mostrar no solo nuestros tweets, sino también de cualquier otro usuario,que tengamos en la lista de favoritos.

Para poder obtener este widget, debemos dirigirnos a la sección widget de nuestra cuenta de Twitter, ahí damos clic en widget y luego en crear nuevo ,luego lo configuran a sus gusto (tamaño, color, etc). Luego nos mostrará un código HTML que debemos colocar en donde queramos en nuestro sitio web o blog.

Via: twitter blog

Gadget de entradas populares en colores con css

Por Unknown 2 comments

Normalmente la mayoria de los usuarios en blogger instalan el gadget de entradas populares el cual al intalarlo te da varias opciones pero ninguna con respecto a su estilo desde desde hace un tiempo, muchos han buscado la forma de darle un toque diferente pero nada.

Hasta que desde hace unos dias aparecio una forma de acerlo y con solo css,y muy facil de implementar .

1-Solo vayan a añadir un gadget y buscan Popular Post
lo configuran al tiempo que quieran pero sin señalar imagen señalan la cantidad que quieres mostrar y lo guardas.

2-Ahora con solo dar un click en el siguiente boton se te añadira el codigo al blog que decees sin tener que hacer nada mas .

</style>

Par el que ya tenga el gadget instalado solo le dan click al boton y es todo

El que no lo quiera añadir por la via mas rapida que es el boton ,entonces peguen el siguiente codigo en un gadget le dan a guardar y es todo ya van a tener mas personalizado sus entradas populares.

<style>
.sidebar .PopularPosts .widget-content ul li{
height: 100%;
line-height: 22px;
float: left;
clear: left;
list-style-type: none;
overflow: hidden;
color: black;
}
.sidebar .PopularPosts .widget-content ul{margin:0;padding:5px 0;list-style-type:none;}
.sidebar .PopularPosts .widget-content ul li{position:relative;margin:5px 0;border:0;padding:10px;opacity:0.8;
-webkit-transition:all 0.4s;
-moz-transition:all 0.4s;
-ms-transition:all 0.4s;
-o-transition:all 0.4s;}

.sidebar .PopularPosts .widget-content ul li:hover {border-radius:30px 0px 0px 0px;margin-left:10px;opacity:1.0}
.sidebar .PopularPosts .widget-content ul li:first-child {background:#ff4c54;width:95%}
.sidebar .PopularPosts .widget-content ul li:first-child:after{content:"1"}
.sidebar .PopularPosts .widget-content ul li:first-child + li{background:#ff764c;width:85%}
.sidebar .PopularPosts .widget-content ul li:first-child + li:after{content:"2"}
.sidebar .PopularPosts .widget-content ul li:first-child + li + li{background:#ffde4c;width:75%}
.sidebar .PopularPosts .widget-content ul li:first-child + li + li:after{content:"3"}
.sidebar .PopularPosts .widget-content ul li:first-child + li + li + li{background:#c7f25f;width:65%}
.sidebar .PopularPosts .widget-content ul li:first-child + li + li + li:after{content:"4"}
.sidebar .PopularPosts .widget-content ul li:first-child + li + li + li + li{background:#33c9f7;width:55%;padding-right:20px;}
.sidebar .PopularPosts .widget-content ul li:first-child + li + li + li + li:after{content:"5"}
.sidebar .PopularPosts .widget-content ul li:first-child + li + li + li + li +li{background:#7ee3c7;width:45%}
.sidebar .PopularPosts .widget-content ul li:first-child + li + li + li + li + li:after{content:"6"}
.sidebar .PopularPosts .widget-content ul li:first-child + li + li + li + li + li +li{background:#f6993d;width:35%}
.sidebar .PopularPosts .widget-content ul li:first-child + li + li + li + li + li + li:after{content:"7"}
.sidebar .PopularPosts .widget-content ul li:first-child:after,
.sidebar .PopularPosts .widget-content ul li:first-child + li:after,
.sidebar .PopularPosts .widget-content ul li:first-child + li + li:after,
.sidebar .PopularPosts .widget-content ul li:first-child + li + li + li:after,
.sidebar .PopularPosts .widget-content ul li:first-child + li + li + li + li:after,
.sidebar .PopularPosts .widget-content ul li:first-child + li + li + li + li + li:after,
.sidebar .PopularPosts .widget-content ul li:first-child + li + li + li + li + li + li:after{position:absolute;top:15px;right:-2px;border-radius:9%;background:#353535;width:30px;height:40px;line-height:2em;text-align:center;font-size:24px;color:#adadad;}
.sidebar .PopularPosts .widget-content ul li .item-thumbnail{float:left;border:0;margin-right:10px;background:transparent;padding:0;width:30px;height:90px}
.sidebar .PopularPosts .widget-content ul li a{font-size:18px;font-weight:bold;color:#000000;text-decoration:none;text-shadow:0px 0px 6px white;
-webkit-transition:all 0.4s;
-moz-transition:all 0.4s;
-ms-transition:all 0.4s;
-o-transition:all 0.4s;
}
.sidebar .PopularPosts .widget-content ul li a:hover{color:black;text-decoration:none;text-shadow:1px 1px 1px white;}

</style>

Blogger ya permite eliminar la navbar o barra de navegación desde nuestro panel de control.

Por Unknown No comments

Anteriormente a las personas que no les gustaba la navbar o barra de navegación de blogger ya sea por gusto o porque no le combinaba a la plantilla instalada. Esta solo aparece con una plantilla estándar de Blogger.Hasta hace poco, para eliminar la navbar o barra de navegación de Blogger que coloca en todas sus plantillas estándar, teníamos que colocar unos códigos html en nuestra plantilla para asi poder eliminarla.

Blogger nos facilito esta tarea y ya podemos hacerlo desde el propio administrador del blog. Pudiendo activarla o desactivarla cada vez que queramos.
Para desactivarla y que no aparezca debe de ir a “Diseño” y hacer click en “Editar” donde dice “Barra de navegación”.

Luego les aparecerá una ventana emergente y podran ver que al final de esa ventana aparece para la opción “Desactivado”, hagan click si quieren eliminar la barra de navegación.

Administrar la renovacion de un dominio comprado en blogger

Por Unknown 3 comments

Desde hace unos días he visto temas sobre como administrar los dominios que han sido comprado a través de Blogger,que pasa con esto quienes compran su dominio a través de Blogger la mayoría de las veces no hacen nada para configurarlo, pues Blogger,google lo hace de forma automática por nosotros, por lo que muchos ni se enteran cómo de como funciona todo despues y he ahí donde vienen luegos las preguntas de como pago la renovacion de mi dominio, como cambio la informacion de la tarjeta que use para la compra del dominio,etc......... y he ahí las precupaciones.

Pues bien, lo que les mostrare a continuación es información de como administrar nuestro dominio.Les aclaro que Blogger no es una compañia que se dedique a vender dominios, si bien se puede comprar el dominio desde la configuración del blog, no es Blogger o google quien nos lo vende, sino compañias como GoDaddy y eNom que son las que sí se dedican a la venta de dominios.

1-) Después de comprar tu dominio en Blogger, te debe llegar un correo de Google Apps que se titula "Confirmación de registro de dominios". Dentro de ese correo verás que dice algo como así "Si todavía no has creado una cuenta de administrador para tu dominio, haz clic en el enlace siguiente:

Para el que lo compro desde hace tiempo y nunca creo dicha cuenta de administrador a continuacion les brindo el enlace que debieron recibir en ese tiempo solo cambien lo que les voy a marcar.

https://www.google.com/a/cpanel/domain/setup/tudominio.com/faVaTzUBAAA.XIwV8hFMHakqUX6XOpxehA.zRb7NH0cAhQrSM8VDvpPVg?hl=es

2-)Una ves los haiga dirigido ese enlace, ahí podrán configurar una cuenta de correo personalizada de forma automática con el nombre de tu dominio seria algo así tunombre@tudominio.com Lo que elijan de nombre de usuario seria lo que dice tunombre(sin tener que ingresar registros en los DNS ni nada por el estilo), por ejemplo tunombre@tudominio.com . Una vez creada la cuenta de correo vas a ingresar a

https://www.google.com/a/tudominio.com

Google Apps

3-)Ponen el nombre de usuario que escogieron tunombre y el password,contraseña.una ves dentro van a Domain settings luego a domain names y podran ver la opcion si quieren la renovacion del dominio automatica o no ,si no se quieren preocupar que si su dominio se va a expirar pues solo señalen donde dice Automatically renew my domain registration every year .le dan a save mas abajo y es todo aquí.

4-)Ahora para administrar lo que es la forma de pagos es decir con lo que van a pagar que es la tarjeta que va a estar para lo pagos automaticos cada años,nos dirigimos a :

Google Checkout

checkout.google.com

5-)Van a entrar con la misma cuenta de google ,ya dentro veran cuando compraron su dominio ,que tarjeta usaron y toda la informacion acerca de la compra si quieren pueden dejar esa misma tarjeta o pueden eliminar la informacion de esa y poner otra ,con la cual google va a pagar tu dominio cada año,si ya no quieren renovar el dominio comprado van a donde señalaron Automatically renew my domain registration every year lo deselecionan le dan a save y ya no estara automatico el pago y dejas que se venza .

Las entradas en Blogger con url personalizada

Por Unknown No comments

Blogger in Draft ahora nos brinda la opción de incluir una URL personalizada en cada entrada que vayamos a crear. Esta nueva opción todavia no se encuentra disponible en el escritorio por defecto de Blogger,por lo que deberás utilizar Blogger in Draft para crear la entrada y así tendras la posibilidad de personalizar la url .

Esta herrramienta se encuentra en el panel de configuración de entradas, este se encuentra al lado derecho del editor.

De seguro se deben estar preguntando y para que nos sirve esto ,cual es el beneficio .Bueno con esto mejoramos el posicionamiento de las entradas.Ya que ahora podemos poner palabras claves en la url de la entrada un lugar muy importante.

Blogger genera las direcciones automáticamente de la siguiente forma:

http://www.tubetrucos.com/2012/07/las-entradas-de-blogger-con-url.html

Entonces si la personalizamos le pondriamos las palabras claves de la entrada:

blogger-url-personalizada

Y quedaria así:

http://www.tubetrucos.com/2012/07/blogger-url-personalizada.html

Via : Oloblogger

Cómo guardar los gadgets sin título en Blogger

Por Unknown 1 comment

Hace unos días algunos visitantes me han informado acerca de un pequeño problema que ha surgido.con el cual se ven desesperado sin saber que hacer, se trata de un error que no nos permite guardar un gadget o elemento de página en la barra lateral o en cualquier apartado del blog sin escribir antes su título.Pero esto no viene de ahora ya este problema se encuentra desde hace un tiempo.

Cuando queremos guardar un gadget nos aparece un mensaje, ( Campo obligatorio; no dejarse en blanco ) algo que hacemos muchos de nosotros para instalar algún truco, decorar el blog con imágenes, etc...

Afortunadamente como siempre existen un par de soluciones y bastante sencillas.por eso no hay que desesperarse siempre aparece alguna solución a los problemas en este caso jaime en su balcon nos habla hacerca de esto.

La primera solución a este problema con tan solo introducir en el campo de texto del título el carácter   este representa un espacio en blanco, ya con solo este carácter se soluciona el problema ,porque ya nos permitirá guardar el gadget sin necesidad de agregarle un título.

La segunda opción requiere de mas tiempo pero es también muy efectiva, sobre todo si vas a editar el gadget con frecuencia y no deseas estar copiando el carácter previamente descrito.

1) Darle un título al gadget y guardarlo

2) Accede a plantilla >>> edición de Html >>> continuar >>> Expandir plantillas de artilugios.

3) Pulsando las teclas Ctrl + F para abrir el buscador de tu navegador, escribe el título que le acabas de poner al gadget.

4) Encontrarás un código muy similar a esto:

<b:widget id='HTML6' locked='false' title='AQUI APARECE EL TITULO' type='HTML'>
<b:includable id='main'>

<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>

<b:include name='quickedit'/>
</b:includable>
</b:widget>

Ahora solo debes de borrar la parte que ves en naranja y guardar la plantilla para terminar.

Compartir tus entradas de blogger automáticamente a google plus

Como Instalar y personalizar el nuevo formulario de contacto de blogger

Mostrar con efecto la fanBox de facebook al hacer Scroll

Solucion al error bX-ga8xow de blogger

Como recuperar nuestro código de Google Analytics

Nuevo gadget para mostrar tus seguidores de Google + en blogger

Como añadir un autor a blogger usando el nuevo diseño

Señalando el código que añadimos en nuestra plantilla

Como instalar el Sistema de estadísticas y visitas de Google Analytics

Los Símbolos y caracteres más utilizados en la red social Facebook

Personalizar el Gadget de etiquetas dandole un estilo diferente

Mostrar la fanbox de twitter en una lightbox al cargar la pagina con Jquery

Mostrar la fanbox de facebook en una lightbox al cargar la pagina con Jquery

Personalizar la caja de comentarios de blogger añadiendole un fondo

Nuevo widget de twitter para mostrar nuestra timeline en cualquier sitio web o blog

Gadget de entradas populares en colores con css

Blogger ya permite eliminar la navbar o barra de navegación desde nuestro panel de control.

Administrar la renovacion de un dominio comprado en blogger

Las entradas en Blogger con url personalizada

Cómo guardar los gadgets sin título en Blogger

Popular Posts

Seguidores

te unes en facebook ?

Te gustó lo que viste?

Estadística de T.trucos

Me llevas a tu blog▼▲

Blogroll▼▲

directorios▼▲

Etiquetas

Archivo del blog

Comentarios recientes

visitantes

Labels

Redes Sociales

Popular Posts

Seguidores

te unes en facebook ?

Te gustó lo que viste?

Estadística de T.trucos

Me llevas a tu blog▼▲

Blogroll▼▲

directorios▼▲

Etiquetas

Archivo del blog

Comentarios recientes

visitantes

Labels