> For the complete documentation index, see [llms.txt](https://help.firstline.cc/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.firstline.cc/feature/knowledge-base/helpdesk/kuo-chong-zi-ding-yi-html.md).

# 擴充自訂義 HTML

## 概述

位於「應用程式」中的「企業設定」，並點擊「幫助中心」頁籤，在「**夾帶自訂義 HTML**」欄位中填入您需要的 css 或 JavaScript 語法，可以額外擴充頁面的額外樣式或功能，如：

1. 進階調整特定按鈕配色
2. 安裝 FIRST LINE 即時聊天
3. 安裝 GTM 等額外應用

... 其他應用。

## 使用範例

### 調整網站圖示

於欄位輸入 HTML 圖示語法，範例：

```html
// 替換 href 中網址連結
<link rel="shortcut icon" type="image/x-icon" href="/assets/images/favicon.ico">
```

### 使用 Meta 像素

透過 Meta [事件管理工具](https://facebook.com/events_manager2)網站置入像素程式碼，範例：

```javascript
// 請使用 Meta 提供對應及最新置入程式碼
<!-- Meta Pixel Code -->
<script>
!function(f,b,e,v,n,t,s)
{if(f.fbq)return;n=f.fbq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};
if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];
s.parentNode.insertBefore(t,s)}(window, document,'script',
'https://connect.facebook.net/en_US/fbevents.js');
fbq('init', 'xxxxxxxxxxxxxxx');
fbq('track', 'PageView');
</script>
<noscript>
<img height="1" width="1" style="display:none"
src="https://www.facebook.com/tr?id=xxxxxxxxxxxxxxx&ev=PageView&noscript=1"
/></noscript>
<!-- End Meta Pixel Code -->
```

<figure><img src="/files/tp9Gv3HL9LIT6Z3x2uTA" alt=""><figcaption></figcaption></figure>

### 調整特定配色

針對網頁上的元件，透過開發者工具找到對應修改元件的 class 或 id 並調整，範例：

```html
// 提醒，我們並不建議此使用方式，在後續版本更新，元件名稱可能會與原先的並不相同，您可能需要重新調整。

<style>
.top-item-link { background: red }
</style>
```

<figure><img src="/files/zvX1qTf1XpF64DZrMsO0" alt=""><figcaption></figcaption></figure>
