GXportal | | | | ¿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&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=<url>" 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&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.
|
| | | | | | | | |
| |
| ¿Cómo agregar botones para compartir contenidos en Facebook, Twitter y Add This?Mensaje enviadoFaltan datos requeridosContenido agregado con éxitole envía un Artículo.le envía este mensaje:http://www.gxportal.com/https://www.gxportal.com/es/sitebuilder/comunidad/wiki-old/como-agregar-botones-para-compartir-contenidos-en-facebook-twitter-y-add-this/auto/2/25 |
|