本篇文章，將告訴你該如何利用程式碼片段外掛，自由設定 WordPress 小工具與小工具之間的寬度，解決有些佈景主題小工具與小工具之間的寬度，會太寬或太窄的問題。
Code Snippets 外掛介紹
本篇教學，將使用「Code Snippets」程式碼片段外掛來設定小工具與小工具之間的寬度，且方便了程式碼與程式碼之間的管理，未來要修改程式碼也比較方便。
相關文章 : 【WordPress外掛】好用的程式碼片段外掛，N個實用程式碼片段範例教學
使用教學
安裝外掛
外掛安裝教學 : https://xiaoxiang.blog/how-to-install-the-plug-in/
step 1
開啟 WordPress 後臺管理介面，前往 外掛 > 安裝外掛。
step 2
使用關鍵字搜尋外掛，輸入「Code Snippets」。
step 3
找到名稱為「Code Snippets」的外掛，點選 立即安裝，並 啟用 該外掛。
更改小工具與小工具之間寬度
step 1
外掛啟用後，點擊 程式碼片段 > 新增程式碼片段。
step 2
- 在標題框中輸入「自訂小工具與小工具之間的間格寬度」，方便程式碼與程式碼之間的管理。
- 如下圖所示，複製貼上以下程式碼到程式碼輸入框中。
修改「margin: 0 0 2em 0;」這段程式碼中第 3 個代碼「2em」，可以改成 1em 或 2.5em 等等，即可自由修改小工具與小工具之間的間格寬度。
程式碼 :
add_action( 'wp_head', function () { ?>
<style>
.widget {
margin: 0 0 2em 0;
/* 修改從左邊數來第3個數字，即可自訂寬度，這裡設定為2em */
}
</style>
<?php } );
畫面 :
step 3
完成後記得滑到底部，點擊「儲存設定並啟用」按鈕，儲存並啟用你的程式碼。
效果預覽
如下圖所示，左邊為佈景主題預設的小工具與小工具區塊之間的寬度，右邊的為啟用程式碼後的寬度 (右邊寬度為2em)。
如果對文章內容有任何問題，或有想讓小翔另外補充的的內容，歡迎在底下留言讓我知道。
在這裡，我想讓您知道在 小翔教你SEO 網站中，有些連結為聯盟營銷連接，這代表，當人們點擊該連結，並前往其他網站進行購買動作時，我將會從銷售中獲得少部分佣金（但不會影響你購買的價格）。
有關更詳細的聯盟連接說明，請前往 聯盟計畫聲明（FTC） 頁面觀看。
by 小翔