Näin estämme WordPressin evästeet ennen suostumusta

Suurin osa verkon evästeongelmista asuu WordPressissä. Sinne on myös asennettu eniten suostumusbannereita, ja yllättävän moni niistä ei tee kovin paljon.

Olemme julkaisseet katla-app/wordpress-lisäosan, joka yhdistää WordPress- tai WooCommerce-sivuston Katlaan. Se lataa suostumusskriptin, estää skriptit ja upotukset, joille ei ole suostumusta, palvelimella ja renderöi evästekäytännön ja tietosuojaselosteen, jotka Katla luo todellisista, skannatuista evästeistäsi.

Selaimessa estämisen ongelma

Katlan evästevahti estää evästeiden kirjoittamisen. Se on oikea perusrakenne, ja käsin rakennetulla sivustolla se yleensä riittää, koska päätät itse, mitkä skriptit sivulla ovat.

WordPress on eri asia. Teema lisää jonoon skriptin. Kolme lisäosaa tuo neljä muuta. Sivunrakentaja lisää pikselin. Siinä vaiheessa, kun kävijä lataa sivun, sillä on seurantaa, jota kukaan ei tietoisesti lisännyt, ja latautunut seurantaskripti on jo lähettänyt kolmannelle osapuolelle pyynnön, jossa on IP-osoite ja viittaaja, onnistui se asettamaan evästeen tai ei.

Sen estäminen selaimessa on kilpajuoksu, jota ei voita luotettavasti. Suostumusskriptin on ajettava, paikattava oikeat globaalit ja neutraloitava tagi ennen kuin tagi ajetaan. Joskus se onnistuu. Sitten optimointilisäosa järjestää skriptisi uudelleen, eikä se onnistu.

Estä se siis ennen kuin sivu lähetetään

Lisäosa hoitaa estämisen palvelimella, kun WordPress vielä kokoaa HTML:ää. Liitä skriptin handle luokkaan Blocking-välilehdellä tai koodissa:

add_action( 'wp_enqueue_scripts', function () {
	katla_block_script( 'google-analytics', 'analytics' );
	katla_block_script( 'facebook-pixel', 'marketing' );
}, 20 );

Selaimeen päätyvä skripti on toimeton:

<script type="text/plain" data-katla-src="…" data-katla-category="analytics"></script>

Kilpajuoksua ei ole, koska suoritettavaa versiota ei ollut vastauksessa koskaan olemassakaan.

Yksityiskohta, josta välitämme eniten, on se, mitä tapahtuu inline-skripteille. Analytiikkatagit ovat harvoin yksi tiedosto: on lataaja ja sitten inline-gtag('config', …) tai dataLayer-push, joka on liitetty samaan handleen wp_add_inline_script-funktiolla. Estäjät, jotka käsittelevät vain src-attribuutin, pudottavat nämä yleensä pois, ja tagi palaa suostumuksen jälkeen väärin määritettynä tai ei ollenkaan. Tämä lisäosa neutraloi inline-skriptit handlensa rinnalla ja ajaa ne uudelleen lähdejärjestyksessä, kun luokka sallitaan, joten tagi palautuu täsmälleen sellaisena kuin WordPress sen kokosi.

WooCommerce, jossa rikkominen tulee kalliiksi

Verkkokaupan suostumuslisäosalla on toinen tehtävä, joka on yhtä tärkeä kuin vaatimustenmukaisuus: älä riko kauppaa. Estä väärä handle, niin ostoskori lakkaa päivittymästä tai kassa pettää hiljaa, ja kuulet siitä asiakkaalta.

Siksi WooCommerce-integraatio on enimmäkseen lista asioista, joita lisäosa kieltäytyy tekemästä. Ostoskori-, istunto- ja kassaevästeet ohittavat evästevahdin kokonaan: woocommerce_cart_hash, wp_woocommerce_session_*, wc_fragments_* ja muut vastaavat. Kaupalle kriittiset handlet, kuten wc-cart-fragments, wc-checkout ja wc-blocks-checkout, poistetaan estolistalta, joten huolimaton sääntö ei voi kaataa kassaa. Lisäosa ilmoittaa olevansa yhteensopiva HPOS:n sekä ostoskori- ja kassalohkojen kanssa.

Yksi tarkoituksellinen poikkeus: tilausten attribuutioevästeitä (sbjs_*) ei ole lisätty sallittujen listalle. Ne ovat markkinointievästeitä, käteviä kyllä, mutta markkinointia. Jos haluat ne pois ennen suostumusta, kytke wc-order-attribution-handle suostumukseen.

Kolme hallinnan tasoa

Oletus ei vaadi koodia: Katla renderöi bannerin ja asetusikkunan, jotka tyylitellään hallintapaneelistasi.

Jos haluat hallita merkintää itse, headless-tila lataa evästevahdin ja window.KatlaConsent-olion ilman isännöityä käyttöliittymää, ja lisäosa renderöi oman bannerinsa: se käännetään WordPressin kautta ja tyylitellään CSS-muuttujilla, joten se perii teemasi tyylit:

add_filter( 'katla_banner_css_vars', function () {
	return array(
		'katla-primary' => '#111111',
		'katla-radius'  => '0px',
		'katla-font'    => 'var(--wp--preset--font-family--body)',
	);
} );

Tai kytke käyttöliittymä kokonaan pois ja rakenna oma window.KatlaConsent-olion ja katla:consent-tapahtuman varaan. Kaikissa kolmessa tapauksessa alla on sama evästevahti.

Käytännöt, jotka ovat oikeasti sivulla

[katla_policy] renderöi luodun evästekäytäntösi ja tietosuojaselosteesi palvelimella osana sivun HTML:ää. Ei iframea eikä selainpuolen hakua, vaan oikeaa merkintää: indeksoitavaa, teemasi tyylittelemää ja evästeidesi muuttuessa uudelleen luotua. Jokaiselle shortcodelle on Gutenberg-lohko, ja lisäksi on [katla_cookie_table], jos haluat vain taulukot, sekä [katla_cookie_settings] evästeasetusten linkkiä varten, jota käytäntösivusi tarvitsee joka tapauksessa.

Näin pääset alkuun

Tarvitset vahvistetun Katla-sivuston, jolla on vähintään yksi valmis skannaus, koska lisäosa tarvitsee evästetietoja käytäntöjen renderöintiin. Sitten:

wp plugin activate katla-consent
wp katla site-id 00000000-0000-0000-0000-000000000000
wp katla verify

Tai liitä Site ID kohtaan Settings → Katla Consent.

WordPress-opas käy läpi shortcodet, suodattimet, WP-CLI-komennot ja WooCommercen erityispiirteet, ja WordPress- ja WooCommerce-sivulta löydät asennusvaiheet ja kysymykset, joita WordPress-tiimit esittävät ennen vaihtoa. Lisäosa on GitHubissa osoitteessa katla-app/wordpress, ja issuet ja pull requestit ovat tervetulleita.