Insertar la insignia de Google+ en nuestro sitio web o blog. – Hipotecario – World – cancer – php

Parainsertar lainsignia de Google+ en nuestro sitio webo blog lo que haremos será ingresar al siguiente enlace:
https://developers.google.com/+/web/badge/?hl=es

Debemos haber ingresado con nuestra cuenta de google+ y nos aparecerá una página mostrándonos del lado izquierdo la configuración de la insignia, y del lado derecho una vista previa de la insignia que insertaremos en nuestro sitio web o blog junto al códigohtml que necesitaremos para ello.

Lo primero que haremos será configurar la insignia a nuestro gusto y dependiendo del diseño de nuestro sitio web.

Entre las opciones tenemos:

• Usuario de Google+ en mi caso+Francisco Velasquez
• Funciones, para esta ocasión elegiremos insignia.
• Diseño,se cuenta con dos tipos de diseño: retrato y paisaje. Para retrato nos muestra nuestra imagen de perfil junto a la foto de portada, nuestro nombre y el botón de seguir. Para paisaje nos muestra lo anteriormente mencionado sin la foto de portada.
• Temas de color,claro y oscuro (color blanco y gris oscuro).
• Sí elegimos la opción retratopodemos quitar la foto de portada deshabilitándole.
• A su vez podemos deshabilitar el eslogan.
• Por último el idioma.

Una vez configurada la insigniacopiaremos el código html y lo insertaremos en el lugar que deseemos dentro de la plantilla del sitio web.

Para agregar nuestra insignia a nuestro blog deblogger tenemos la opción de ir adiseño.

Una vez allí hacemos clic enañadir un gadget.

Añadiremos la insignia de Google+.

Luego, configuraremos nuestra insignia y hacemos clic enguardar para añadirla a nuestro blog.


También te podría interesar:
Pop-up caja de me gusta facebook para blogger
Bloquear el acceso a sitios web utilizando archivo hosts
Solución - No puedo ver los anuncios de adsense desde mi computadora

Pop-up caja de me gusta facebook para blogger – School – Hard drive – Accident – Dominios

Una buena idea para mantenernos en contacto con nuestros lectores es mediante las redes sociales, con facebook podemos crear páginas de fans de nuestro sitio web y compartir constantemente nuestras entradas. Una buena forma de asegurarnos de que los que visitan nuestro blog hagan clic en "me gusta" es con un pop-up que se abra cuando visitan nuestro blog.

Para agregar este pop-up a nuestro blog lo que haremos será ir al panel de administración de blogger y entramos en diseño.

Una vez allí hacemos click en añadir un gadget

Agregaremos un gadget del tipo HTML/Javascript

Nos abrirá una nueva ventana en la que pegaremos el siguiente código

script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/script
style
#fanback {
display:none;
background:rgba(0,0,0,0.8);
width:100%;
height:100%;
position:fixed;
top:0;
left:0;
z-index:99999;
}
#fan-exit {
width:100%;
height:100%;
}
#JasperRoberts {
background:white;
width:420px;
height:270px;
position:absolute;
top:58%;
left:63%;
margin:-220px 0 0 -375px;
-webkit-box-shadow: inset 0 0 50px 0 #939393;
-moz-box-shadow: inset 0 0 50px 0 #939393;
box-shadow: inset 0 0 50px 0 #939393;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
margin: -220px 0 0 -375px;
}
#TheBlogWidgets {
float:right;
cursor:pointer;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEicJuHHjQWbQG_vR4Nv1DD-nj-pONUG6VmHqi3Eo-3geiBJqI5MCkXJS3bH5BFBIjXJR1YguRGHblkxipY59-PvlpE8Lm9qmNj_I9HpsaiD13o7dlkZI_Bvo2J8TaTUB45xPHVPoLb_BJs3/s1600/TheBlogWidgets.png) repeat;
height:15px;
padding:20px;
position:relative;
padding-right:40px;
margin-top:-20px;
margin-right:-22px;
}
.remove-borda {
height:1px;
width:366px;
margin:0 auto;
background:#F3F3F3;
margin-top:16px;
position:relative;
margin-left:20px;
}
#linkit,#linkit a.visited,#linkit a,#linkit a:hover {
color:#80808B;
font-size:10px;
margin: 0 auto 5px auto;
float:center;
}
/style


