Gabay sa CMP Integration: Shopify, WordPress, Wix at Custom Sites
Ito ang pinaka-madalas na tanong na naririnig namin mula sa mga bagong gumagamit: «Paano ko ia-install ang FlexyConsent sa aking site?» Ang sagot ay pareho anuman ang platform — i-paste ang isang linya ng JavaScript bago ang panghuling head tag. Ngunit ang eksaktong mga hakbang ay bahagyang naiiba para sa Shopify, WordPress, Wix, Squarespace, at mga custom na site. Sinasaklaw ng gabay na ito ang lahat ng ito.
Ang Universal na Paraan
Gumagana ang FlexyConsent sa iisang script tag. Walang plugin, walang SDK, walang server-side na configuration. Sinusuportahan ng bawat platform na nagpapahintulot ng custom na HTML sa head section ang FlexyConsent. Ang script ay wala pang 50KB at naglo-load nang asynchronously, na nangangahulugang zero na epekto sa bilis ng iyong pahina.
Ang script:<script src="https://flexyconsent.com/d/c/c/4/your-site-id.js"></script>
Makukuha mo ang iyong natatanging script mula sa FlexyConsent panel pagkatapos likhain ang iyong account.
Shopify
- Hakbang 1: Pumunta sa Online Store > Themes > Edit Code
- Hakbang 2: Buksan ang theme.liquid
- Hakbang 3: I-paste ang FlexyConsent script bago mismo ang </head>
- Hakbang 4: I-save — ang iyong consent banner ay live na sa lahat ng pahina
Hindi na kailangan ng Shopify app. Gumagana sa lahat ng tema kasama ang Dawn, Debut, at mga custom na tema.
WordPress
- Opsyon A (walang plugin): Appearance > Theme Editor > header.php > i-paste bago ang </head>
- Opsyon B (may plugin): Mag-install ng anumang «Insert Headers» plugin > i-paste ang script sa Head section
- Opsyon C (functions.php): Magdagdag ng wp_head action hook na nag-o-output ng script tag
Compatible sa lahat ng pangunahing tema (Astra, GeneratePress, Divi, Elementor) at mga page builder. Walang conflict sa mga caching plugin — ang script ay naglo-load nang nakapag-iisa.
Wix
- Hakbang 1: Pumunta sa Settings > Custom Code
- Hakbang 2: I-click ang «Add Custom Code»
- Hakbang 3: I-paste ang FlexyConsent script
- Hakbang 4: Itakda ang placement sa «Head» at ilapat sa «All pages»
Gumagana sa lahat ng Wix plan na sumusuporta sa custom code (Business plan at pataas).
Squarespace
- Hakbang 1: Pumunta sa Settings > Advanced > Code Injection
- Hakbang 2: I-paste ang script sa Header section
- Hakbang 3: I-save — ang consent banner ay lilitaw sa lahat ng pahina
Custom HTML / Static Sites
- Hakbang 1: Buksan ang iyong HTML template o layout file
- Hakbang 2: I-paste ang script bago ang </head>
- Hakbang 3: Mag-deploy — literal na iyon na ang lahat
Gumagana sa anumang static site generator (Next.js, Gatsby, Hugo, Jekyll, Astro), anumang framework (React, Vue, Angular), at anumang hosting provider.
Google Tag Manager
- Hakbang 1: Lumikha ng bagong Custom HTML tag
- Hakbang 2: I-paste ang FlexyConsent script
- Hakbang 3: Itakda ang trigger sa «All Pages — Page View»
- Hakbang 4: Itakda ang priority na mag-fire bago ang ibang mga tag
Kapag gumagamit ng GTM, awtomatikong nag-iintegrate ang FlexyConsent sa Google Consent Mode V2 — hindi na kailangan ng karagdagang configuration.
Pagkatapos ng Installation: Ano ang Dapat Beripikahin
- Lumalabas ang banner — bisitahin ang iyong site sa incognito window
- Nagfa-fire ang Consent Mode — suriin ang Google Tag Assistant para sa consent state
- Nalilikha ang TC String — i-verify sa browser console gamit ang __tcfapi
- Gumagana pa rin ang analytics — kumpirmahin na dumadaloy ang data pagkatapos tanggapin ang consent
- Gumagana sa mobile — subukan sa mga tunay na mobile device
Mga Karaniwang Isyu at Solusyon
- Hindi lumalabas ang banner? Suriin na ang script ay nasa <head>, hindi sa <body>. I-clear ang cache ng iyong browser.
- Lumalabas ang banner sa bawat pagbisita? Tiyaking hindi nino-block ang mga cookie ng iyong browser o isang privacy extension.
- Hindi nagta-track ang Google Ads? Tiyaking naglo-load ang FlexyConsent script bago ang iyong mga Google tag.