Die Webanalyse-Software Piwik bietet einem Besucher die Möglichkeit dem Tracking einfach per Klick zu widersprechen. Dazu kann ein OptOut-Formular per IFrame in die eigene Webseite eingebunden werden. Leider ist der Inhalt dieses IFrames jedoch nicht weiter formatiert und fällt, besonders in Zeiten von Webfonts, optisch negativ im Gesamtbild der Seite auf. Daher war ich auf der Suche nach einer Möglichkeit das OptOut-Formular per CSS zu formatieren. Da man mit Piwik mehrere Domains parallel analysieren kann, sollte dies für meinen Anwendungsfall für jede Webseite individuell möglich sein. Eine fest ins OptOut-Template eingefügte CSS-Definition schied deshalb von vornherein aus.
Durch kleine Änderungen am OptOut-Template in Piwik ist es nun Möglich dem IFrame die Url zu einem CSS-Stylesheet zu übergeben. Dies erreicht man durch Einfügen der folgenden Zeilen Code in der Datei plugins/CoreAdminHome/templates/optOut.tpl:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
{if isset($smarty.request.cssfile)} <link rel="stylesheet" type="text/css" href="{$smarty.request.cssfile|strip_tags|escape}" /> {/if}
</head>
<body>
{if !$trackVisits}{'CoreAdminHome_OptOutComplete'|translate}
<br/>
{'CoreAdminHome_OptOutCompleteBis'|translate}
{else}
{'CoreAdminHome_YouMayOptOut'|translate}
<br/>
{'CoreAdminHome_YouMayOptOutBis'|translate}
{/if}
<br/><br/>
<form method="post" action="?module=CoreAdminHome&action=optOut{if $language}&language={$language}{/if}">
<input type="hidden" name="nonce" value="{$nonce}" ></input>
<input type="hidden" name="fuzz" value="{$smarty.now}"></input>
{if isset($smarty.request.cssfile)} <input type="hidden" name="cssfile" value="{$smarty.request.cssfile|strip_tags|escape}"></input> {/if}
<input onclick="this.form.submit()" type="checkbox" id="trackVisits" name="trackVisits" {if $trackVisits}checked="checked"{/if}></input>
<label for="trackVisits"><strong>
{if $trackVisits}{'CoreAdminHome_YouAreOptedIn'|translate} {'CoreAdminHome_ClickHereToOptOut'|translate}
{else}{'CoreAdminHome_YouAreOptedOut'|translate} {'CoreAdminHome_ClickHereToOptIn'|translate}{/if}
</strong></label>
</form>
</body>
</html>Nun muss nur noch dem IFrame das CSS-Stylesheet per Get-Parameter übergeben werden. Die Url der CSS-Datei muß entsprechend codiert sein. Beispiel:
http://piwik.domain1.de/index.php?module=CoreAdminHome&action=optOut&language=de&cssfile=http%3a%2f%2fwww.domain2.de%2fcss%2fpiwik.css
Note: There is a rating embedded within this post, please visit this post to rate it.