script type='text/javascript'
//![CDATA[
jQuery.cookie = function (key, value, options) {

// key and at least value given, set cookie...
if (arguments.length  1 && String(value) !== "[object Object]") {
options = jQuery.extend({}, options);

if (value === null || value === undefined) {
options.expires = -1;
}

if (typeof options.expires === 'number') {
var days = options.expires, t = options.expires = new Date();
t.setDate(t.getDate() + days);
}

value = String(value);

return (document.cookie = [
encodeURIComponent(key), '=',
options.raw ? value : encodeURIComponent(value),
options.expires ? '; expires=' + options.expires.toUTCString() : '', // use expires attribute, max-age is not supported by IE
options.path ? '; path=' + options.path : '',
options.domain ? '; domain=' + options.domain : '',
options.secure ? '; secure' : ''
].join(''));
}

// key and possibly options given, get cookie...
options = value || {};
var result, decode = options.raw ? function (s) { return s; } : decodeURIComponent;
return (result = new RegExp('(?:^|; )' + encodeURIComponent(key) + '=([^;]*)').exec(document.cookie)) ? decode(result[1]) : null;
};
//
/script
script type='text/javascript'
jQuery(document).ready(function($){
if($.cookie('popup_user_login') != 'yes'){
$('#fanback').delay(20000).fadeIn('medium');
$('#TheBlogWidgets, #fan-exit').click(function(){
$('#fanback').stop().fadeOut('medium');
});
}
$.cookie('popup_user_login', 'yes', { path: '/', expires: 7 });
});
/script

div id='fanback'
div id='fan-exit'
/div
div id='JasperRoberts'
div id='TheBlogWidgets'
/div
div class='remove-borda'
/div
iframe allowtransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?

href=http://www.facebook.com/BlogUnEstudiantedeInformatica&width=402&height=255&colorscheme=light&show_faces=true&show_border=false&stream=false&header=false'

style='border: none; overflow: hidden; margin-top: -19px; width: 402px; height: 230px;'/iframecenter
span style="color:#a8a8a8;font-size:8px;" id="linkit"Powered by a rel="nofollow" style="color:#a8a8a8;font-size:8px;" href="http://jasperroberts.com"Jasper Roberts Consulting/a - a style="color:#a8a8a8;font-size:8px;" href="http://www.theblogwidgets.com"Widget/a/span/center
/div
/div

Copiamos y pegamos el código anterior como se muestra en esta imagen. Además buscamos la línea que contiene el enlacehttp://www.facebook.com/BlogUnEstudiantedeInformatica y la cambiamos por el enlace de nuestra página de facebook.Finalmente hacemos click en guardar.

Es importante resaltar que este pop-up solo se mostrará una vez a cada visitante, a menos que este borre las cookies. El pop-up se mostrará luego de 20 segundos, sí queremos aumentar o disminuir este tiempo buscamos la línea$('#fanback').delay(20000).fadeIn('medium'); yeditamos el delay que es el tiempo en milisegundos que tarda en mostrarse el pop-up. Es decir, sí son 20000 milisegundos correspondería a 20 segundos. Y sí queremos que se muestre en 10 segundos entonces cambiaríamos 20000 por 10000.

Agregar dos FanPages al pop-up:

En los comentarios de esta entradaAnaTuron preguntaba sí es posible agregar más de una página de fans al pop-up. Si, es posible.

