Paano magdagdag ng popup sa inyong website gamit ang Google Tag Manager nang walang developer
Step-by-step na gabay para sa popup gamit ang Google Tag Manager: i-install ang isang line, isulat ang modal sa editor ng Clew, at piliin kailan lalabas — pagkatapos ng ilang segundo, kapag nag-scroll, o sa pagbabalik — nang hindi hinahawakan muli ang theme.
- Oras
- ● 10 minuto
- Presyo
- 14-araw na free trial, walang card
- Sino ang gagawa
- Sinumang maaaring mag-publish sa GTM
Halimbawa: popup gamit ang Google Tag Manager
Ang marketing site ng SaaS ay nasa custom stack, at GTM lamang ang maaaring i-edit ng marketing. Ang mga bisitang nanatili 20 segundo sa /pricing ay nakakakita ng modal na “Hindi sigurado sa plan? Mag-book ng 15-minutong call” may link sa demo page.
Ang format na ito ay bahagi ng Pro plan. Bawat bagong account ay nagsisimula sa 14-araw na free trial na may lahat na format at audience rules, walang card. Kapag nagtapos ang trial, walang nabubura at patuloy na ipinapakita ang mga naka-publish; nananatiling libre ang mga tour at tooltip sa Free plan.
Paano magdagdag ng popup gamit ang Google Tag Manager, step by step
- Step 01
Kopyahin ang inyong Clew snippet
Gumawa ng libreng account (o mag-sign in), idagdag ang inyong site at buksan ang Buod sa admin. I-click ang line sa card na Walang signal mula sa widget pa. para kopyahin: nasa loob na ang tunay na site key sa halip ng placeholder.
<!-- Clew: palitan ang ILAGAY_ANG_SITE_KEY ng site key mula sa Admin > Buod --> <script src="https://tryclew.io/widget/ILAGAY_ANG_SITE_KEY.js" async></script>
Step 1 · eskematikong ilustrasyon - Step 02
Gumawa ng Custom HTML tag sa GTM
Sa tagmanager.google.com buksan ang inyong container, Tags → New → Tag Configuration → Custom HTML, at i-paste ang line ng Clew. Pangalanan ang tag na
Clew widget.
Step 2 · eskematikong ilustrasyon - Step 03
I-fire sa All Pages
Sa Triggering piliin ang All Pages at i-save. I-load sa lahat na page: ang page kung saan lalabas ang popup ay itinatakda sa Clew, hindi sa GTM.
Step 3 · eskematikong ilustrasyon - Step 04
Preview, pagkatapos Submit at Publish
Tiyakin sa Preview na ang
Clew widgetay nasa Tags Fired, pagkatapos Submit → Publish. Walang nagbabago sa live na site bago i-publish.
Step 4 · eskematikong ilustrasyon - Step 05
Isulat ang popup sa Clew
Sa Clew buksan ang Mga flow → + Bagong flow at itakda ang Format sa Modal window. Magdagdag ng isang step: maikling title, isa o dalawang pangungusap, at sa Text ng link / URL ng link ang text ng button at ang page na binubuksan nito. Hindi kailangan ng selector ang modal: laging nasa gitna.
Step 5 · eskematikong ilustrasyon - Step 06
Piliin kung saan, kailan at para kanino ipapakita
Sa parehong editor, sagutan ang Saan ipakita (URL ng page), Kailan ipakita, Pag-target ng audience at Frequency. Ito ang mga setting ng halimbawa sa itaas:
Setting Value Format Modal window Saan ipakita (URL ng page) Seksyon ayon sa prefix /pricingKailan ipakita Pagkatapos ng N segundo: 20 segundo Pag-target ng audience Walang rule: lahat na nagbukas sa page Frequency Minsan bawat bisita 
Step 6 · eskematikong ilustrasyon - Step 07
I-publish at tingnan sa live na site
Itakda ang Status sa Naka-publish at i-save. Buksan ang page sa private window: tinatandaan ng Clew kung sino ang nakakita na ng item na “minsan”, kaya maaaring hindi ito ipakita sa inyong karaniwang browser. Ang mga view, completion at drop-off ay nasa stats.
Step 7 · eskematikong ilustrasyon
Mga dapat iwasan: popup gamit ang Google Tag Manager
Huwag gumamit ng History Change trigger
Sinusundan ng widget ang single-page navigation nang kusa. Ang ikalawang trigger sa History Change ay naglo-load muli ng script nang walang saysay.
Maaaring antalain ng Consent Mode
Kung gumagamit ang container ng Consent Mode at naghihintay ang tag ng consent, lalabas ang popup kapag pumayag ang bisita. Magpasya ayon sa inyong privacy policy.
Tingnan sa mobile bago i-publish
Sa tag manager, madaling i-publish sa lahat na page nang sabay. Buksan ang target na page sa makitid na window: may limit ang lapad ng modal, pero ang mahabang text ay ibinababa ang button. Manatili sa dalawang pangungusap.
Mga tanong at sagot
Maaari bang i-track ang click ng popup sa GA4?
Binibilang ng Clew ang view, completion at pagsara sa sariling stats. Ang button ay dinadala sa inyong page, kaya itinatala ng GA4 ang pagbisita roon gaya karaniwan.
Pinapabagal ba ng GTM ang popup?
Naglo-load ang widget sandali pagkatapos ng container. Ang item na Kaagad kapag nag-load ang page sa pinakaunang page view lamang ay maaaring lumabas nang kaunting huli kaysa direktang install.
Maaari bang ipakita ang popup sa isang page lamang?
Maaari. I-install ang line sa buong site at piliin ang Exact na path o Seksyon ayon sa prefix sa Saan ipakita (URL ng page). Hindi lalabas ang popup sa ibang page.
Libre ba ang popup?
Ang modal format ay bahagi ng Pro; ang mga bagong account ay may 14-araw na trial na may lahat, walang card. Libre ang tour at tooltip sa Free plan.
Saan dinadala ang button?
Sa anumang page na inilagay sa URL ng link. Nagbubukas ito sa bagong tab para hindi mawala sa bisita ang page na kanyang binabasa.
Iba pang maaaring idagdag gamit ang Google Tag Manager
- Paano gumawa ng product tour gamit ang Google Tag Manager nang walang developer
- Paano magdagdag ng onboarding checklist gamit ang Google Tag Manager nang walang developer
- Paano i-set up ang user onboarding gamit ang Google Tag Manager nang walang developer
- Paano magdagdag ng tooltip sa inyong website gamit ang Google Tag Manager nang walang developer
- Paano gumawa ng interactive product guide gamit ang Google Tag Manager nang walang developer
- Paano magdagdag ng paywall upgrade prompt gamit ang Google Tag Manager nang walang developer
Popup sa iba pang platform
- ShopifyPaano magdagdag ng popup sa Shopify store nang walang developer
- WordPressPaano magdagdag ng popup sa WordPress site nang walang developer
- WebflowPaano magdagdag ng popup sa Webflow site nang walang developer
- WixPaano magdagdag ng popup sa Wix website nang walang developer
- FramerPaano magdagdag ng popup sa Framer site nang walang developer