顯示具有 blog 標籤的文章。 顯示所有文章
顯示具有 blog 標籤的文章。 顯示所有文章

2008年9月15日 星期一

Blogger頁面上方導覽列躲貓貓隱藏法(Peek-A-Boo NavBar)

以前都懶得更新Blogger版面,可是前陣子開始越看越不滿。陸續添加了一些東西后,覺得很亂,又加入收合功能…常常修改HTML,覺得Blogger上方的導覽列,還是有他的用處,至少登入比較方便。乾脆改成平時隱藏,移至畫面上方才出現的躲貓貓導覽列(Peek-A-Boo NavBar)好了。

在 Templates 的< /head >前面加入以下code即可:

<style type='text/css'>
/* ---- Hovering Peek-A-Boo Blogger Navbar ---- */
#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)}
#navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}
</style>

這個純CSS的方法適用於IE6、FireFox1.5、Opera 9.0 以後的版本。
在最上方會有一條空白空間(顯示背景色)。可以將整個頁面上移20~30px,或直接設定標頭不頂最上方並與背景色一致就看不出來了。

2008年8月6日 星期三

2008年3月31日 星期一

Blogger頁面上方導覽列隱藏法教學

Blogger被Google買下已經很久了,可是除了整合帳號以外,功能上感覺起來,並沒有很長足的進步,真的是很可惜。
不過,免費的海量G家資源還是不錯用的啦~簡簡單單套用幾下,就有設計好的頁面可以用,頁面編輯自由度也算不差。就討厭在每一頁上頭,總有一條跟主畫面不能融為一體的醜醜導覽列。雖然右邊可以方便登入,左邊隨機跳到別人家看看也不錯,但是就是卡卡的在那裏礙眼礙眼的。

現在Tony整理了一個隱藏教學,需要的自己參考試看看:

第一步:請先登入 blogger.com
第二步:Blogger 控制主頁,請按『版面配置』功能 。
第三步:Blogger 修改版面配置,請按『修改HTML』功能 。
第四步:Blogger 修改前請注意,建議請先『備份下載模板』,以免修改錯誤。
第五步:複製以下程式碼:
========以下為碼========
<style type='text/css'>
.Navbar{visibility:hidden;display:none;}
</style>

========以上為碼========

第六步:Blogger 修改範本,按Ctrl-F使用『搜尋文字功能』先找到 </head> 關鍵字。
第七步:Blogger 修改範本,將複製的程式碼貼在 </head> 之前,最後再按『儲存範本』。

就是這麼簡單,只要半分鐘,blogger頁面上方的導覽列就不見了!

2008年3月11日 星期二

在Blogger加入自動播放的下拉選單Picasa網路相簿-新版本可預設播放最新相簿

上次貼了「在Blogger加入自動播放的下拉選單Picasa網路相簿」以後,獲得陌生網友的回應感謝,真是奇妙,竟然也有人找來這。呵呵~
前幾天發現高手針對「自動播放的下拉選單Picasa網路相簿」的code做了更新,現在可以預設播放最新相簿。
不過這次好像也留一手(?我亂說的),沒辦法直接取用,只好偷進人家家裡看看網頁原始檔,再一行一行整理。
把下面這段碼中所有「你的Google帳號放這」改成你的英數字Google帳號,即可享用。

====以下Code====
<div id="picasaweb">
</div>
<script>
var flashstring='<embed pluginspage="http://www.macromedia.com/go/getflashplayer" width="288" src="http://picasaweb.google.com/s/c/bin/slideshow.swf" height="192" flashvars="host=picasaweb.google.com&captions=1&RGB=0x000000&feed=http%3A%2F%2Fpicasaweb.google.com%2Fdata%2Ffeed%2Fapi%2Fuser%2F你的Google帳號放這%2Falbumid%2F##ALBUMID##%3Fkind%3Dphoto%26alt%3Drss" type="application/x-shockwave-flash"></embed>';

function writeflash(albumid){
flashstring1=flashstring.replace("##ALBUMID##",albumid);
document.getElementById("picasaweb").innerHTML=flashstring1;
}

function listallalbum(json) {
var firstlink='';
var temp = '目前播放&#65306;<select onchange="writeflash(this.options[this.selectedIndex].value)">';
var sortentry=json.feed.entry;
for (var i=0, post; post = sortentry[i]; i++) {
var title = post.title.$t;

var link = post.link[2].href.replace(/(^.*albumid\/)(.*)(\?.*$)/g,"$2");
if(i==0){
firstlink=link;
}
temp += '<option value="'+link+'">'+title +'</option>';
}
temp+="</select>";
document.writeln(temp);
writeflash(firstlink);
}
</script>

<script src="http://picasaweb.google.com/data/feed/base/user/你的Google帳號放這?kind=album&amp;hl=en_US&amp;access=public&amp;alt=json&amp;callback=listallalbum"></script>

====以上Code====

版權及功勞歸高手所有,我只是取用後整理一下,以免搞丟或忘記。

<補充>
一樣,登入Blogger,到「版面配置」頁加入「HTML/JavaScript」類的「網頁元素」,把改好的碼貼入,然後取個標題、決定位置,新版本下拉選單式輪播相簿便完成了。會預設播放最新相簿喔~

