2008年12月10日 星期三

Blogger新增文章地區位置欄位

Blogger現在可以為每篇發佈的文章加入地區位置,當我用滑鼠點擊位置的連結,就會以Google地圖開啟所在位置,這樣對於寫旅遊或是食記的文章還蠻方便的。
Blogger add location

這項功能必須到Blogger 測試區http://draft.blogger.com/才看的到,在新增文章時就會多出一個「位置」
Blogger add location

按add location後會出現地圖搜尋,找到你要的位置,然後可以編輯該位置的名稱後按下儲存
Blogger add location

最重要的是要開啟這個欄位,首先至blogger的測試後台「資訊主頁」>「版面配置」> 「網頁元素」
在網誌文章下面按編輯
Blogger add location

勾選「位置」選項,名稱也可以任意修改
Blogger add location

下方的排列項目可以用滑鼠拖曳「位置」區塊要擺放的位置
Blogger add location

如果你的Blogger沒有出現這個欄位,代表之前曾修改過HTML,無法自動新增,所以必須以手動方式自己把代碼加進去

到blogger的測試後台「資訊主頁」>「版面配置」>「修改HTML」
修改前勾選「展開小裝置範本」記得先行備份

data:post.labels的關鍵字找到以下代碼,綠色代碼可能因為新舊版本不同會有些不太一樣

    <p class='post-footer-line post-footer-line-2'><span class='post-labels'>
    <b:if cond='data:post.labels'>
    <data:postLabelsLabel/>
    <b:loop values='data:post.labels' var='label'>


然後將藍色的代碼複製放置在剛剛找到的綠色代碼之上,如下列

    <span class='post-location'>
            <b:if cond='data:top.showLocation'>
              <b:if cond='data:post.location'>
                <data:postLocationLabel/>
                <a expr:href='data:post.location.mapsUrl' target='_blank'><data:post.location.name/></a>
              </b:if>
            </b:if>
    </span>

    <p class='post-footer-line post-footer-line-2'><span class='post-labels'>
    <b:if cond='data:post.labels'>
    <data:postLabelsLabel/>
    <b:loop values='data:post.labels' var='label'>

這樣部落格的文章就會出現「位置」欄位,不過先別急,之前的文章如果沒有加入位置儲存,還是看不到的
Related Posts Plugin for WordPress, Blogger...