開工日當然就是要來個新的WordPress免費版型與大家分享。這回的版型叫做「Benjamin」，中文就是「班傑明」。不同於以往，這回我們帶來了自適應(響應式)網頁設計，讓你的版型可以在多種不同尺寸的螢幕上都可以有良好的呈現，讓你免去安裝手機板外掛就可以讓WordPress部落格網站擁有手機板的瀏覽畫面。
以往由阿腸工作室提供的版型都是單純的固定寬度，這回我們來點不一樣的，讓你網站的版型可以在不同的解析度上都可以正常的瀏覽。至於整體的配色感覺，跟之前的迪奇版型差不多，版面上倒是跟克努特類似，當然我們還是有做一些小微調，盡量讓網站精簡與乾淨。此外，版型這回改採左邊欄、左選單設計，上方不再有一整長排選單，取而代之是左側的手風琴選單。
本來在製作阿腸工作室阿腸工作室官方網站的時候，想說第一個動手開刀的響應式網頁設計應該是官網，沒想到卻變成了這一次推出的免費版型：Benjamin 班傑明，命名的由來是來自於一隻袋狼，至於詳細的故事就請自己查看一下這篇囉！原先製作響應式網頁設計時(Response Web Design，簡稱RWD)，要使用Susy，不過之前用過幾次後發現不是用得很順手，最後走回傳統的手工CSS。
製作響應式網頁設計時，就直接使用Media Query + Respond.js 來讓IE和非IE之間皆可以正確地進行自適應的動作。不過要製作RWD，網頁的版面就得簡單，否則做出來可能直接哭噴了。在版面上盡可能地簡單化，讓在尺寸縮放的時候，可以有良好的表現，花比較多得時間是在研究要判斷的解析度與左側手風琴選單的部分。
整體的感覺本來是要走扁平式設計的感覺，不過在 METRO UI 和 Flat UI 的顏色規範上似乎都沒有我們想要的咖啡色，所以最後就隨意了XD。直接使用咖啡色，版型會有一種寧靜的感覺，進入看網站會有一種舒適、很像回到自己家裡的體驗，希望大家會喜歡這個版型囉！
- 版型名稱：Benjamin
- 免費下載：按這裡
- 展示網址：http://benjamin.achang.tw/
- 使用規範：按這裡 (限個人部落格、如遇用於商業網站請來信洽談。)
1.0.2
- 修正：修正 archive.php 語法錯誤問題
1.0.1
- 修正：修正留言區頭像max-width問題
Benjamin 這款針對 WordPress 設計的版型具有自適應功能，可以在不同解析度下都能有較好的呈現方式，首先就讓我們看一下網頁的感覺，如同以往，一樣有內建輪播功能！左上角可以顯示文字或是換成自訂Logo。
不過這次的網頁多層選單倒是移動到左側來了，選單僅能兩層，如果當有第二層選單項目的時候，第一層選單的項目點選後僅有展開功能，無法連結到該頁面，這點需要特別注意一下！
網站頁尾的部分一樣，左側搭一個LOGO，右側是版權宣告的部分，同時內建頁碼功能。(左下角Logo必須要修改FTP檔案才能變更)
單篇文章呈現與克努特相同，不過這次就沒有直接抓文章第1張圖片了，而是您要使用more標籤來對內文切斷，如果沒有切斷則會全文輸出哦！
接下來，讓我們看一下介面的呈現，這解析度約略在801~1000，超過1000之後就顯示原先比例，側邊欄部分都不會動到大小，僅有內文區會變更。
這是內文的部分，這回上方多了麵包屑功能，免裝外掛佈景內建直接用。
如果解析度來低於800，則會呈現這樣單欄樣式，側邊欄會全部幫你移動到下方，畢竟網頁一進來最重要的就是內容區域。
接下來是較小的解析度(智慧型手機)，大概就是這樣，單欄的呈現縮小版，而達到320px以下就不再自動縮小而固定，如果你螢幕不足320px，則會出現捲軸。
選單部分，在小螢幕下就是這樣一整排呈現，會被推到最下方去。
分類彙整頁面，會在左上角多出該頁面的標題，然後下方才是文章清單哦！
好啦！簡單版型的介紹就到此處，希望大家多多使用。這次僅針對IE8以上瀏覽器做些微的校正，IE7就直接放棄了。至於手機瀏覽器標準都很新，必較不用擔心，惟需擔心的是，使用RWD版型的使用者常常會碰到的問題就是，為什麼我地圖被撐開了？Youtube影片跑版了而已，這部分沒有特別去校正，因為考量到整體效能與優化，沒有修正這部分，如果有建議的做法，歡迎提出^^
![[教學]如何用 Chrome 批次把 HEIC轉成 JPG 圖片 ？](https://i1.wp.com/sofree.cc/wp-content/uploads/2024/04/20240402230128_0.png?quality=90&zoom=2&ssl=1&resize=350%2C233 "[教學]如何用 Chrome 批次把 HEIC轉成 JPG 圖片 ？")
![[教學]如何申請台北捷運誤點證明？](https://i0.wp.com/sofree.cc/wp-content/uploads/2024/04/20240403164113_0.jpg?quality=90&zoom=2&ssl=1&resize=350%2C233 "[教學]如何申請台北捷運誤點證明？")
![[教學]如何用 ShowKeyPlus 查詢 Windows 10/11 產品金鑰序號？](https://i1.wp.com/sofree.cc/wp-content/uploads/2023/11/20231103232630_0.jpg?quality=90&zoom=2&ssl=1&resize=350%2C233 "[教學]如何用 ShowKeyPlus 查詢 Windows 10/11 產品金鑰序號？")
您好，我是初學者正在測試使用您的這個主題（謝謝您的免費模版），想請問：如何修改文章內容的字體大小？我嘗試在style.css內容中修改但都不成功，麻煩…
CSS屬性有缺就是自己補，沒有缺就是會讀預設值，所以你可以透過firebug查看元素並自行添加屬性。
喔…謝謝！
那應該是JS和站上的東西衝突，以至於輪播無法呈現，你可以先將外掛全數停用看看
我設定了2個輪播圖片上去，結果輪播欄位是空白的?!
http://wp-freeroomtaiwan.rhclo…
【阿腸佈景設定】→【首頁輪播】有開啟的狀態
您額外啟用的外掛之JS去疊加到順序，造成JS無法正常執行。
我設定了2個輪播圖片上去，結果輪播欄位是空白的?!
http://wp-freeroomtaiwan.rhcloud.com
【阿腸佈景設定】→【首頁輪播】有開啟的狀態
請問如何安裝呢?
版型安裝嗎？ 還是WordPress整體安裝？
找到了，在theme安裝裏，謝謝
OK
模板不清楚，因為現在都自己開發，很少去找FREE的。
版主你好：請問
http://dynamic-marketing-academy.com/zen-v2-op1/
像這樣的樣式如果要用WP製作，這樣的模板目前網路上有免費的嗎??
(1個影片+1個擷取名單頁這樣)
因為這件事情困擾我很久很久，業界幾乎都是Blog模板居多
可是又不想用leadpages 97美金/月花錢!!(太貴)
感謝你!!
請問一下最近很多wrdpress 版面都用的這個回覆樣式是甚麼來？
你說現在使用的嗎？ 這套是Disqus。
介紹： http://sofree.cc/disqus/
您好，我設定了四個輪播圖片上去，結果輪播欄位是空白的?!
http://twbaseballzone.com/
【阿腸佈景設定】→【首頁輪播】有開啟的狀態
Jetpack 的 Photon CDN 會衝突。
剛才嘗試把 Photon 關閉後
輪播欄位還是白白的。
看是否可以把外掛先全停掉，再次確認一下。
其實我看你原始碼前半段有一大堆的code，或許可能造成衝突也不一定。
啊腸佈景設定沒權限不能修啊……
請問能用什麼方法修改？
目前問題還是一樣嗎？
您好，請問如果網站輪播的圖片突然無法顯示是什麼原因造成的呢？我本來可以正常顯示，後來就變成空白了，我只新增了三個圖片在輪播，謝謝您抽空回答
抱歉，
有網址可以看一下嗎~~
問題有可能是【阿腸佈景設定】→【首頁輪播】，沒有打勾為啟用。
版主你好，謝謝你們的佈景囉～
腸哥真的是努力不懈、持之以恆，成功之人^^
謝謝啦! 歡迎使用哦 :D
又是藍藍路取的(怪)名子?
攤手~`
哇！
香腸哥哥好厲害！
貓哥比較威(推)
手機版有選單好方便啊~
手機板我自己都還沒做選單。就把第一次給免費版了XD
揪感心 xD