headline photo

Entradas populares

Como poner descripción de enlaces blogger en facebook

sábado, 11 de junio de 2011

Bueno regreso con un nueva entrada  acerca de como unir el facebook y el blogger, muchos tenemos el inconveniente que cuando publicamos los link de nuestro blog en el facebook en la descripción siempre nos sale lo mismo para todas las entradas, en muchas paginas que vi comentaban q les salia error por eso me atreví a crear esta entrada por que yo tengo en funcionamiento este método y me va muy bien espero poder ayudarlos aquí les muestro  un ejemplo de como aparecían antes los enlaces de mi blog en facebook. 
imagen(clic para agrandar)
Lo que tenemos que hacer para que nos muestre un Titulo y una parte de nuestro contenido en los enlaces de facebook se muestren automáticamente, tienen que seguir los siguientes pasos (no duden todo lo que publico esta comprobado por mi). 
Importante: hagan su copia de seguridad antes de comenzar tal vez se equivocan en uno de los pasos.  

Primero.
Entramos a blogger > diseño > edición html > activamos la casilla expandir plantillas de artilugios.


Presionamos ctrl+F y buscamos  <head> debajo de el insertamos el siguiente código.


 <b:include data='blog' name='all-head-content'/>
   <b:if cond='data:blog.pageName == &quot;&quot;'>
    <title><data:blog.title/></title>
    <b:else/>
    <title><data:blog.pageName/> | <data:blog.title/></title>
    </b:if>


Segundo

Presionamos control+f y buscamos <data:post.body/> y arriba de el pegamos 

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:if cond='data:post.snippet'>
<meta expr:content='data:post.snippet' name='description'/>
</b:if>
</b:if
>


y guardamos.


Tercero 

Volvemos a Buscar  <data:post.body/> y le agregamos <p></p> de manera que quede así:

<p> <data:post.body
/> </p>


y lo guardamos. 
Aquí les dejo una imagen de como queda

Para ver los cambios publiquen un enlace que no publicaste recientemente.

Leer más...

Crear pestaña iframe en facebook con app

viernes, 10 de junio de 2011

Facebook va dejar el código fbml por html atreves de los iframe mejor dicho, las pestañas iframe van a ser una forma más fácil de insertar código html en nuestras páginas Facebook.

Comencemos creando una aplicación facebook

Primero:

Creamos un index.html en un hosting  que a ti te convenga  (Yo uso miarroba  http://hosting.miarroba.com/) y si van a usar  un hosting gratuito de preferencia que sea sin publicidad. 
En el nombre de tu página te recomiendo no poner nombres ofensivos o racistas ya que Facebook lo reconoce y no t dejara publicar.

Segundo:

El código que tendrá tu index.html será este, después lo modificas pero sin cambiar el width.(plantilla pestaña)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style>
.container {
width:495px;
height:600px;
display:block;
background:red no-repeat left top;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#000000;
}
.mensaje {
text-align:center;
font-size:30px;
font-weight:bold;
padding-top:10px;
}
#mensaje1 {
text-align:center;
font-size:15px;
font-weight:bold;
padding-top:0px;
}
.url {
color:#B36B00;
font-size:25px;
text-align:center;
padding-top:20px;
}
</style>
</head>
<body>
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgGcwIu2cdvawKqysE5KVEQ3B8B-fmBaxvKKO2uN5LDsBUcRPxNs6nDpfxAT5APleb6rrTn745zXrUkDiQcyUa_Gb-ylW-BRiGevRDgjBZR8mqq9AldOrHHLtNxiLpo6UKmFM2QoYPiHYo/s1600/cab.png' >
<div class="container">
<div class="mensaje">BIENVENIDOS</div>
<div class="mensaje">DALE UN ME GUSTA Y VISITA NUESTRO BLOG</div>
<div class="url"><a href="http://elpuenteaxel.blogspot.com/" target="_blank">http://elpuenteaxel.blogspot.com/</a></div>
<div class="mensaje1"></div>
<div class="url">facebook.com/Elpuenteaxel</div>
</div> 
</body> 
</html>

Pueden ver un ejemplo de cómo queda AQUI 

Tercero:

Como tercer paso crearemos un aplicación facebook, para eso nos  dirigimos a la página de desarrolladores https://www.facebook.com/developers/  y  hacemos clic en crear aplicación.
Llena los datos y acepta  las  condiciones de facebook.

Tal como se muestra en la siguiente imagen (clic para agrandar)


Luego copias la captcha  y aceptas.



Cuarto:

Ahora configuraremos la aplicación: En acerca de:

Tal como se muestra en la siguiente imagen (clic para agrandar)

En Sitio Web:
En site URL  solo pones la url de la página que creamos para hospedar nuestra pestaña de la página de Facebook
Tal como se muestra en la siguiente imagen (clic para agrandar)

