顯示具有 blogger相關 標籤的文章。 顯示所有文章
顯示具有 blogger相關 標籤的文章。 顯示所有文章

2009年6月12日 星期五

怎麼插入背景音樂?

<embed src="音樂網址" width="230" height="10" autostart="0" loop="1" type="audio/x-ms-wma"></embed>

將這段語法放在文章中或是邊欄，在放的地方會出現播放音樂的小視窗。


width設定寬度，height設定高度。

autostart=1，表示自動播放背景音樂，最好是設成0，讓閱讀者自己決定是否播放。

loop=1表示循環播放，loop=2表示播放２次。

於
標籤：

文字的特殊變化

目前blogger後台提供的文字效果，只有斜體<em>及粗體<strong>，如果想要有別的效果，則要自己加上相關語法，最常用的有：

1、劃線、刪除線：前後加上<;s>要刪除的文字<;/s>，或是<;STRIKE>要刪除的文字，例如：刪除文字

2、加上底線：<U>文字敘述<U>，例如：文字底線

3、加上分格線<;hr>




4、<SUB>下標字
例如：y2

5、<SUP>上標字
例如：x2
於
標籤：

如何顯示特殊字元?

通常在文章中要加入程式碼，一些特殊字元在html通常會無法顯示，例如<>&等等，這時就要以另外的程式碼放在html裡面來代替原有的字元才能正常顯示，常見的有下列幾個。
< 以&lt; 替代 > 以&gt; 替代
& 以&amp; 替代
© 以&#169; 或是　&copy;　替代
® 以 &reg; 替代
空白 以&nbsp; 替代
如果想要更多有趣的特殊符號，在 HTML 中顯示特殊字碼 (Times字型)
於
標籤：

加上刪除線

有時Blogging時，因為後來有Update或是有寫錯筆誤之處，便會想要加上刪除線作為Highlight，而非直接在文章中刪除，同時也比較醒目，方便讀者閱覽..


作法如下：<span style="text-decoration: line-through;"> deleted text part </span>

效果

deleted text part
於
標籤：

在文章裡顯示程式碼區

1.在「範本」裡面的「修改html」放在＜/head＞之前即可。

CODE, .Actipro_CodeHighlighter {
display: block; /* fixes a strange ie margin bug */
font-family: Courier New;
font-size: 8pt;
overflow:auto;
background: #f0f0f0 url(http://klcintw.images.googlepages.com/Code_BG.gif) left top repeat-y;
border: 1px solid #ccc;
padding: 10px 10px 10px 21px;
max-height:200px; /*height:200px; // for IE6*/
line-height: 1.2em;
}

2.在文章中將程式碼置於< code>< /code>區塊中即可，如：
< code>.comment-body-author {
margin:0;
padding:0 0 0 20px;

background-color:#C0C0C0;
}< /code>

效果
.comment-body-author {
margin:0;
padding:0 0 0 20px;

background-color:#C0C0C0;
}
於
標籤：

2009年6月4日 星期四

繼續閱讀文章的設定

首先在 EDIT HTML 頁面中點選 Expand Widget Templates 後，在</b:skin>標籤後加入下列區段：
..........略
]]></b:skin>
<b:if cond='data:blog.pageType == "item"'>
<style type='text/css'>
span.fullpost {display:inline;}
</style>
<b:else/>
<style type='text/css'>
span.fullpost {display:none;}
</style>
</b:if>


在語法中搜尋 <data:post.body/>，原本的樣子是：

<p><data:post.body/><p>

改成：

<b:if cond='data:blog.pageType == "item"'>
<data:post.body/>
<b:else/>
<data:post.body/>
<br/><a expr:href='data:post.url'> read more... </a>
</b:if>

加
是為了讓 read more 接本文時可以斷行，寫文章的時候，只要把想要隱藏的文章區段用<span class="fullpost">...</span>包起來即可：

本文..... <span class="fullpost">（本文要隱藏的部分） </span>
於
標籤：

2009年5月29日 星期五

如何產生隨機文章---B Stir

Stuff a Blog這個網站，裡面有一項工具「B Stir」。

如何使用呢？進入B Stir網頁，輸入你的網址，及關鍵字（建議不用，這樣目標範圍會較大），

Sinppest：是否截取一小段本文內容。

Border：是否產生邊框

Results：產生幾則隨機文章，試你的網頁配置決定。

Background：背景顏色，只有紅、黃、藍三種。最旁邊有一項是「Advanced」，文章編碼，只有UTF-8及ISO-8859-1

最後就是最重要的要如何顯示？

第一種，Dynamic Widget，只顯示一則隨機文章。

第二種，Static Widget，顯示所有的隨機文章，如果你選擇Results為3，就一次顯示3篇文章。


按下後，會產生程式碼，可以選擇最下方的others，再將程式碼放上你的網頁元素即可，或是選擇上方的「Add to Blogger」，不過這要登入你的blogger後台，要輸入帳號和密碼了。
於
標籤：

加入相關文章功能 (Related Post)

Blog 文章一多，分類標籤的運用在找尋特定文章時就很重要。當有些讀者從外面的搜尋引擎或 RSS 連進來看 Blog 特定文章的時候，在文章的後面隨機列出一些相關文章的標題，一方面可以讓讀者找到更多對方可能會感興趣的 Post，另一方面也可以吸引讀者多去瀏覽自己其他的文章。

首先，塞入以下這段 Javascript (在 </head> 標籤前)：

<script type='text/javascript'>

//<![CDATA[

<!-- Script functions for Related Posts: RelatedLabels(), RemoveDuplicatedPosts(), contains(), ShowRelatedPosts()-->

var relatedPostsNum = 0;

var relatedTitles = new Array();

var relatedUrls = new Array();

var relatedDates = new Array();



function RelatedLabels(json) {

  var regex1=/</g, regex2=/>/g;

  for (var i = 0; i < json.feed.entry.length; i++) {

    var entry = json.feed.entry[i];

    relatedTitles[relatedPostsNum] = (entry.title.$t.replace(regex1, '&lt;')).replace(regex2, '&gt;');

    relatedDates[relatedPostsNum] = entry.published.$t.substr(0,10);

    for (var j = 0; j < entry.link.length; j++) {

      if (entry.link[j].rel == 'alternate') {

        relatedUrls[relatedPostsNum] = entry.link[j].href;

        relatedPostsNum++;

        break;

      }

    }

  }

}



function RemoveDuplicatedPosts(PostUrl) {

  var tmpUrls = new Array(0);

  var tmpTitles = new Array(0);

  var tmpDates = new Array(0);

  function contains(a, e) {

    for(var j = 0; j < a.length; j++)

      if (a[j]==e)

        return true;

    return false;

  }

  for(var i = 0; i < relatedUrls.length; i++) {

    if(!contains(tmpUrls, relatedUrls[i]) && PostUrl != relatedUrls[i]) {

      tmpUrls.length += 1;

      tmpUrls[tmpUrls.length - 1] = relatedUrls[i];

      tmpTitles.length += 1;

      tmpTitles[tmpTitles.length - 1] = relatedTitles[i];

      tmpDates.length += 1;

      tmpDates[tmpDates.length - 1] = relatedDates[i];

    }

  }

  relatedTitles = tmpTitles;

  relatedUrls = tmpUrls;

  relatedDates = tmpDates;

}



function ShowRelatedPosts(PostUrl) {

  RemoveDuplicatedPosts(PostUrl);

  var r = Math.floor((relatedTitles.length - 1) * Math.random());

  var i = 0;

  if (relatedTitles.length > 0) {

    document.write('Related Posts: <ul>');

    while (i < relatedTitles.length && i < 5) {

      document.write('<li><a href="' + relatedUrls[r] + '">' + relatedTitles[r] + '</a> - ' + relatedDates[r] + '</li>');

      if (r < relatedTitles.length - 1)

        r++;

      else

        r = 0;

      i++;

    }

    document.write('</ul>');

  }

}

//]]>

</script>


找到下面這段在文章內容後面顯示分類標籤的程式：

<b:if cond="'data:post.labels'"><data:postlabelslabel/><b:loop values="'data:post.labels'" var="'label'"><a href="'data:label.url'" rel="'tag'"><data:label.name/></a><b:if cond="'data:label.isLast">,</b:if></b:loop></b:if></span>

