v 新版Blogger範本設計工具正式啟用 >> 0 與 1 謎詭世界
★★★請勿任意轉載本站的文章及圖片但歡迎網摘及連結並註明網站名稱與網址,勿全文轉載,彼此尊重,
是網路的基本禮儀。


>
2013 曬書節 - 萬種商品49元起!

2010年6月11日 星期五

新版Blogger範本設計工具正式啟用


2010年3月份Blogger測試版推出了更人性化的版面設計工具,而今天2010年6月終於正式啟用了---Blogger新版範本設計工具(Blogger Template Designer),我覺得對於新加入或是對於更新範本的苦手而言,真的是項好消息,更多彈性運用與背景、顏色的設計都可以自行掌握,版面更新只在一瞬間,應該是非常有趣的後台設計。

今天登入blogger後台的朋友,應該會發現跳出一個新視窗,新功能的服務,


進入後台,也發現原有的版面配置變成了"設計",而原有的版面配置裡的"字型和顏色"也消失了,還有"挑選新範本"的頁面也移除了。



這次正式版推出,跟以往測試版的內容也有些許的不同,
1、所有的後台的說明文字都以中文顯示
2、範本版型部分多一項,"輕柔雅緻",從4種變成5種,而其他類別也有增加template,所以從原先15種配置變成22種,選擇更多。
3、背景圖片選擇更多。
4、進階部份,各單項元素的細部設定更多,例如pager、資訊提供這些細部設定的顏色與文字大小定義等等。

以下是Google針對這次改變所製作的影片,


最後的slogan是"展現你的風格",我想這就是blogger想幫部落客使用者達到的目標。

如果要使用新的範本設計工具的朋友,記得舊有的模板要備份,因為如果覺得不適用,在修改HTML下方有讓你選擇舊模板的選項,



最下方的經典範本(Classic),應該是用不到的,大家應該都是使用2006年以後的版本。

我覺得這次的改版完全運用到WYSIWYG的作法,所見即所得的版面修改,讓你可以即時在畫面下方看到你修改的內容變化,這是很值得稱讚的,別家的部落格似乎都是要存檔後才能再呈現你修改的內容。

不過由於Google Blogger是美國公司,所以關於模版方面,都是以專業性及普遍性為主,美式風格為主,而比較偏向我們喜歡的可愛型或是獨特風格型的畫面設計較少,好像沒有看到什麼甜美風或是日本可愛風之類的,我是覺得比較可惜。

另外關於瀏覽器的適用部分,官網是有說明他們修改了許多bug,可以Cross-browser support,但還是要等網友們試用了,自己才了解,我自己試用先前的測試版,在IE底下是會拖慢網頁載入速度,但是新的正式版好像是快了些,但是這是以試用的部落格測試的,可能也不會很準,而且自己才改回舊版不久,短時間內不想再修改了,或許有朋友修改過可以分享心得看看,是否新版的範本設計真的有修正bug。


參考來源:
Blogger Template Designer Now Available To Everyone
延伸閱讀:
驚為天人的Blogger templates官方模版終於測試推出
試用 Blogger 新版範本設計工具改版心得