2008年2月9日 星期六

在Blogger加入自動播放的下拉選單Picasa網路相簿

我blog上面有個自動播放的下拉選單網路相簿,是之前在某處,看到網友的好創意,運用Picasa網路相簿本身內建的自動播放。不過網頁初次載入時是空白的,必須下拉選擇相簿後才會出現自動播放。於是稍微研究了一下,瞭解修改自訂預設相簿的方式,就會一開始就有相簿會跑。

方法如下:
首先到自己的Picasa網路相簿,進入打算當作預設播放的相簿,在左側「上載相片」的連結上按滑鼠右鍵,複製捷徑。
複製到的捷徑應該長得像這樣:「http://picasaweb.google.com/lh/webUpload?uname=你的Google帳號&aid=1234567890123456789」,在「aid=」後面出現的那串數字,就是這個相簿的ID,把它複製起來。

接下來,把下面這段碼最後的「你的預設相簿ID放這」取代為剛剛複製到的相簿ID數字串,然後把所有「你的Google帳號放這」改成你的英數字Google帳號。

<script>
var flashstring='<embed pluginspage="http://www.macromedia.com/go/getflashplayer" width="288" src="http://picasaweb.google.com/s/c/bin/slideshow.swf" height="192" flashvars="host=picasaweb.google.com&captions=1&RGB=0x000000&feed=http%3A%2F%2Fpicasaweb.google.com%2Fdata%2Ffeed%2Fapi%2Fuser%2F你的Google帳號放這%2Falbumid%2F##ALBUMID##%3Fkind%3Dphoto%26alt%3Drss" type="application/x-shockwave-flash"></embed>';

function writeflash(albumid){
flashstring1=flashstring.replace("##ALBUMID##",albumid);
document.getElementById("picasaweb").innerHTML=flashstring1;
}

function listallalbum(json) {
var firstlink='';
var temp = '<select onchange="writeflash(this.options[this.selectedIndex].value)">';
var sortentry=json.feed.entry;
for (var i=0, post; post = sortentry[i]; i++) {
var title = post.title.$t;

var link = post.link[2].href.replace(/(^.*albumid\/)(.*)(\?.*$)/g,"$2");
if(i==0){
firstlink=link;
}
temp += '<option value="'+link+'">'+title +'</option>';
}
temp+="</select>";
document.writeln(temp);
writeflash(firstlink);
}
</script>

<script src="http://picasaweb.google.com/data/feed/base/user/你的Google帳號放這?kind=album&hl=en_US&access=public&alt=json&callback=listallalbum"></script>

<div id="picasaweb">
<embed pluginspage="http://www.macromedia.com/go/getflashplayer" width="288" src="http://picasaweb.google.com/s/c/bin/slideshow.swf" height="192" flashvars="host=picasaweb.google.com&captions=1&RGB=0x000000&feed=http%3A%2F%2Fpicasaweb.google.com%2Fdata%2Ffeed%2Fapi%2Fuser%2F你的Google帳號放這%2Falbumid%2F你的預設相簿ID放這%3Fkind%3Dphoto%26alt%3Drss" type="application/x-shockwave-flash"></embed></div>

最後,登入Blogger,加入「HTML/JavaScript」類的「網頁元素」,把上面改好的碼貼入,然後取個標題,決定頁面擺放位置(建議上面一點),就大功告成了。以後要改預設相簿,一樣找到相簿ID後去把碼修改一下即可,相簿大小也可以自己調整。

2007年12月14日 星期五

新型態的微型網誌

在找資料時,無意間注意到「微型網誌」。

關於這種有字數限制、類似「修改MSN狀態」的小型blog,
覺得也出來至少半年了,但是卻一直沒接觸到,看來是太久沒掛網,
而且社交生活太不用心維持了,真該好好檢討一番才是。

話說回來,如果我把blog寫短一點,用email的方式寫,
雖然沒有用MSN、GTALK這麼方便,不過應該也可以常常更新。
倒是不訂閱我RSS的話就沒那麼容易看到我內容了,沒差啦~
Blog本來就是當作喃喃自語、寫日記的地方,卻被搞得越來越複雜,
簡單的東西,不是一定要透過限制功能才做得到,自己要怎麼用才是重點啊~

較多會員的英文元組
http://twitter.com/

親切台灣local版
http://buboo.tw/


反正我就是還不想接受新改變啦~
我承認老了~

2007年4月27日 星期五

不常用的部落格

現在的部落格真方便,也很流行。
google的blogger可以直接以email寫blog,可惜貼圖還是麻煩了點。
可惜都沒什麼在用。

2006年8月28日 星期一

試用Windows Live Writer

網路上看到微軟提供的這個部落格書寫軟體,據說功能不錯,還一反常態支援別家Blog,不是只支援自家Space,覺得很驚訝,趕快來鑑定一下。

2005年10月18日 星期二

有意思~

相較於 MS 體系的軟體及服務,實在比較喜歡 Google 體系的。
Blogger既然被 Google 買下,定有其OK之處~
用到這裡都覺得很順~不錯不錯!