本文章將依序介紹如何新增Digg推文按鈕在blogspot文章,如果您與艾迪一樣對於語法尚不是那麼樣熟練,先下載被粉版後再繼續操作唷~
備份完成後,將 [ 展開小裝置範本框 ] 打勾,首先找到 <h3 class='post-title'>,
接著輸入語法
<script type='text/javascript'>
digg_url = '<data:post.url/>';
digg_title = '<data:post.title/>';
</script>
<script src='http://digg.com/tools/diggthis.js' type='text/javascript'/>,輸入完儲存模板。
預覽大略如下圖
為求部落格文章整齊度的美觀,我們可以在語法前後加上一段例如:
開頭加上 <div style='float:left; margin-right:5px'>,然後別忘了</div>做結尾;當中含意表示此<div>排列靠左,並與右方相距5px的距離。艾迪解釋得不好,用說的不容易懂。如下圖:
位置的變化如下圖:
基於任何原因的考量下,如果想將推文按鈕設置在文章結尾。可以找到 <p><data:post.body/></p> 之後,將語法加它後面。
(這是我示範時採用的位置,您也可以加在 <div class='post-footer'> 的後面..等等的其他位置。)
位置的變化如下圖:
如果你不喜歡這種大貼紙,Digg也有較精緻的按鈕,只要在語法中再插入一行 digg_skin = 'compact'; ,如下:
<div style='float:left; margin-right:5px'>
<script type='text/javascript'>
digg_url = '<data:post.url/>';
digg_title = '<data:post.title/>';
digg_skin = 'compact';
</script>
<script src='http://digg.com/tools/diggthis.js' type='text/javascript'/></div>
貼紙就變成是小巧精緻的式樣囉!
它還可以讓你改變底色,加入 digg_bgcolor = '#0000ff' ; ,其中 #0000ff 是色碼,可自行變換:
<div style='float:left; margin-right:5px'>
<script type='text/javascript'>
digg_url = '<data:post.url/>';
digg_title = '<data:post.title/>';
digg_skin = 'compact';
digg_bgcolor = '#0000ff';
</script>
<script src='http://digg.com/tools/diggthis.js' type='text/javascript'/></div>
如下圖:
以上,本文章至此介紹告一段落,半瓶水響叮噹~希望能給讀者帶來一些幫助
也可搭配 控制模組只在首頁或內頁顯示 文章中的技巧,部落格的頁面將能做更多運用與變化唷!
2 則留言:
請問若是用天空部落格的CSS語法,該如何修改?
ㄜ..我沒有使用過天空耶,所以我並不清楚他的CSS內容,不好意思唷
張貼留言