Sí poseemos mas de una página de fans en facebook una buena opción podría ser agregar al menos dos de estas al pop-up, esto lo haremos insertando un nuevo iframe de la caja de facebook cambiando para este el enlace de la fanpage. También hacer un cambio en el css en cuanto a la altura del gadget. El código html para poder agregar dos fanpage es el siguiente:

script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/script
style
#fanback {
display:none;
background:rgba(0,0,0,0.8);
width:100%;
height:100%;
position:fixed;
top:0;
left:0;
z-index:99999;
}
#fan-exit {
width:100%;
height:100%;
}
#JasperRoberts {
background:white;
width:420px;
height:540px;
position:absolute;
top:58%;
left:63%;
margin:-220px 0 0 -375px;
-webkit-box-shadow: inset 0 0 50px 0 #939393;
-moz-box-shadow: inset 0 0 50px 0 #939393;
box-shadow: inset 0 0 50px 0 #939393;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
margin: -220px 0 0 -375px;
}
#TheBlogWidgets {
float:right;
cursor:pointer;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEicJuHHjQWbQG_vR4Nv1DD-nj-pONUG6VmHqi3Eo-3geiBJqI5MCkXJS3bH5BFBIjXJR1YguRGHblkxipY59-PvlpE8Lm9qmNj_I9HpsaiD13o7dlkZI_Bvo2J8TaTUB45xPHVPoLb_BJs3/s1600/TheBlogWidgets.png) repeat;
height:15px;
padding:20px;
position:relative;
padding-right:40px;
margin-top:-20px;
margin-right:-22px;
}
.remove-borda {
height:1px;
width:366px;
margin:0 auto;
background:#F3F3F3;
margin-top:16px;
position:relative;
margin-left:20px;
}
#linkit,#linkit a.visited,#linkit a,#linkit a:hover {
color:#80808B;
font-size:10px;
margin: 0 auto 5px auto;
float:center;
}
/style


script type='text/javascript'
//![CDATA[
jQuery.cookie = function (key, value, options) {

// key and at least value given, set cookie...
if (arguments.length  1 && String(value) !== "[object Object]") {
options = jQuery.extend({}, options);

if (value === null || value === undefined) {
options.expires = -1;
}

if (typeof options.expires === 'number') {
var days = options.expires, t = options.expires = new Date();
t.setDate(t.getDate() + days);
}

value = String(value);

return (document.cookie = [
encodeURIComponent(key), '=',
options.raw ? value : encodeURIComponent(value),
options.expires ? '; expires=' + options.expires.toUTCString() : '', // use expires attribute, max-age is not supported by IE
options.path ? '; path=' + options.path : '',
options.domain ? '; domain=' + options.domain : '',
options.secure ? '; secure' : ''
].join(''));
}

// key and possibly options given, get cookie...
options = value || {};
var result, decode = options.raw ? function (s) { return s; } : decodeURIComponent;
return (result = new RegExp('(?:^|; )' + encodeURIComponent(key) + '=([^;]*)').exec(document.cookie)) ? decode(result[1]) : null;
};
//
/script
script type='text/javascript'
jQuery(document).ready(function($){
if($.cookie('popup_user_login') != 'yes'){
$('#fanback').delay(20000).fadeIn('medium');
$('#TheBlogWidgets, #fan-exit').click(function(){
$('#fanback').stop().fadeOut('medium');
});
}
$.cookie('popup_user_login', 'yes', { path: '/', expires: 7 });
});
/script

div id='fanback'
div id='fan-exit'
/div
div id='JasperRoberts'
div id='TheBlogWidgets'
/div
div class='remove-borda'
/div
piframe allowtransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?

href=http://www.facebook.com/NombreDeLaPrimeraFanPage&width=402&height=255&colorscheme=light&show_faces=true&show_border=false&stream=false&header=false'

style='border: none; overflow: hidden; margin-top: -19px; width: 402px; height: 230px;'/iframe/p
piframe allowtransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?

