KOMPOOS.NL

google +1 button XHTML - application/xhtml+xml

home ยป manuals » xhtml » google-plus-one.xhtml

sitemap


google +1 strict HTML-extensie | google +1 strict XHTML-extensie


Uitleg xhtml validatie voor google +1 button

Voor de uitleg van het script e.d. voor de +1 button verwijs ik naar de strict +1 procedure met text/html. De code van deze pagina verschilt van de "text/html" versie. De (header)code van deze pagina is:


<?php
        header("Vary: Accept");
        header("Content-Type: application/xhtml+xml;
        charset=utf-8");
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="nl">
<head>
        <meta http-equiv="Content-Type" content="application/xhtml+xml;charset=utf-8" />
...
...
...
rest van de pagina

Klik even op de validatie-button hieronder om de pagina na te kijken, en controleer of de taal (bij een mouse-over) in het nederlands is. Ben je tevreden over alles, plaats dan de (x)html-code in de body-sectie van jouw pagina en plaats ook het javascript (onderaan: zo laag mogelijk) in de body van de pagina.

W3C XHTML 1.1

Houd er rekening mee dat de plus-one procedure niet op een pagina werkt zonder "byte-order marks" (BOM). Vandaar dat de validator een waarschuwing hierover geeft. Voor alle duidelijkheid: stel jouw editor in op UTF-8 (MET BOM). Mensen die een standaard programma voor hun html-code gebruiken kunnen deze mededeling gewoon negeren (UTF-8 is normaliter de standaard).

valide (x)html-code voor de plus one button


<div id="plusone-div" class="g-plusone"></div>

validerend javascript voor de +1 button


<script type="text/javascript">
/*global google_plus_xhtml:true */
function google_plus_one_xhtml() {
    var g_plus_one = document.getElementById("plusone-div");
    google_plus_xhtml = document.createElement('script');
    google_plus_xhtml.setAttribute("type", "text/javascript");
    google_plus_xhtml.setAttribute("src", "https://apis.google.com/js/plusone.js");
    google_plus_xhtml.text = '{lang:"nl"}';
    g_plus_one.setAttribute("data-size", "standard");
    g_plus_one.setAttribute("data-count", "false");
    document.getElementsByTagName("head").item(0).appendChild(google_plus_xhtml);
}
setTimeout(function() {
    google_plus_one_xhtml();
}, 800);
</script>