使用 AMP 打造 Google Ads 到達網頁
透過集合功能整理內容
你可以依據偏好儲存及分類內容。
到達網頁載入速度愈快,轉換次數通常就會愈多。AMP 是製作載入速度更快、吸引人的 Google Ads 到達網頁的絕佳方式。amp.dev 提供網頁開發人員所需的資源,協助他們製作出吸引人且成效出色的網頁。本逐步指南說明如何在 AMP 網頁中使用 Google Ads 和其他廣告技術。
步驟 1:建立及驗證 AMP 網頁
建立 AMP 網頁
如要瞭解如何建立基本的 AMP 網頁,請先參閱 AMP 專案的「建立第一個 AMP 網頁」教學課程。如需更多實作和逐步指南,請完成「將 HTML 轉換為 AMP」和「新增進階 AMP 功能」教學課程。如要查看 AMP 元件的範例程式碼和範本,請參閱「AMP 網站範例」和「AMP 範本」。
以下清單說明 AMP 頁面中使用的部分元件。如需參考,請參閱元件的完整清單。
驗證 AMP 網頁
開發期間,請務必確認 AMP 網頁有效。AMP 提供多種不同的方法來驗證文件。驗證 AMP 網頁最常見的方式是使用網路驗證工具或 Google 網站管理員工具驗證工具。您也可以使用 Chrome 瀏覽器外掛程式和開發人員控制台,或是在建構中整合 amphtml-validator npm 模組。
您也可以使用 AMPBench,這是一款開放原始碼網頁應用程式和服務,可驗證 AMP 網頁部署作業,並對相關問題進行偵錯。
如需 AMP 測試支援服務,請前往 AMP 專案的「Getting Support」頁面。
步驟 2:設定 AMP 以便追蹤轉換和分析
Google Ads 轉換追蹤
使用 amp-analytics 元件追蹤 Google Ads 轉換。請按照「為 AMP 到達網頁設定 Google Ads 轉換評估」一文中的步驟操作,瞭解如何設定這項功能。
Google Analytics
Google Analytics 是 amp-analytics 支援的數據分析解決方案之一。如要讓工作階段在 AMP 和非 AMP 網頁中統合,請按照「為 AMP 設定 Google Analytics 工作階段統合」中的步驟操作。
Google 代碼管理工具
amp-analytics 元件內建 Google 代碼管理工具 支援功能。除了 Google Ads 轉換,您也可以使用 Google 代碼管理工具新增再行銷、DoubleClick Floodlight、Google 通用 Analytics 和類似的評估產品。請參閱相容的標記完整清單。
Adobe Analytics 提供兩種方法,可透過 amp-analytics 元件導入網站成效追蹤解決方案:iframe (adobeanalytics_nativeConfig
) 和非 iframe (adobeanalytics
) 導入方式。請參閱各個方法的優缺點和實作詳細資訊。
您可以使用 amp-analytics 元件追蹤使用者動作和事件。AMP Analytics 提供超過 40 個分析供應商的原生支援功能。這個架構相當靈活,可讓您使用自訂設定評估及觸發網址,將分析資訊傳送至您自己的伺服器,或傳送至不支援原生 AMP 的供應商。如果您使用的技術目前不受支援,請要求供應商新增支援。
AMP 數據分析也支援彈性的變數替換功能,詳情請參閱「變數替換」說明文件。
步驟 3:在 Google Ads 使用者介面中啟用 AMP 放送功能
雖然 Google 搜尋中的 AMP 網頁會透過網頁連結自動偵測,但廣告客戶必須在 Google Ads 中明確輸入 AMP 網頁網址。如要進一步瞭解如何在 Google Ads UI 中設定 AMP 網址,請參閱「如何在 Google Ads 中使用 AMP」。
目前,快取放送功能僅適用於 Google 搜尋結果網頁上的文字廣告,且僅適用於大多數主要瀏覽器,包括 Android Chrome、Android Google 搜尋應用程式和行動版 Safari。我們將在接下來幾個月提供更多相關資訊。
如要測試 AMP 網頁在 Google 搜尋檢視器中透過 Google AMP 快取傳送時的顯示方式,請在 Search AMP 測試工具中輸入 AMP 文章,然後按一下「預覽連結」。
此外,如果您想將 Google Ads 流量導向 AMP 到達網頁,但不想讓這些流量顯示在自然搜尋結果中,請為相關 AMP 網頁新增 Disallow 指令至 robots.txt
,就像為任何一般網頁一樣。
更新到達網頁上的 AMP 內容
當使用者從 Google AMP 快取要求 AMP 文件時,快取會自動要求更新,以便在快取內容後為下一位使用者提供最新內容。使用這個模型後,AMP 文件的更新會自動快速地傳播,更新後,只有少數使用者會注意到未更新的版本。此外,如有需要,您可以使用 update-cache API 更新或移除 AMP 快取中的內容。
AMP 專案每天都會新增功能和元件。如果發現缺少功能,您可以貢獻,或提出新增功能的要求,方法是開啟 GitHub 問題。
無效的 AMP 網頁處理
當網頁變為無效時,AMP 快取會在幾次要求的時間範圍內發現這項情況,並開始重新導向至提供 AMP 網頁的來源。恢復使用 AMP 快取放送服務可能需要 1 到 2 天。
除非另有註明,否則本頁面中的內容是採用創用 CC 姓名標示 4.0 授權,程式碼範例則為阿帕契 2.0 授權。詳情請參閱《Google Developers 網站政策》。Java 是 Oracle 和/或其關聯企業的註冊商標。
上次更新時間:2025-08-21 (世界標準時間)。
[null,null,["上次更新時間:2025-08-21 (世界標準時間)。"],[[["\u003cp\u003eFaster landing pages typically lead to more conversions and AMP is a great way to create attractive, fast-loading Google Ads landing pages.\u003c/p\u003e\n"],["\u003cp\u003eThis guide provides step-by-step instructions on how to create, validate, and implement AMP pages for advertising purposes, including conversion tracking and analytics.\u003c/p\u003e\n"],["\u003cp\u003eSeveral AMP components are highlighted, such as amp-bind, amp-form, amp-list, and amp-carousel, offering interactive and dynamic features for landing pages.\u003c/p\u003e\n"],["\u003cp\u003eAMP analytics supports various platforms including Google Ads, Google Analytics, and Google Tag Manager, allowing for comprehensive tracking and measurement of user interactions.\u003c/p\u003e\n"],["\u003cp\u003eGoogle Ads requires explicit input of the AMP page URL for ad serving, and the AMP project encourages contributions and feedback for ongoing improvement.\u003c/p\u003e\n"]]],[],null,["# Using AMP for your Google Ads landing pages\n\n[Faster landing pages](//support.google.com/google-ads/answer/7496737) typically\nlead to more conversions and AMP is a great way to create attractive Google Ads\nlanding pages that load more quickly. [amp.dev](//amp.dev/) provides web\ndevelopers with resources they need to create attractive, high performing pages.\nThis step-by-step guide describes how to use Google Ads and other advertising\ntechnology in your AMP pages.\n\nStep 1: Create and validate AMP pages\n-------------------------------------\n\n### Create AMP pages\n\nTo learn how to create a basic AMP page, start with the AMP Project's [Create\nyour first AMP page](//amp.dev/documentation/guides-and-tutorials/start/create/)\ntutorial. For more hands-on, step-by-step guidance, complete the [Convert HTML\nto AMP](//amp.dev/documentation/guides-and-tutorials/start/converting/) and [Add\nadvanced AMP\nfeatures](//amp.dev/documentation/guides-and-tutorials/start/add_advanced/)\ntutorials. You can find sample code and templates of AMP components at [AMP\nWebsites Examples](//amp.dev/documentation/examples/) and [AMP\nTemplates](//amp.dev/documentation/templates/).\n\nThe list below describes some components used on AMP pages---refer to the\n[complete list](//amp.dev/documentation/components/) of components for\nreference.\n\n- [amp-bind](//amp.dev/documentation/components/amp-bind): Add custom stateful interactivity based on JavaScript-like events.\n- [amp-form](//amp.dev/documentation/components/amp-form): Create landing pages that require input from the user.\n- [amp-list](//amp.dev/documentation/components/amp-list): Fetch content dynamically from a CORS JSON endpoint.\n- [amp-carousel](//amp.dev/documentation/components/amp-carousel): Image carousel for scrolling an image gallery.\n- [amp-lightbox](//amp.dev/documentation/components/amp-lightbox): Display full-screen view of a component when it's been interacted with.\n- [amp-call-tracking](//amp.dev/documentation/components/amp-call-tracking) Dynamically replaces a phone number in a hyperlink for call tracking.\n- [amp-mustache](//amp.dev/documentation/components/amp-mustache): Allows rendering with [Mustache.js](//mustache.github.io/).\n- [amp-date-picker](//amp.dev/documentation/components/amp-date-picker): Provides a widget to select dates. The date picker can render as an overlay relative to input fields, or as a static calendar widget.\n\n### Validate AMP pages\n\nDuring development you'll want to make sure your AMP pages are valid. AMP offers\n[several different\nmethods](//amp.dev/documentation/guides-and-tutorials/learn/validation-workflow/validate_amp)\nto validate your documents. The most common way to validate an AMP page is by\nusing the [web validator](//validator.ampproject.org/) or the [Google Webmaster\nTools Validator](//search.google.com/test/amp). You can also use the [Chrome\nbrowser\nplugin](//chrome.google.com/webstore/detail/amp-validator/nmoffdblmcmgeicmolmhobpoocbbmknc)\nand developer console, or integrate the [amphtml-validator npm\nmodule](//www.npmjs.com/package/amphtml-validator) in your build.\n\nYou can also use [AMPBench](https://github.com/ampproject/ampbench), which is an open\nsource web application and service to validate as well as debug issues around\ndeployment of AMP pages.\n\nFor support with AMP testing, visit the AMP Project's [Getting\nSupport](//www.ampproject.org/support/developer/get_support) page.\n\nStep 2: Set up AMP for conversion tracking and analytics\n--------------------------------------------------------\n\n### Google Ads conversion tracking\n\nUse the\n[amp-analytics](//amp.dev/documentation/guides-and-tutorials/optimize-and-measure/configure-analytics/)\ncomponent to track Google Ads conversions. Follow the steps in [Set up Google Ads\nconversion measurement for AMP landing\npages](/google-ads/amp/conversion-measurement) to learn how to set this up.\n\n### Google Analytics\n\n[Google Analytics](/analytics/devguides/collection/amp-analytics) is one of the\nsupported analytics solutions by\n[amp-analytics](//amp.dev/documentation/components/amp-analytics). To enable\nsessions to be unified across AMP and non-AMP pages, follow the steps in [Set up\nGoogle Analytics session unification for\nAMP](//support.google.com/analytics/answer/7486764).\n\n### Google Tag Manager\n\nThe [amp-analytics](/analytics/devguides/collection/amp-analytics)\ncomponent has built-in support for [Google Tag\nManager](//support.google.com/tagmanager/answer/6103696). In addition to Google\nAds conversions, you can use Google Tag Manager to add remarketing,\nDoubleClick Floodlight, Google Universal Analytics, and similar measurement\nproducts. Refer to the [full list of compatible\ntags](//support.google.com/tagmanager/answer/6106924).\n\n### Adobe Analytics (formerly known as Omniture)\n\nAdobe Analytics offers two methods for implementing their website performance\ntracking solution with\n[amp-analytics](//amp.dev/documentation/guides-and-tutorials/optimize-and-measure/configure-analytics/)\ncomponent: iframe (`adobeanalytics_nativeConfig`) and non-iframe\n(`adobeanalytics`) implementation. Read about the pros/cons and implementation\ndetails of each\n[approach](//marketing.adobe.com/resources/help/en_US/sc/implement/accelerated-mobile-pages.html).\n\n### Integrating other common Google Ads-related technologies\n\nYou can use the\n[amp-analytics](//amp.dev/documentation/guides-and-tutorials/optimize-and-measure/configure-analytics/)\ncomponent to track user actions and events. AMP analytics comes with native\nsupport from over 40 analytics vendors. The framework is flexible and allows you\nto measure and trigger URLs using [custom\nconfigurations](//amp.dev/documentation/components/amp-analytics#specifying-configuration-data)\nto send analytics information to your own servers or to vendors where native AMP\nsupport isn't available. If you're using a technology that isn't currently\nsupported, [ask your vendor to add\nsupport](//amp.dev/documentation/guides-and-tutorials/contribute/integrate-your-analytics-tools).\n\nAMP analytics also allows for flexible variable substitution; for details, refer\nto the [variable\nsubstitution](//amp.dev/documentation/guides-and-tutorials/optimize-and-measure/configure-analytics/analytics_basics)\ndocumentation.\n\nStep 3: Enable AMP serving in the Google Ads UI\n-----------------------------------------------\n\nWhile AMP pages in Google Search are\n[auto-discovered](//support.google.com/webmasters/answer/6340290) via the [link\nfrom your\npages](//amp.dev/documentation/guides-and-tutorials/optimize-and-measure/discovery),\nadvertisers must\nexplicitly input the AMP page URL in Google Ads. Read [How to Use AMP with Google\nAds](//support.google.com/google-ads/answer/7495018) for details on\nsetting up AMP URLs in Google Ads UI.\n\n[Cache\nserving](//amp.dev/documentation/guides-and-tutorials/learn/amp-caches-and-cors/how_amp_pages_are_cached)\nis currently available for text ads on Google search results pages served on\nmost major browsers including Android Chrome, Android Google Search App, and\nMobile Safari. We are rolling out more coverage throughout the coming months.\n\nIf you'd like to test how an AMP page appears when delivered from the Google AMP\ncache inside the Google Search Viewer, input your AMP article in the [Search AMP\ntest tool](//search.google.com/test/amp) and click **Preview link**.\n\nAlso, if you'd like to drive Google Ads traffic to your AMP landing page but\ndon't want them to appear in organic search results, add Disallow directives for\nthe relevant AMP pages to your `robots.txt` as you would for any regular web\npage.\n\n### Updating AMP content on landing pages\n\nWhen a user requests an AMP document from the Google AMP Cache, the cache\nautomatically requests updates in order to be able to serve fresh content for\nthe next user once the content has been cached. With this model, updates to AMP\ndocuments propagate automatically and quickly; few users will notice the\nnon-updated version after your update. Additionally, if needed, the\n[update-cache API](/amp/cache/update-cache) can be used to update or remove\ncontent from the AMP cache.\n\nThe AMP project is adding new functionality and components every day. If you\nfind functionality that's missing, you can\n[contribute](https://github.com/ampproject/amphtml/blob/master/README.md) or request\nit to be added by opening a [GitHub\nissue](//amp.dev/documentation/guides-and-tutorials/contribute/).\n\n### Invalid AMP page handling\n\nWhen a page turns invalid, the AMP Cache would discover that within the span of\na few requests and start redirecting to the AMP page served origin. It can take\n1 to 2 days to revert to AMP cache serving."]]