Soporte
EN PT ES
Wiki
Contenido
Discusión
Historial
Backlinks

¿Cómo agregar botones para compartir contenidos en Facebook, Twitter y Add This?

Se habla mucho actualmente que la Web se está volviendo cada vez más "social" con la influencia muy fuerte que vienen teniendo las redes sociales como twitter, facebook, linkedin, orkut, etc. Veamos cómo podemos compartir nuestras páginas y contenidos del sitio a través de dichas redes.

Si prestamos atención cada vez que estamos navegando por sitios para leer noticias, blogs, y todo tipo de contenido podemos ver que nos ofrecen la posibilidad de compartir lo que estamos leyendo con nuestros amigos en Facebook, nuestro seguidores en Twitter, en Google Buzz y una infinidad de redes sociales y herramientas de social bookmarking. 

Esto nos da la posibilidad de recomendar la lectura a gente que nos conoce y por ende aumenta la probabilidad que a alguien dentro de mi red de conexiones le interese leer lo mismo y así sucesivamente la cadena crece y es una manera muy efectiva de lograr que algo sea conocido en la Web actual.

Lo que queremos lograr es lo que se muestra en la siguiente imagen, es decir, tener esos botones que nos permitan compartir lo que se está viendo a través de las redes sociales.


Para hacer esto con GXportal podemos crear un HTML libre en el cual se colocan las porciones de código HTML que se detallan a continuación, todas juntas  para lograr lo que se ve en la imagen de arriba. Luego se utiliza el GXportlet de HTML libre que se puede colocar en la página que se utilizará para ampliar los contenidos o se puede utilizar en las plantillas del sitio de manera que estos botones siempre estén presentes en todas las páginas del sitio.

A continuación vamos a presentar por separado las porciones de código para saber a que botón corresponde cada una. En primer lugar el botón Twit this:

<a href="javascript:(function(){TwitThisPop=window.open(%22http://twitthis.com/twit?url=%22+encodeURIComponent(location.href)+%22&amp;title=%22+((document.title)%20?%20encodeURIComponent(document.title.replace(/^\s*|\s*$/g,%27%27))%20:%20%22%22),%20%22TwitThisPop%22,%20%22width=600,%20height=500,%20location,%20status,%20scrollbars,%20resizable,%20dependent=yes%22);%20setTimeout(%22TwitThisPop.focus()%22,%20100);%20})()"><img alt="TwitThis" src="https://www.gxportal.com/media/images/twittersml.gif?timestamp=20170913143413" style="border:none;" /></a>

Para el botón de compartir en Facebook:

<script>function fbs_click() {u=location.href;t=document.title;window.open("http://www.facebook.com/sharer.php?u="+encodeURIComponent(u)+"&t="+encodeURIComponent(t),"sharer","toolbar=0,status=0,width=626,height=436");return false;}</script><a href="http://www.facebook.com/share.php?u=&lt;url&gt;" onclick="return fbs_click()" target="_blank"><img alt="Compartir en Facebook" src="https://www.gxportal.com/media/images/facebook-share.png?timestamp=20170913143413" border="0"/></a>
Para el botón del servicio Add This:

<a class="addthis_button" href="http://www.addthis.com/bookmark.php?v=250&amp;username=xa-4c3f13884cff4e0a"><img alt="Bookmark and Share" height="16" src="http://s7.addthis.com/static/btn/v2/lg-share-en.gif" style="border:0" width="125" /></a><script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#username=xa-4c3f13884cff4e0a"></script>
Notar que para el caso de los dos primeros  se puede personalizar la imagen que se usa para mostrar el botón. De esta forma se podría llegar a usar los botones por separado en caso de que no interese dar todas las opciones juntas.

Wiki inicio
Categorías
Cambios recientes
TOUR
Tutoriales
Documentación
EMPRESA
Soporte
© Todos los derechos reservados. GeneXus y sus productos son marcas registradas por GeneXus S.A. | Política de privacidad | Información de contacto