34 則留言 :

  1. 這功能實在不錯,尤其實對像我這種跟字體配色很不來電的人XD

    回覆刪除
  2. 雖然沒有可愛風的模板……
    不過可以加入官方的Group來設計就是……
    相關說明

    回覆刪除
  3. 雖然這次有改版,但怎麼沒有增進留言回履或版主回履這個功能,真的是非常的不方便阿.....

    回覆刪除
  4. 很棒的功能,感謝分享 ^^

    請教一下,我選了其中一個範本之後,想變更背景,但是換背景之後,新的背景卻無法像範本背景一樣在向下捲動時保持不動,請問該如何修改咧? 謝謝你~~~

    回覆刪除
  5. 找到/* Variable definitions這區第二項,Variable name="body.background"這個定義,然後將後面那段 no-repeat scroll top center改成
    repeat-x fixed top center 你試看看,他應該是每個背景會有不同的變化吧。

    回覆刪除
  6. 感謝太郎大大即時回覆,馬上來試試看 ^^

    謝謝~~

    回覆刪除
  7. 剛剛改了,還是不行,
    真不知道要怎麼修...

    回覆刪除
  8. 你可能是加錯地方,他有兩段敘述,前面是default="#111111 ...最原先狀態,value="#000000 這段後面才是你換背景的設定,fix語法就是加在這邊,還是你有改其他地方,我在後台測試這樣修改是沒問題的。

    回覆刪除
  9. 喔喔喔~~ 真的改錯地方。
    高手就是高手,連我弄錯都可以推理出來!

    已經改好了,再次感謝綸太郎!!

    回覆刪除
  10. 看完綸太郎這篇,讓我興起重新裝潢自己部落格的衝動了^^

    回覆刪除
  11. 我期待背景可以挑選自己相簿的圖片Q_Q
    現在都只能挑官方的......
    Google首頁的換背景功能就可以挑選picasa的相片說...

    回覆刪除
  12. 如果會改html,後台還是可以換成你自己的,在Variable name="body.background"這段敘述裡改即可,當然官方可以釋出這功能是最好的。

    回覆刪除
  13. 想請問...我的blog套用了內建背景, 在blog title那塊右側出現類似重疊的狀況~ 我自己是覺得應該是寬度問題...只是不知該改哪?! 不知綸太郎知道要怎麼處理嗎?! (其實我還想再把中間的區塊拉寬~)

    回覆刪除
  14. 那個不是blog title的背景,應該是content-inner主要區塊的背景,他一直延伸到下方..,因為他原先設定是背景白色,所以看起來不會有寬度問題,你現在將背景調成透明,所以只有一個方式就是將
    .content-inner {
    background: $(content.background);
    background-position: left -$(content.imageBorder.top.space);
    background-color: $(content.background.color);
    padding: $(content.padding);
    }
    裡面的背景圖敘述拿掉,例如
    改成background: ;
    你試看看

    回覆刪除
  15. OK了! 感謝綸太郎耶~
    另外想請教...像現在blog寬度設定目前最大就是到1000px..
    手動把數字加大好像也無效!
    請問有其他方法讓中間那區塊變寬一點嗎?

    回覆刪除
  16. 你參考這一篇【整體寬度】看看 http://01mistery.blogspot.com/2010/03/blogger-new-mode.html 如果無效再來討論

    回覆刪除
  17. 你好, 路過想請問一下..

    較早前我曾把blogger升級到新的版面, 但發現其中一些舊文章的標題不見了,(連開新文章及編輯舊文,也找不到原來打標題的那空格),之後我再回復到舊版面,都沒有辦法解決...請問是什麼問題?

    希望綸太郎先生能幫一幫我...

    回覆刪除
  18. To Lojai,你試著勾選"將迷你組件範本回復為預設值"看看,有沒有辦法救回。

    回覆刪除
  19. 剛試過了, 也是無法解決問題, 始終不能顯示文章標題的空格位置.

    請問還有其他辦法嗎 ? 還是需要向 blogger 報告?

    回覆刪除
  20. 你檢查一下後台設定,格式→顯示標題欄位,這裡要選擇"是",才會顯示文章標題區,如果否,那就沒法出現標題的空格。
    另外它的關鍵字是post-title,可以看一下後台html語法設定,是否有異樣的程式碼,正確的應該類似以下,
    <b:if cond='data:post.title'>
    <h3 class='post-title entry-title'>
    <b:if cond='data:post.link'>
    <a expr:href='data:post.link'><data:post.title/></a>
    <b:else/>
    <b:if cond='data:post.url'>
    <a expr:href='data:post.url'><data:post.title/></a>
    <b:else/>
    <data:post.title/>
    </b:if>
    </b:if>
    </h3>
    </b:if>
    你可以檢查看看

    回覆刪除
  21. thanks 綸太郎, 原來是後台設定問題, 已解決了 : )

    回覆刪除
  22. 您好,我想請問一下,我套用新版的範本,如果我想同一天發的文章每篇都有間隔,該如何更改呢?(我的範本是同天每篇都黏在一起)

    回覆刪除
  23. 你可以加下邊線,或是控制離前文遠些,例如在
    .post-footer {
    margin: 1.5em 0 0;
    border-bottom: 1px solid #000;
    }

    回覆刪除
  24. 不好意思, 想請教一下,我現在是套用官方的模板, 然後他對於文章中的圖片有內建語法加邊框, 如果我某幾篇文章中的圖片不想用內建的邊框語法, 請問有辦法可以解決嗎?

    回覆刪除
  25. 我知道的就是把它都設成都不要有邊框,要加的自己再用圖片編輯軟體自行修改圖片。

    回覆刪除
  26. 承27. 我也遇到相同問題, 再請較一下 要在哪裡設成"不要有邊框"呢 ? (不好意思 我是blog初學者)
    先謝謝你喔 :)

    回覆刪除
  27. 在後台,編輯Html裡的原始檔,用語法設定。

    回覆刪除
  28. 您好,想請問一下,我在上傳了某模版後,接下來版面配置裡的"網誌文章"就變成了兩個,也就是說;從首頁會看到兩個欄位都是網誌的文章,版面配置的情況如圖所示:
    https://lh4.googleusercontent.com/-doAvKuQxpbc/UAr1IXHEAaI/AAAAAAAABSs/0RFaZt7EtNg/s576/QQ%25E6%2588%25AA%25E5%259C%259620120722023010.jpg
    請問您知道要如何刪掉其中一個嗎?我為了這件事傷腦筋了好久

    回覆刪除
  29. 在後台,設計→修改HTML,然後"將迷你組件範本回復為預設值",試看看有沒有用,如果沒用,建議換個新模版,或是到PTT Blogger板上問看看。

    回覆刪除
    回覆
    1. 謝謝您,我有照您的方法做過了,但它還是存在 = ="
      不管換哪個模版它都會存在,只是在某些模版裡它會被藏到後面,我是想一勞永逸地把它去掉,因為這樣很多喜歡的模板都不能用了。
      無論結果如何都很謝謝您的熱心協助和建議,真的非常感謝您。

      刪除
  30. 您好~
    想請教... 我現在套用新的模版"動態檢視"
    但blog寬度設定都無法變大~這樣文章圖片都會被縮小
    請問方法讓中間那區塊變寬嗎?
    我有參考這一篇【整體寬度】也是沒辦法?
    http://01mistery.blogspot.com/2010/03/blogger-new-mode.html
    謝謝

    回覆刪除
  31. 動態檢視,裡面有許多javascript的語法,跟一般模板的控制不太一樣,這部分我就沒有研究了。

    回覆刪除

設有留言驗證及核准,版主閱覽後,留言才會顯示,發問前請善用網站目錄Google搜尋功能

Related Posts Plugin for WordPress, Blogger...