小工具：推薦

<devsite-recommendations> 自訂元素可用來為讀者提供內容推薦。您可以讓系統產生建議、自行提供明顯的建議，或包裝文件中現有的建議部分，讓簡報、點閱統計資料和豐富的使用者介面 (包括說明和圖片) 保持一致。

用量

如要使用這個小工具，請建立 <devsite-recommendations> 元素。如果您想明確提供推薦內容，請在 元素中新增一些連結。目前，當元素為空白時，系統會提供系統產生的建議，但日後作品可讓作者在系統提供煽情露骨內容的建議時，測試產生的建議，並將這些建議做為演算法的輸入內容。

如要提供明確推薦內容，請在 元素中新增一些標記。凡是在連結元素時偵測到的 <a> 標記，都會擷取其 href 屬性並用於推薦內容。

如果提供的最佳化建議超過三個，系統會隨機選擇。不過，建議的優先順序會保持與輸入順序相同，因此優先順序較高的建議一律顯示在最左側。

如果不想在產生的結果中顯示特定建議，可以提供一組 <link rel="disallow" href="/path"> 的空白 <devsite-recommendations> 元素。系統會自動偵測所有包含 rel=disallow 和 href 屬性的 <link> 標記，並從產生的建議中移除。

如果您只想獲得某一部分網頁的推薦內容，可以在 query 欄位中使用 Nomenclature 標記篩選結果。語法為 k:category:value。例如 k:language:typescript。這些標記清單可以使用逗號分隔的清單 (k:language:typescript,k:language:swift)，納入含有任一標記的網頁。

以下各節說明標記、標記在一般情況下的呈現方式，以及標記如何轉譯至電腦或簡易使用者代理程式。

標記

<devsite-recommendations>
<p>Note: link text is displayed when JavaScript is off</p>
<ul>
  <li><a href="/maps/documentation">Maps docs</a></li>
  <li><a href="/analytics">Analytics</a></li>
  <li><a href="/machine-learning/crash-course">MLCC</a></li>
</ul>
</devsite-recommendations>

結果

簡易使用者代理程式

注意：系統會在 JavaScript 關閉時顯示連結文字

禁止的示例

標記

<devsite-recommendations>
  <link rel="disallow" href="/maps/documentation">
  <link rel="disallow" href="/analytics">
  <link rel="disallow" href="/machine-learning/crash-course">
</devsite-recommendations>

結果

由於結果取決於建議內容，可能會變動，因此輸出內容會與建議模型的輸出內容相同。

納入現有內容

該元素可逐步強化您網頁上現有的標記，方便您升級現有連結並前後加上 <devsite-recommendations>。

新連結會採用建議平台的所有功能和政策 (例如資料收集和實驗資訊主頁)，但內容也會替換為豐富的中繼資料 (包括說明和圖片)，且可能排除部分連結 (例如設有存取權控製或沒有中繼資料的網頁)。

標記

<devsite-recommendations>
<h2>Example communities</h2>
<p>Note: All markup here will be replaced with the recommendation UI.</p>
<p>
  For more information on Google Developers, check out our <a href="/community/experts">GDEs</a>. If
  you are looking to form a community, take a look at <a href="/community/gdg">GDGs</a>. Lastly, if
  you're currently studying, don't miss our <a href="/community/dsc">DSCs</a>.
</p>
</devsite-recommendations>

結果

範例社群

注意：這裡的所有標記都會替換成建議 UI。

若要進一步瞭解 Google Developers，請參閱 GDE。如果 你想成立社群，歡迎參閱 GDG。最後， ，別錯過我們的 DSC。

Markdown 檔案中的用法

在 Markdown (.md) 檔案中，確認自訂元素是以標準 HTML 元素 (例如 <section> 或 <div>) 包裝：

偵測到多種安全性漏洞

## Markdown section

* Markdown list
* [Markdown link](/foo)

## HTML section

<div>
<devsite-recommendations>
  <p>Note: link text is displayed when JavaScript is off</p>
  <h2>Sample heading</h2>
  <a href="/recommended">Recommended</a>
</devsite-recommendations>
</div>

Markdown 區段

HTML 區段

注意：系統會在 JavaScript 關閉時顯示連結文字

標題範例

建議事項

純 Markdown

<pre><devsite-recommendations>
## Sample heading

* Note: link text is displayed when JavaScript is off
* [Maps documentation](/maps/documentation)

</devsite-recommendations><pre>

結果

標題範例

，瞭解如何調查及移除這項存取權。

系統屬性

目前唯一支援的屬性是用於控制系統行為，一般使用者不需使用。

yield (選填) 如有提供，該元素會引導至頁面上其他無實質關聯的推薦元素。網站通常會使用這個欄位來自動在網頁上刊登推薦內容，但只會在沒有其他內容的情況下顯示。

使用命名法篩選

標記

<devsite-recommendations query="k:language:typescript">
</devsite-recommendations>

結果