Divi Code AI 簡介，您的個人 Divi 編碼助手

已發表: 2023-10-20

今天，我們很高興發布 Divi Code AI，它是 Divi AI 工具集的一個新分支，可以編寫程式碼、產生 CSS，並協助在 Visual Builder 中自訂您的 Divi 網站。這就像您身邊始終有一位專業的前端 Web 開發人員，他了解每個 Divi 模組的來龍去脈！

立即取得 Divi AI

使用人工智慧產生的程式碼自訂您的網站

您會注意到 Divi 程式碼欄位下方有一個新的 AI 圖示。點擊該圖標，告訴 Divi AI 您想要它做什麼，然後根據您正在自訂的元素和您正在編輯的欄位類型，它會做出適當的回應。

例如，如果我想在標題中添加漸變文本，而 Divi 沒有相應的設計選項，我可以要求 Divi AI 為我編寫 CSS。幾秒鐘之內，我的標題就應用了漂亮的漸層。

我甚至可以繼續與 Divi AI 對話並完善結果。在下面的影片範例中，我認為原始漸變太微妙，所以我要求 Divi AI 使其更加生動。現在看起來很完美！

建立完全自訂的元素

程式碼模組是 Divi Code AI 的亮點，因為它可以使用 HTML、CSS 和 JavaScript 執行您想要的任何操作。我可以要求 Divi AI 創建一個彈出窗口，在 30 秒後顯示並邀請用戶加入我的時事通訊。我什至可以描述彈出視窗的外觀。 Divi AI 在幾秒鐘內產生程式碼，我的網站上有一個漂亮的彈出窗口，它會吸引訪客的注意。

Divi AI 可以透過程式碼模組做各種各樣的事情。為我的英雄的標題添加打字效果或將 Divi 部分變成可關閉的浮動側邊欄怎麼樣？一旦你掌握了與 Divi AI 交談的竅門，它就會打開一個新的可能性領域。

為所有模組引入自由形式 CSS 選項

我們為所有 Divi 模組引入了自由格式的 CSS 選項，讓您可以使用「選擇器」偽類設定目前模組和任何子元素的樣式。例如，如果您想要在目前正在編輯的 Blurb 模組中新增框陰影，並設定 Blurb 中 IMG 和 H3 元素的樣式，則可以撰寫以下內容：

selector { <span class="webkit-css-property" aria-label="CSS property name: box-shadow">box-shadow</span><span class="styles-name-value-separator">: </span><span class="value" aria-label="CSS property value: 0 10px 20px 0 #000">0 10px 20px 0 #000</span><span class="styles-semicolon">; }</span>

selector img { border-radius: 100px; border: 5px solid #000; }

selector h3 { margin-top: 20px; }

這個新選項對於 Divi AI 來說非常好，因為它給了它滿足您的請求並立即自訂整個模組所需的自由。

使用 AI 生成的 CSS 自訂任何模組

在新的自由格式 CSS 領域中利用 Divi Code AI 真是太棒了！在下面的影片範例中，我要求 Divi AI 執行一系列自訂操作。我要求它將圖像的形狀更改為圓形，添加框陰影，在圖像頂部創建半透明漸變疊加，並在懸停時應用放大動畫。

由於 Divi AI 了解每個 Divi 模組的結構和類，而且它是 CSS 專家，因此它通常可以在第一次嘗試時完成這些具有挑戰性的任務，或者至少可以找到正確的解決方案。

Divi Code AI 在 Divi 程式碼庫上進行了微調

Divi Code AI 的特殊之處之一是它在 Divi 模組程式碼庫上進行了微調，使其比其他大型語言模型更具優勢。由於它知道 Divi 模組類別和 HTML 輸出，因此它可以更好地解釋模糊請求並識別提示中的 Divi 術語。

例如，在下面的影片中，我要求 Divi Code AI 編寫一些 CSS 來自訂 Blurb 和 Button 模組的外觀。它直觀地理解 Blurb 和 Button 是什麼，並準確地定位正確的類，在第一次嘗試時就滿足了我的定制請求。

方便的編碼快速操作

Divi Code AI 附帶方便的快速操作，您可以使用它們來優化程式碼。只需按一下即可自動最佳化、格式化並提高與舊瀏覽器的兼容性。

您也可以使用 Divi AI 使用提示來更改程式碼，從而開啟無限的可能性。

在雲端建立您的程式碼片段庫

Divi 的程式碼欄位與 Divi Cloud 搭配使用，這表示您可以將 AI 產生的程式碼片段儲存到雲端，以便在任何網站上使用。這是建立超級有用的程式碼片段庫的好方法。

在人工智慧的幫助下結對編程

Divi AI 並不完美，但即使出現問題，您也可以繼續對話並與 AI 配對程序，以磨練您想要的結果。您也可以要求 Divi AI「重試」。每次它再次嘗試時，都會產生略有不同的結果，通常在幾次嘗試後會偶然發現您想要的解決方案。

即使您對 Web 開發只有基本了解，您也可以利用 Divi AI 更快地自訂您的網站或實現以前在不聘請專家的情況下不可能實現的特定結果。

Divi AI 40% 折扣僅一週！

為了慶祝 Divi Code AI 的推出，我們將在下週提供 Divi AI 40% 的折扣。任何在促銷結束前購買 Divi AI 的人每年都將節省 115 美元，並終身鎖定這些節省！此外，您的所有團隊成員都可以免費使用 Divi AI。在這裡獲得折扣