【教學設定】痞客邦側欄置入FB粉專丶IG丶YT，嵌入程式碼步驟全集 @ 千步走台灣愛。點滴！

真的浪費時間...網路找半天設定總沒成功

其實設定真的不難，只是需要時間研究，找到自己想要版面適合的最佳格式

想在痞客邦側欄放入FB粉專丶IG好友丶YT影片

按步驟來設定，一次就搞定！

YT 封面照 (1)

如何把FB粉專置入痞客邦側欄中?

１。首先請在網路搜尋：FB粉絲專頁外掛程式（如下圖）

https://developers.facebook.com/docs/plugins/page-plugin

【教學設定】痞客邦側欄置入FB粉專丶IG丶YT，嵌入程式碼步

２。Facebook粉絲專頁網址版面設定

2-1　就輸入您自己的［粉絲專頁網址］

2-2　設定頁籤、寛度、高度及其他選項

2-3　下方方框可以做［樣式的預覽］

2-3　找到想要的格式，欄位都設置好後，就點擊［取得程式碼］

【教學設定】痞客邦側欄置入FB粉專丶IG丶YT，嵌入程式碼步

３。回到痞客邦側欄做設定

3-1　選擇［IFrame程式碼］做複製

3-2　進入側欄管理右邊點選［+新增欄位］

3-3 ［輸入標題］代表顯示於我的痞客邦(前台)會呈現出的內容

3-4　將程式碼貼入［內容欄位］中

3-5　到我的痞客邦(前台)確認有順利放上，若有顯示即［設定完成！］

【教學設定】痞客邦側欄置入FB粉專丶IG丶YT，嵌入程式碼步

［設定完成如下］

【教學設定】痞客邦側欄置入FB粉專丶IG丶YT，嵌入程式碼步

如何把IG置入痞客邦側欄中?

１。到［IG個人首頁］，找到想要放的照片

２。按下［右上角的三點］

３。取得［內嵌程式碼］直接點［複製］

【教學設定】痞客邦側欄置入FB粉專丶IG丶YT，嵌入程式碼步

４。到痞客邦的［側欄管理］

4-1　右邊點選［+新增欄位］

4-2 ［輸入標題］代表顯示於我的痞客邦(前台)會呈現出的內容

4-3　將程式碼貼入［內容欄位］中

你可以選擇直接貼上後［按下傳送］，會出現超出版面的格式

不能說不好看，只能說不夠美
【教學設定】痞客邦側欄置入FB粉專丶IG丶YT，嵌入程式碼步

【教學設定】痞客邦側欄置入FB粉專丶IG丶YT，嵌入程式碼步

５。如果你想更完美，下方步驟可助您修改尺寸

對於完美主義的我...總覺得格式應該可以縮放長寛在格子內

5-1　回到我的痞客邦(前台)，對超出的照片按下滑鼠右鍵，看到［檢查］按下去

5-2　畫面的右方或下方會出現程式碼，找到［照片區塊按複製］

【教學設定】痞客邦側欄置入FB粉專丶IG丶YT，嵌入程式碼步

直接找到這段做複製，並將下方藍字區改成自己要的尺寸

450*250是目前我版面的最佳尺寸，您可以反覆修改＋測試
<iframe class="instagram-media instagram-media-rendered" id="instagram-embed-0" src="https://www.instagram.com/p/CiecnbqLKAD/embed/captioned/?cr=1&v=12&wp=100&rd=https%3A%2F%2Falice00897.pixnet.net&rp=%2Fblog%3Futm_source%3DPIXNET%26utm_medium%3Dnavbar%26utm_term%3Dmy_blog#%7B%22ci%22%3A0%2C%22os%22%3A2684.199999999255%2C%22ls%22%3A1729.300000000745%2C%22le%22%3A1934.5999999996275%7D" allowtransparency="true" allowfullscreen="true" frameborder="0" height="450" data-instgrm-payload-id="instagram-media-payload-0" scrolling="no" style="background: white; max-width: 0px; width: calc(0% - 0px); border-radius: 0px; border: 0px solid rgb(219, 219, 219); box-shadow: none; display: block; margin: 0px 0px 10px; min-width: 250px; padding: 0px;"></iframe>