href=http://www.facebook.com/NombreDelaSegundaFanPage&width=402&height=255&colorscheme=light&show_faces=true&show_border=false&stream=false&header=false'

style='border: none; overflow: hidden; margin-top: -19px; width: 402px; height: 230px;'/iframe/pcenter
span style="color:#a8a8a8;font-size:8px;" id="linkit"Powered by a rel="nofollow" style="color:#a8a8a8;font-size:8px;" href="http://jasperroberts.com"Jasper Roberts Consulting/a - a style="color:#a8a8a8;font-size:8px;" href="http://www.theblogwidgets.com"Widget/a/span/center
/div
/div

IMPORTANTE
Solo debemos editar el enlace de nuestras páginas de fans de facebook donde dice:

http://www.facebook.com/NombreDeLaPrimeraFanPage
http://www.facebook.com/NombreDelaSegundaFanPage

Una vez agregado el gadget nuestro pop-up con dos páginas de fans se vería de la siguiente manera:

También te podría interesar:
Slider automático de últimas entradas para blogger
Iconos sociales color azul para blogger
Crear formulario de contacto para blogger
Colocar código en entradas de blog

Agregando nuestro sitio web a los buscadores google y bing – Texas – Habitaciones – Record

Cuando creamos un sitio web una de las primeras cosas que debemos hacer esagregarlo a buscadores comogoogle ybing para generar mayor cantidad de visitas.

Para agregar nuestro sitio web al buscador degoogle iremos al siguiente enlace:

https://www.google.com/webmasters/tools/submit-url . Ingresaremos la url de nuestro sitio web, el codigocaptcha y hacemos click enenviar solicitud, una vez hecho esto nos aparecerá un breve mensaje indicando que nuestrasolicitud ha sido recibida y será procesada. Por lo general debemos esperar algunas horas para que nuestro sitio web aparezca en el buscador de google, debido a que deben comprobar que nuestro sitio web sea confiable y no se dedique alphishing o crear spam a través de internet.

Para comprobar que nuestro sitio web aparece en google ingresamos en el buscador nuestra url antecedido porsite:. Esto sería:site:http://www.tusitioweb.com/.

Sí fuese el caso de querer buscar y ver todas las páginas y enlaces indexados a este blog lo haríamos así:site:http://unestudiantedeinformatica.blogspot.com/

Recomiendo agregar nuestro sitio web a las herramientas para webmasters de googlehttps://www.google.com/webmasters/tools/home?hl=esesto nos ayudará a que nuestro sitio web esté optimizado al máximo y sea compatible con Google.

Para agregar nuestro sitio aBingingresamos ahttp://www.bing.com/toolbox/submit-site-url completamos el formulario y hacemos click en enviar.

Una vez hecho estos pasos ya nuestro sitio web aparecerá en los resultados de búsqueda de google y bing.

En cuanto a google, he notado que sí compartimos nuestras entradas en la red social google+ ya sea en nuestro perfil o en comunidades, mientras mayor cantidad de+1reciben las entradas, mejor es la posición de esta en los resultados de búsqueda.

Slider automático de últimas entradas para blogger – Shipping – coche – PHD

Este era un slider que tenía en la anterior plantilla de mi blog en la barra lateral derecha para mostrar las últimas entradas. Sí quieres agregarlo a tu blog sigue estos pasos:

Abrimos elpanel de administración de blogger y hacemos clic enDiseño, luego enañadir un gadgetHTML/Javascript . En esta ventana pegaremos el siguiente código.

style scoped="" type="text/css"
/*
Made by AllBloggerTricks.com with lot of hardwork please keep the comment intact
*/
ul.abt-sidebar-slider *{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}
ul.abt-sidebar-slider{font:normal normal 11px Verdana,Geneva,sans-serif}
ul.abt-sidebar-slider,ul.abt-sidebar-slider li{margin:0;padding:0;list-style:none;position:relative}
ul.abt-sidebar-slider{width:100%;height:500px}
ul.abt-sidebar-slider li{height:24.5%;position:absolute;padding:0;width:49.5%;float:left;overflow:hidden;display:none}
ul.abt-sidebar-slider li:nth-child(1),ul.abt-sidebar-slider li:nth-child(2),ul.abt-sidebar-slider li:nth-child(3),ul.abt-sidebar-slider li:nth-child(4){display:block}
ul.abt-sidebar-slider img{border:0;width:100%;height:100%}
ul.abt-sidebar-slider li:nth-child(1){width:100%;height:49.5%;margin:0 0 2px;left:0;top:0}
ul.abt-sidebar-slider li:nth-child(2){left:0;top:50%}
ul.abt-sidebar-slider li:nth-child(3){left:50.5%;top:50%}
ul.abt-sidebar-slider li:nth-child(4){width:100%;left:0;top:75%}
ul.abt-sidebar-slider  .overlayx,ul.abt-sidebar-slider li{-webkit-transition:all .4s ease-in-out;-moz-transition:all .4s ease-in-out;-o-transition:all .4s ease-in-out;-ms-transition:all .4s ease-in-out;transition:all .4s ease-in-out}
ul.abt-sidebar-slider .overlayx{width:100%;height:100%;position:absolute;z-index:2;left:0;top:0;background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgEbCtJYpkGgD62Qu87D9Grc77sTXN__hMUPd3Obu1p9hOQPgVu9_eMeKP5OwiH-2CsUNYIE41mdvNAUn_Py-BSicSmBDCQc1T3wP2pEuacrLBn4sy64iHif-792kzrmrQusWGPizZGmp0/s1600/linebg-fade.png);background-position:50% 50%;background-repeat:repeat-x}
ul.abt-sidebar-slider .overlayx,ul.abt-sidebar-slider img{border:4px solid #2E8DCE;-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px}
ul.abt-sidebar-slider li:nth-child(1) .overlayx{background-position:50% 25%}
ul.abt-sidebar-slider .overlayx:hover{-ms-filter:"progid:DXImageTransform.Microsoft. Alpha(Opacity=10)";filter:alpha(opacity=10);-khtml-opacity:0.1;-moz-opacity:0.1;opacity:0.1}
ul.abt-sidebar-slider h4{position:absolute;bottom:30px;z-index:2;color:white;margin:0;width:100%;padding:0 10px;line-height:1.5em;font-family:Georgia,Times,"Times New Roman";font-weight:normal}
ul.abt-sidebar-slider li:nth-child(1) h4,ul.abt-sidebar-slider li:nth-child(4) h4{font-size:150%}
ul.abt-sidebar-slider .label_text{position:absolute;bottom:10px;left:10px;z-index:2;color:white;font-size:90%}
ul.abt-sidebar-slider li:nth-child(2) .autname,ul.abt-sidebar-slider li:nth-child(3) .autname{display:none}
.buttons{margin:5px 0 0}
.buttons a{display:inline-block;text-indent:-9999px;width:15px;height:25px;position:relative}
.buttons a::before{content:"";width:0;height:0;border-width:8px 7px;border-style:solid;border-color:transparent #535353 transparent transparent;position:absolute;top:50%;margin-top:-8px;margin-left:-10px;left:50%}
.buttons a.nextx::before{border-color:transparent transparent transparent #535353;margin-left:-3px}
/style
div id="featuredpostside"/div
script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"/script
script src="https://dl.dropboxusercontent.com/u/76401970/All%20Blogger%20Tricks/abt-sidebar-slider.js" type="text/javascript"/script
script type='text/javascript'
//![CDATA[
FeaturedPostSide({
blogURL:"http://unestudiantedeinformatica.blogspot.com/",
MaxPost:8,
idcontaint:"#featuredpostside",
ImageSize:300,
interval:5000,
autoplay:true,
tagName:false
});
//
/script

Lo mas importante. Debemos ubicar la siguiente línea:

blogURL:"http://unestudiantedeinformatica.blogspot.com/",

Y reemplazarhttp://unestudiantedeinformatica.blogspot.com/por laurl de tu blog.

También sí queremos podemos editar el número de post a mostrar, el intervalo de la transición, y las medidas en pixeles del slider.

MaxPost:8,

Se mostrarán las últimas 8 entradas.

interval:5000,

El intervalo de la transición son 5000 milisegundos (5 segundos).

ul.abt-sidebar-slider{width:100%;height:500px}

El ancho del slider se reducirá o aumentará en cuanto a un porcentaje y el alto en pixeles.

Demo del slider:

También te podría interesar:
Pop-up caja de me gusta facebook para blogger
Agregando nuestro sitio web a los buscadores google y bing
Iconos sociales color azul para blogger
Crear formulario de contacto para blogger

Iconos sociales color azul para blogger – coche – Arquitectura – Motor

Siempre es conveniente en nuestro blog brindar a nuestros lectores la posibilidad de seguirnos a través de nuestras redes sociales. Con este gadget lo podremos hacer.

Solo debemos ir al panel de administración de blogger e ir a Diseño, luego añadiremos un gadgetHTML/Javascript y copiamos y pegamos el siguiente código:

div id="social"
a href="Url de tu facebook aqui" target="_blank"img alt="Facebook" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0QfGG0WbB8rJLw2pfwI_M99mNqA-JfdeyR3n4gqTvJnr2cRjjso8Rq5L-Kw__b3hYACzCJp0USUQFY559TZNUJUghgF1k8PDkAhqaeP7o0LsPshhp3OGkmOPzWsDIiF59_7ZJE3Isi3o/s64-no/thumbs_097124-3d-glossy-blue-orb-icon-social-media-logos-facebook-logo.png" title="Siguenos en Facebook" //a
a href="Url de tu google+ aqui" target="_blank"img alt="Google+" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkorys9hbk4xlTEb1pJLZSnL9m0I3BauxDygmdAZqLfRG54FOcFSgHjpRfrq5bC940SNmHgc5Y5dzGv5kPc9pPV0uRafBIPiEu60ULrpvR2PwyHVFnpJyGbzNFblc_fnDt0wWEhtsBsVg/s64-no/thumbs_097137-3d-glossy-blue-orb-icon-social-media-logos-google-g-logo.png" title="Siguenos en Google Plus" //a
a href="Url de tu twitter aqui" target="_blank"img alt="Twitter" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIzDIY3KS-8BRaWINOwJD4LDDTfJb9r8-xYYe29e_Hsg2-jssAmxXRZy0RlNKzPme62OWVMUMVkDI_fKnlqJDPSzBBkanvvBBHrnTZtLFqfbCgzaoUlDMiozilbLhetYIMMbC60tj7Eg0/s64-no/thumbs_097196-3d-glossy-blue-orb-icon-social-media-logos-twitter.png" title="Siguenos en Twitter" //a
a href="Url de tu feed aqui" target="_blank"img alt="RSS" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSVLCOLVc8u-WGdqD9UOH_AjCrWMpUilvlXYFQe85bY9h3QgLiRnSLTYc3YQ3B7qpmwjuWXkecPQ_HpvzczaI8M8A45IJu45izka_o9kiCvOBV6KAf4FOkRIBdi1oHh9Ht0NNcrWpJTpY/s64-no/thumbs_097172-3d-glossy-blue-orb-icon-social-media-logos-rss-basic.png" title="Suscribete a nuestro RSS" //a/div
br /
br /
br /

Debemos remplazarUrl de tu facebook aquipor la url o enlace de tu facebook o fan page,Url de tu google+ aquipor la url o enlace de tu google+. Haremos similarmente con los otros botones.