I have enjoyed installing and using Piwik on my site these last several months. However I have come up against a problem with the cookie opt-out facility. I am endeavouring to improve the overall functional accessibility of my site and am using two of the standard validators to assist with this. The problem arises on my Cookies Policy page because the Piwik opt-out is included as an iframe.
I have been able to comply with the requirments of WCAG / Section508 (Cynthia Says) by some gentle tweaking of the iframe code (mainly adding required “content”)
I have been unable to satisfy the requirements of FAE1.1 - the University of Illinois Functional Accessibility Evaluator. This is because it treats the data embedded by the iframe as a separate document - and that document is not properly formatted according to its requirements. As the content and the function of the iframe appears really very small (a short text statement and a single checkbox) could this not be converted to a form or other devise which will incorporate directly into the page?
and this is the FAE1.1 test page:
University of Illinois FAE1.1
Many thanks for your help.
Thank you for pointing in this direction.
For the integration of using a CSS file for the iframe I had already modified the following file:
In this template it is possible to modifiy/integrate the missing parts.
However, according to “never hack core” this is only recommended if you can oversee the consequences.
The modification will be overwritten during an update.
Thank you for this hint.
I have modified the optOut.tpl file by deleting the initial 7 lines up to and including and the last 2 lines ()
I left the insertion code in my GREY pages cookie.php as it was as an iframe.
This seems to work - certainly the text alters when you check and uncheck the checkbox. The page also validates correctly against the FAE1.1 evaluator. The problem which the unchanged tpl file causes is the introduction of a second header to the page.
It just remains to be seen whether my own actions (when I have opted out as administrator) remain unrecorded in analytics.
I realise I will need to make sure I carry out this deletion whenever there is a Piwik update.
With the iframe you usually insert another complete html page into your page. So you could open the content of the iframe independently using the source of the iframe.
As you implemented it now, this doesn’t work properly using the following URL:
The header parts are missing. However a browser shows the content.
When building a complete html document using the original template with some modifications you could still open the URL properly.
It is shown here how to implement the iframe with its own CSS:
(Google translator )
My insert code inside the page is then adding the path for the CSS to the attribute:
<object width="100%" height="180px" style="border: 0" type="text/html" data="http://CounterSample.com/folder_name/index.php?module=CoreAdminHome&action=optOut&language=de&css=http%3a%2f%2fwww.sample.com%2ffirst_folder%2fsecond_folder%2fcss_folder%2fpiwik_iframe.css"></object>
It’s important to use an URL encoder for the CSS-path as described in the document above.
Nice solution as I can adjust the design of the iframe to the style of each website.
This is the result using my modfied template:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="robots" content="noindex, nofollow" />
Opt-out complete; your visits to this website will not be recorded by the Web Analytics tool.
Note that if you clear your cookies, delete the opt-out cookie, or if you change computers or Web browsers, you will need to perform the opt-out procedure again.
<form method="post" action="?module=CoreAdminHome&action=optOut&language=en">
<input type="hidden" name="nonce" value="0f3b3c8523fa806652046b275f3f9125" ></input>
<input type="hidden" name="fuzz" value="1350725628"></input>
<input onclick="this.form.submit()" type="checkbox" id="trackVisits" name="trackVisits" ></input>
You are currently opted out. Click here to opt in. </strong></label>
, language to and
were added to comply with FAE requirements.
is then hidden using CSS.
I hope this will help if you want to adjust it.
What I really want to do is to build the form part of the optout into my existing page without the use of an iframe at all. My existing page already has the necessary declarations, language and
- so the optout must not duplicate them. I can see that it would be possible to add a link entitled “If you want to opt out, click here” and that would open a new page.
In a similar manner, I had a lot of trouble validating pages that had an embedded active Google map in them (these were iframes) - again because FAE reports that the page had two headers and two title attributes. Eventually I cured this by replacing the map on the page with an image and referred to the active map as a link.
This is one remaining example of a map built using an external facility built as a standard html page which is then “included” on the page itself. This page will not validate:
THE CRANE FAMILY: MAPS: The Craxford Family Genealogy Magazine