在迴圈結束 </b:loop> 前面塞入呼叫收集相關文章的函示，像這樣：
<b:if cond="'data:post.labels'"><data:postlabelslabel/><b:loop values="'data:post.labels'" var="'label'"><a href="'data:label.url'" rel="'tag'"><data:label.name/></a><b:if cond="'data:label.isLast">,</b:if> <!-- Fixed for Related Posts --> <b:if cond="'data:blog.pageType"> <script src="'" alt="json-in-script&callback="RelatedLabels&max-results="10" type="'text/javascript'/"></b:if></b:loop></b:if></span>

抓完文章當然就是找地方顯示！只有一個限制：一定放要在文章分類標籤那段的後面（就是一定要呼叫過上面那段，這樣也才會有相關文章可以顯示啊～），所以我就直接放在後面（上面這段 </b:if> 標籤的後面就可以，位置依自己的樣版外觀調整），這部分呼叫顯示相關文章的程式碼如下：

<!-- Fixed for Related Posts --><b:if cond="'data:blog.pageType"> <script type="'text/javascript'"> ShowRelatedPosts('<data:post.url/>'); </script></b:if></span>
於
標籤：

關於blogger各項服務的網誌

在Google的各項服務，例如信箱Gmail、相簿Picasa、日曆Calendar、地圖Maps等，大家應該很熟悉了，而我要介紹的是我自己常使用到的有關Blogger的相關服務，讓你在Blogger寫文章之餘，也可利用的豐富資源。

◎ Blogger Buzz發表關於Blogger各種資訊，提供的服務或是更新的訊息，其目地就是希望Blogger的服務能更好、更新更適合網友的需要，很值得參考，想獲得Blogger的第一手訊息來這裡準沒錯。

◎ Blogger Help說明中心預設是英文的，只要在頁面最下方，選擇繁體中文，就可出現中文說明，很實用的網站，建議新手可以多來這裡看文，我自己也從中學到許多實用技巧。

◎ Known Issues for Blogger這裡會報告Blogger所遇到的bug錯誤，上有標籤label，如果在Blogger使用上有什麼問題，不妨來這裡先找找看，是否有人和你有相同的問題，如果無法解決，或是想更進一步和其他部落客討論，可以上Blogger Help Group，登入後發表你的意見。

◎ Blogger in Draft的Blog所有Blogger在測試期beta的功能會在這裡發表，如果想搶一步試用新功能，或提出你試用的所遇到問題，站方都很樂意回覆的，要試用新功能的朋友記得要登入Blogger in Draft才能使用。

◎ Blogger Play這個網站會展示全世界以Google Blogger寫作的部落格，網誌上最新的照片，當然是以上載到Picasa後台的照片為對象，由於幾乎是即時，常常也可以看到一些比較限制級或是血腥暴力的相片，當你對相片有興趣，點擊就可以連上該部落格，看看是什麼內容。

◎ Blogger Developers Network介紹Blogger可以利用的API工具，或是修正訊息，這已經屬於進階者的範圍，這就不再多做介紹，因為很多我也看不懂，有興趣且看得懂的可以慢慢研究。

◎ Blogger Error Codes常常安裝新的Blogger template或是小工具時會出現錯誤訊息，可以在這裡找到相關的錯誤代碼，解決你的問題，如果找不到可以到bX-code Reporting Form，提交你的錯誤訊息並描述，Google就會回應給你在這個網頁上。

◎ Google Inside AdSense Blog（繁體中文）介紹有關Google AdSense的資訊，有安裝這個工具的，都應該來看看，別人怎樣利用Google AdSense來賺錢的。這些都是你在Blogger寫作上可以利用或查詢到的相關部落格，雖然blogspot.com不像一般BSP有首頁服務，但是多變化及可擴充性卻是相當豐富的，也有很多管道可以尋求協助，不過以上的服務通常都是英文的。

◎ Blogger Status這裡會公佈Blogger服務器Serves某月某日某時不能利用的資訊，而這個時間點應該是美國紐約時間，就是我們常在後台看到的"停電"訊息，因為在作更新或是其他重大變更，如果發現你的部落格不能連上或許可以查查這裡，看個究竟。

於
標籤：
訂閱： 文章 (Atom)