Integración con Facebook:
En canvas URL: ponemos nuevamente la url sin el  index.html (Ejemplo: http://teloenvio.webcindario.com/ )
Tamaño Iframe: Autoajustar
En url de pestaña: Solo ponemos  en  nombre con que guardamos  que en este ejemplo es index.html (Ejemplo: index.html) 
Facebook  lo va reconocer automáticamente una vez guardado.

Tal como se muestra en la siguiente imagen (clic para agrandar)








Ahora Guardamos y terminamos con la aplicación.

Quinto :

Ahora nos dirigimos a Regresar a mis Apps.
Seleccionamos nuestra aplicación y hacemos clic en  pagina de perfil de la aplicación.

Tal como se muestra en la siguiente imagen (clic para agrandar)


Una vez en el perfil nos vamos a agregar a mi página.

Tal como se muestra en la siguiente imagen (clic para agrandar)

Y terminamos  el resultado es esto.

Tal como se muestra en la siguiente imagen (clic para agrandar)


Esta es una de mis otras paginas


Para Solucionar  el problema del  scrollbars en la pestaña de iframe de facebook facebook.
Buscamos  del código que les di anteriormente <body> y lo reemplazamos por :

<apex:page> 
 <body style="overflow: hidden"> 
  <div id="fb-root"></div> 
  <script> 
    window.fbAsyncInit = function() { 
   FB.Canvas.setAutoResize(); 
    }; 
    (function() { 
   var e = document.createElement('script'); e.async = true; 
   e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js'; 
   document.getElementById('fb-root').appendChild(e); 
    }()); 
  </script>

Ahora buscamos  </body> y de  bajo de esto pegamos :

</apex:page>

Y el problema quedo solucionado.




Leer más...

Crear una pagina en Facebook


Primero:

Ingresamos a  http://www.facebook.com/pages/create.php  una vez  dentro escogemos el tipo de página que deseas crear puede ser Lugar o negocio local, Empresa, organización o institución, Marca o producto, Artista, grupo de música o personaje público, etc.  Y  llenamos los datos que nos pide.
Tal como se muestra en la siguiente imagen (clic para agrandar)

Segundo:
Ya creada nuestra página nos vamos a editar y agregamos más información sobre nuestra página.
Tal como se muestra en la siguiente imagen (clic para agrandar)



Para URL corta debes tener primero mas de 25 seguidores y quede asi.
http://www.facebook.com/nombre_de_tu_empresa_o_blog


¿Por qué es bueno crear una página facebook a nuestro negocio o web?
1 - Facilidad de vinculación: Desde tu página de fans enlazas directamente tu website.
2 – Los Fans se aprueban solos: La gente puede a ser seguidora de tu página en Facebook sin tener que ser aprobada primero.
3 – Ilimitada cantidad de fans: Puedes tener una cantidad ilimitada de aficionados.
4 - Comunidad: Debido a que los fans pueden hacer comentarios sobre tus posts, se crea un sentido de comunidad en donde pueden compartir sus pensamientos y opiniones.
5 – Lista de correo instantánea: Puedes instantáneamente enviar una actualización a todos los fans.
6 – Divulgación diaria: La gente se conecta y revisa Facebook todos los días.
7 - Relevancia y Control: Te permite mantener las comunicaciones de negocios en tu página de fans y las actualizaciones personales en tu página personal.
8 - Mayor exposición: Las páginas de fans son públicas.
9 – Marketing Viral: Aun si tus fans no toman la iniciativa de recomendar tu página entre su red de amigos y conocidos, en los perfiles personales de todos tus fans se va a ver tu página.
10 – Toma precauciones para que no te cierren la cuenta: Los Términos y Condiciones de uso de Facebook explican que cualquier uso comercial de una cuenta personal es motivo para su desactivación.

Leer más...

Poner Boton me gusta de facebook en blogger

Les voy a enseñar de manera rápida y eficaz como se inserta el botón de facebook en todos sus entradas. Empecemos 

Primero 

Nos vamos al blogger > luego clic en diseño > edición HTML > y activamos la casilla EXPANDIR ARTILUGIOS
  Como se muestra en la siguiente imagen(clic para agrandar)

Segundo 



presionamos Ctrl + F para que se habilite el buscador (el cual va a aparecer en la parte de arriba del navegador) ahí pegamos <div class='post-footer-line post-footer-line-1'> ó <p class='post-footer-line post-footer-line-1'> (varía por el tipo de plantilla)

 tal como se muestra en la siguiente imagen (clic para agrandar)


Tercero
Debajo del resultado de la búsqueda que les salga pegan el siguiente código:

<div id="fb-root"></div><script src="http://connect.facebook.net/es_ES/all.js#xfbml=1"></script><fb:like expr:href="data:post.url" send="false" layout="box_count" width="450" show_faces="false" font=""></fb:like> 
Y guardamos. Si desean modificar el código de tipo de me gusta :


layout  hay tres opciones.
  • standard - muestra el texto social a la derecha del botón y "el perfil amigos fotos a continuación. La anchura mínima: 225 píxeles. ancho por defecto: 450 píxeles. Altura: 35 píxeles (sin fotos) o de 80 píxeles (con fotos).
  • button_count -  muestra el número total de le gusta a la derecha del botón. Ancho mínimo: 90 píxeles.ancho por defecto: 90 píxeles. Altura: 20 píxeles.
  • box_count -  muestra el número total de los gustos sobre el botón. Ancho mínimo: 55 píxeles. ancho por defecto: 55 píxeles. Altura: 65 píxeles.
show_faces - muestra la foto de tus amigos a los que les gusto, solo se utiliza en      standard . True (si mostrar) False(no mostrar).


send - además boton enviar True (si mostrar) False(no mostrar). 

VEA UN EJEMPLO AQUI

Leer más...