重要事項:此文件不適用於您目前選取的格式 電子郵件!
amp-addthis
說明
顯示 AddThis 可自訂的社群分享按鈕。
必要指令碼
<script async custom-element="amp-addthis" src="https://cdn.ampproject.org/v0/amp-addthis-0.1.js"></script>
用法
amp-addthis
元件提供在 AMP 頁面中整合 AddThis 分享按鈕 的功能。網站訪客可使用 AddThis 分享按鈕將內容分享到 200 多個社群管道,包括 Messenger、WhatsApp、Facebook、Twitter、Pinterest 等。
分享按鈕
浮動式
浮動式分享按鈕會放置在頁面的側面、頂端或底部,並在讀者捲動頁面時跟隨移動。這是推廣分享的好方法,而且不會過於唐突。
範例
<!-- This example uses a placeholder pubId. Please replace the pubId value with your own after creating an account on https://www.addthis.com/dashboard. --> <amp-addthis width="320" height="92" layout="responsive" data-pub-id="ra-5c191331410932ff" data-widget-id="957l" data-widget-type="floating" > </amp-addthis>
嵌入式
將分享按鈕整合到您的內容中,以獲得無縫的分享體驗。
範例
<!-- This example uses a placeholder pubId. Please replace the pubId value with your own after creating an account on https://www.addthis.com/dashboard. --> <amp-addthis width="320" height="92" data-pub-id="ra-5c191331410932ff" data-widget-id="mv93" data-widget-type="inline" > </amp-addthis>
實作文件
- 如果您還沒有帳戶,則需要建立 AddThis 帳戶。建立 AddThis 帳戶完全免費,讓您可以存取 AddThis 的完整網站工具套件,以及深入的分析報告,以更瞭解您網站的社群流量。
- 前往您的 儀表板 並自訂您的分享按鈕 (AMP 目前僅支援浮動式和嵌入式分享按鈕)。
- 依照您的喜好自訂分享按鈕,然後按下「啟用工具」。這會將您重新導向至我們的「取得程式碼」頁面。
- 最後但同樣重要的是,將內嵌程式碼複製並貼到您頁面的 body 區段中,您希望分享按鈕顯示在該處。對於浮動式分享按鈕,您可以將此程式碼放置在 body 中的任何位置,因為它會自動顯示在螢幕的左側或右側,具體取決於您在工具設定中的設定位置。
這樣就完成了!您應該會在頁面上看到分享按鈕顯示!
請觀看我們的 YouTube 影片 以取得逐步說明
隱私權
AddThis 工具和 AddThis 工具列會從終端使用者用來與發佈商網站互動的裝置,或工具列使用者用來與 AddThis 工具列互動的裝置收集資訊 ("AddThis 資料")。請閱讀完整的 AddThis 隱私權政策。
AddThis 資料可能包含以下內容
- 網際網路協定 (IP) 位址、行動廣告 ID (MAID) (可讓行動應用程式開發人員識別誰在使用其行動應用程式)、行動應用程式 ID、瀏覽器類型、瀏覽器語言、作業系統類型,以及終端使用者造訪發佈商網站或工具列的日期和時間
- 使用者使用工具列;
- 在發佈商網站上的行為,例如終端使用者造訪發佈商網站的時間長度、終端使用者在發佈商網站上分享內容的行為,以及終端使用者在發佈商網站上的捲動行為;
- 參照 URL 和終端使用者用來尋找和瀏覽至發佈商網站的網路搜尋;
- 輸入到 AddThis 工具列搜尋功能中的關鍵字,以及工具列使用者是否以及何時下載、安裝或解除安裝 AddThis 工具列;
- 關於終端使用者使用 AddThis 工具的頻率,以及工具列使用者使用 AddThis 工具列的頻率的資訊;以及
- 從終端使用者和工具列使用者的 IP 位址衍生的地理位置資料。
在適用法律要求的範圍內,AddThis 資料將被視為個人資訊。發佈商必須根據 AddThis 服務條款取得所有必要的終端使用者同意和授權,並為提供從終端使用者收集的 AddThis 資料給 Oracle 提供任何必要的通知。
支援
如果您在 AMP 上實作 AddThis 時有任何疑問或需要任何協助,請提交服務單 由此處 聯絡我們優秀的支援團隊,或寄送電子郵件至 help@addthis.com。
屬性
data-pub-id
在登入後於 AddThis 儀表板 的 URL 中找到的 AddThis 發佈商 ID。例如,在 URL https://www.addthis.com/dashboard#gallery/pub/ra-5c191331410932ff
中,ra-5c191331410932ff
是發佈商 ID。
data-widget-id
要顯示的工具的 AddThis 小工具 ID,也可以在 AddThis 儀表板 上找到。特定工具的小工具 ID 可以透過在 AddThis 儀表板中開啟該工具並複製 URL 的最後一部分來找到。例如,在 URL https://www.addthis.com/dashboard#tool-config/pub/ra-5c191331410932ff/widgetId/957l
中,957l
是小工具 ID。
data-widget-type
描述小工具類型的屬性。
- 浮動式:
data-widget-type="floating"
- 嵌入式:
data-widget-type="inline"
data-title
選用。如果設定,這是 AddThis 工具在分享時將嘗試分享的標題。如果未設定,將使用包含 amp-addthis
標籤的文件標題。
data-url
選用。如果設定,這是 AddThis 工具在分享時將嘗試分享的 URL。如果未設定,將使用包含 amp-addthis
標籤的文件的 location.href
屬性。
data-media
選用。如果設定,這是媒體 (例如,圖片或影片) 的 URL,AddThis 工具在分享時將嘗試分享該媒體。如果未設定,則保持未定義。
data-description
選用。如果設定,這是頁面的描述,AddThis 工具在分享時將嘗試分享該描述。如果未設定,則保持未定義。
驗證
請參閱 AMP 驗證器規格中的 amp-addthis
規則。
您已閱讀此文件十幾次,但它仍然沒有真正涵蓋您的所有問題嗎?也許其他人也有相同的感受:在 Stack Overflow 上與他們聯繫。
前往 Stack Overflow 發現錯誤或缺少功能?AMP 專案強烈鼓勵您的參與和貢獻!我們希望您能成為我們開放原始碼社群的持續參與者,但我們也歡迎針對您特別熱衷的問題提供一次性的貢獻。
前往 GitHub