Skip to content

Hyves ‘respect’-button voor op websites

Het onderstaande schreef ik een flinke tijd terug, maar is om een onbekende reden niet gepubliceerd.

In 2009 schreef ik over een socialbookmark-button voor Hyves, de HyvesTips. In navolging op andere sociale netwerken kwam Hyves in 2010 met een OpenGraph-knop: content delen op Hyves is Respecteren!

Via hyves.nl/respect/generator is op eenvoudige wijze een button aan te maken. Let wel dat je <head> de juiste OpenGraph-opmaak heeft inclusief og:title en og:description. De keuze bestaat uit:
Vertical Count – Horizontal Count – No Count –

Dynamische Hyves Respect-knop

Nu zit er één nadeel aan deze knop, danwel de generator. De knop moet namelijk voor elke pagina via de generator aangemaakt worden. Dit kan eenvoudiger, middels een javascript kun je de pagina-url aanroepen en in het juiste formaat aan de knop toevoegt. Deze kun je dus makkelijk in de layout implementeren en werkt bij al je pagina’s.

Vertical Count:
<script type="text/javascript" language="JavaScript">// <![CDATA[
var hyves_url = location.href; var hyves_iframe = '<iframe src="http://www.hyves.nl/respect/button?url='+hyves_url+'&counterStyle=vertical" style="border: medium none; overflow:hidden; width:70px; height:60px;" scrolling="no" frameborder="0" allowTransparency="true" ></iframe>'; document.write(hyves_iframe);
// ]]></script>

Horizontal Count:
<script type="text/javascript" language="JavaScript">// <![CDATA[
var hyves_url = location.href; var hyves_iframe = '<iframe src="http://www.hyves.nl/respect/button?url='+hyves_url+'&counterStyle=horizontal" style="border: medium none; overflow:hidden; width:120px; height:20px;" scrolling="no" frameborder="0" allowTransparency="true" ></iframe>'; document.write(hyves_iframe);
// ]]></script>

No Count:
<script type="text/javascript" language="JavaScript">// <![CDATA[
var hyves_url = location.href; var hyves_iframe = '<iframe src="http://www.hyves.nl/respect/button?url='+hyves_url+'&counterStyle=no-count" style="border: medium none; overflow:hidden; width:70px; height:20px;" scrolling="no" frameborder="0" allowTransparency="true" ></iframe>'; document.write(hyves_iframe);
// ]]></script>

Wel Respect, Geen standaard knop?

Nu kan het zijn dat je meerdere social media-buttons gebruikt en deze allemaal net even andere formaten hebben of dat je de Hyves Respect-knop simpelweg te groot vinden. Er is gelukkig een manier waarom je wel kan Respecten zonder deze knop. Via een simpele url (http://www.hyves-share.nl/button/respect/?hc_hint=1&url=)kun je blijven respecten.

Voorbeeld:
http://www.hyves-share.nl/button/respect/?hc_hint=1&url=http://mulderfrank.nl/2012/hyves-respect-button/

En deze kunnen we natuurlijk ook direct dynamisch maken, zodat je hem slechts 1x op je website hoeft te implementeren:
<script type="text/javascript" language="JavaScript">// <![CDATA[
var hyves_respect = location.href; var hyves_respect = '<a href="http://www.hyves-share.nl/button/respect/?hc_hint=1&url='+hyves_respect+'"><img src="http://mulderfrank.nl/wp-content/uploads/2012/05/hyves.gif" alt="" target="_blank" title="hyves" width="60" height="20" class="alignnone size-full wp-image-306" /></a>'; document.write(hyves_respect);
// ]]></script>

Resultaat:

Published inSocial Media
%d bloggers liken dit: