May 31, 2007

修正 Blogger feed: 基于 Yahoo Pipes 的 hack

原文:Blogger feed corrector: Yahoo Pipes based hack更新:现在可以试试这个 hack 了。Yahoo 修复了日期问题。在此感谢所有在反馈中支持我的人。  就像大多数人都知道的,Blogger 的 feed 按照更新日期而不是发布日期来排序。这让你在编辑旧文章时很不方便,因为这会文章重新出现在 feed 中。最近,Yahoo 发布了一个让人激动的 feed 服务── 管道(Pipes),Aditya 有了一个好点子──使用管道 对Blogger feed 按发布日期重新排序。我想我会在它的基础上 hack,让大家都能轻松使用。  这个 hack 是给那些不使用 Feedburner,而是使用 Blogger 自身提供的 feed 的用户(页面底部的“Subscribe to:”链接)。我根据 Aditya 的 hack 作了一些修改,使得它适用于所有的 feed。对模板作一些小修改,就能使用重新排序的 feed 来替代 Blogger 的 feed。如果你希望这样,首先到 pipe's page 中填上你博客的地址,检查一下管道(pipe)是否按照发布日期对文章排序,而不是更新日期。  如果你对要使用它,下面我将告诉你如何在模板中使用。在模板中找到这个 includable。 <b:includable id='feedLinksBody' var='links'><div class='feed-links'><data:feedLinksMsg/><b:loop values='data:links' var='f'> <a class='feed-link' expr:href='data:f.url'expr:type='data:f.mimeType'target='_blank'><data:f.name/>...

May 27, 2007

[翻译]标签云式 AJAX 标签

原文:AJAX Labels with Label Cloud  为了满足更高的要求,我将讲解如何把 AJAX 标签 和非常流行的 Phydeaux3 标签云 hack 集成在一起。  请注意:为了预防意外,请在下面三处备份你的模板:  a. 安装标签云前;  b. 安装 AJAX Labels 前;  c. 在下面提到的第四步前。  1. 第一步是安装标签云。按照 Phydeaux3的文章 中的步骤进行安装。如果安装中出现问题,请在文章后面发表评论。在这里我还无法帮助你。如果你已经安装了,跳到下一步。  2. 第二步要安装的是 标签云 中的一部分。除了文章中的第三步(可选的那个),其余按步骤安装。  3. 如果你安装了标签小部件,你可能不得不删除它。(我不是很确定)按 Phydeaux3 的建议做。  4. 在 Phydeaux3 标签云代码中找到下面部分:a.href = '/search/label/'+encodeURIComponent(t);  替换成:a.href = 'javascript:getCat("' + encodeURIComponent(t) + '",null)'  我并没有测试过。希望它能工作。如果不行,请撤销...

May 25, 2007

[翻译]加入 BlogU 学员 Blogroll!!

原文:Join the BlogU Students Blogroll!!  看来大部分人觉得在 BlogU 学院中添加 blogroll 是不错的注意!当然,这是自愿的。如果你从 BlogU 的文章中学到了怎样个性化自己的博客,想加入 BlogU 学员 Blogroll,现在就是好机会!!  在 blog 中添加 blogroll,我提供了几种不同的显示方案。方案 #1 - 完整的 blogroll: 经典 Blogger 模板 - 把代码放到侧边栏中你希望显示的位置Blogger Beta 模板 - 在“控制台->模板->页面元素->添加页面元素”中添加“HTML/JavaScript”,然后粘贴代码。<script language="javascript" type="text/javascript" src="http://rpc.blogrolling.com/display.php?r=10fb2ff44d81d6db5d565673f96537a4"></script>方案 #2 - 使用按钮显示完整的 blogroll:  和方案 #1步骤相同,不过在添加代码时使用下面的代码:<a title="Students of BlogU" target="_blank" href="http://www.bloggeruniversity.blogspot.com/"><img border="0" src="http://h1.ripway.com/anniebluesky/blogustudent.png"...

May 22, 2007

[翻译]用“摘要”(pullquote)打破厌倦

原文:Pullquotes to Break the Boredom  我非常希望有新的“摘要”(格式), 但我把所有热情都花在 blogosphere,没有时间来研究“摘要”!  今晚,所有的热情都冷却过后,非常非常意外,我真的改变了我的 blog!  当我开始建立 Buttermilk Clouds 时我就爱上了其中的引用格式(blockquote)。线条简单典雅,而且避免引用的文字改变文章的整体感觉。今晚我尝试是否能把它修改成“摘要”(格式)。结果非常不错!(摘要、CSS还有其他一些代码都能按照我希望的方式正常工作。我很容易对不同的东西都感兴趣...) 。就像你看到的,我使用字号稍大的不同字体剧中显示。  要想拥有自己时尚的摘要格式,在“模板/编辑 HTML”中,在CSS里面添加下面的代码:.pullquote {float: right;width: 150px;margin: 5px 5px 5px 10px;padding: 3px 0;font: Verdana, sans-serif;color: <span style="color: rgb(153, 0, 0);">#555</span>;text-align: center;font-size: <span style="color: rgb(102, 102,0);">1.4em</span>;border-top: <span style="color: rgb(102, 51, 102);">3px double <span style="color: rgb(255, 102, 0);">#ccc</span></span>;border-bottom: <span style="color:...

May 20, 2007

[翻译]下拉菜单式“旧文章”和“博客归档”

原文:Blogger 'Previous Posts' & 'Archives' Drop Down Menu  我知道下拉菜单有一些问题,我也正在学习如何去解决。在 Blogger Forum 的 thrbr 帮助下,我正逐步的修复问题。我从自己订阅的杂志里基本上知道了所有所需要的知识,但我还是不知道怎么把下拉菜单添加到侧边栏而不会因为长标题扩展。放轻松点,我现在知道怎么弄,现在我将与你分享这一切。  修改“最近文章”或“旧文章”: 在模板中找到下面的代码:<h2 class="sidebar-title">Previous Posts</h2><ul id="recently"><BloggerPreviousItems><li><a href="<$BlogItemPermalinkURL$>"><$BlogPreviousItemTitle$></a></li></BloggerPreviousItems></ul>  替换成:<select name="PreviousItemsMenu" onChange="location.href=this.options[this.selectedIndex].value;" style="background-color:#ffffff; color:#555555; font-family: Trebuchet MS; width: 123px;" ><option value="/">Previous Items</option><BloggerPreviousItems><option value="<$BlogItemPermalinkURL$>"><$BlogPreviousItemTitle$></option></BloggerPreviousItems></select>  修改“博客归档”:...

May 19, 2007

[翻译]自定义 blogger 模板

原文:Customizable blogger template  在 RealityTopia Blog 的这篇文章中对模板进行了一些深入修改。George Mikos 没有使用简单的可自定义的模板,而是自己写模板源代码。他不仅告诉你怎么作,还告诉你为什么要这么做。 如果能知道作每个步骤的原因,那么学习起来就容易很多了。而他正好做到了这些,而且深入浅出。很像他值得骄傲的模板代码一样,他也应该感到骄傲。  我打算好好学习一下他的方法。我对每个部分都非常感兴趣,特别是使用 CSS 浮动属性来得到显示分辨率的宽度是 1024 x 768 还是 800 x 600。  文章中很多内容都需要好好消化。我强烈推荐想自己创建模板的人仔细研究这篇文章。译注:是很不错的文章,讲解很...

May 18, 2007

[翻译]如何优化网页读取速度

原文:How to optimize web pages for faster loading  如果网页加载速度很快,博客的读者当然会很高兴。问题是──怎么让它快速加载?让我告诉你我的发现──优化网页,这就是答案。下面是一些优化网页的方法。  减少网页中的不必要的空格是一种降低 Page weight 的方法。Page weight 在读取过程中起到了重要的作用。一些工具,比如 HTML Tidy, 能自动从网页代码中去掉多余的空格和空行。当然你也能自己去掉代码中(多余的)空格。这能去掉网页中大部分多余的重量(weight),从而加快一些读取速度。  由于每个独立的域都会花一部分时间进行 DNS 查找,减少使用其他域的 CSS、JavaScript 和图片会减少读取时间。虽然不总是很使用,但是,尽量少使用不同域的文件是可能的。我检查我的 blog,把所有图片都以PNG格式保存在本地,然后上传到我的网页服务器。这样所有(几乎所有)都来自同一个域。  当然也可以修剪网页。在 Blogger 中这简单的等于减少主页的文章数量。在设置/格式设定/显示中可以对其进行修改。我选择了5篇文章,可能以后还要修改。  去掉博客中不必要的元素。 对我来说包含声音文件是很大的错误。它需要大量的时间来读取,同时也经常惹恼读者。试着不要使用 Java applets──JavaScript 读取更快速。问问自己,侧边栏的一个小时钟是否能值回读取它的时间?特别是每个人在右下角都能看到时间的时候。从读取速度上好好审阅一下 blog,也许能减少向你的 blog 中添加一些不必要的东西。  我们还用方法提高图片的读取速度。只需要在 img 标签中加上 width 、height 属性。比如,以前的标签像这样:<img SRC="blogheader.gif">blogheader.gif 的宽、高分别是30、15,那么改成如下格式:<img...

检查 URL 是否有效

#---------- check_url.py ----------#from httplib import HTTPfrom urlparse import urlparsedef checkURL(url): p = urlparse(url) h = HTTP(p[1]) h.putrequest('HEAD', p[2]) h.endheaders() return h.getreply()if __name__ == '__main__':for url in ('http://msnbc.com/nonsense','http://msnbc.com/', 'http://w3c.org/','http://w3c.org/nonsense', 'http://w3c.org/Consortium/','http://ibm.com/', 'http://ibm.com/nonsense'): print url, checkURL(url)[:2]------------------------------------------------------------------------% python check_url.pyhttp://msnbc.com/nonsense (200, 'OK')http://msnbc.com/ (302, 'Object moved')http://w3c.org/ (301, 'Moved Permanently')http://w3c.org/nonsense (301, 'Moved Permanently')http://w3c.org/Consortium/ (301, 'Moved Permanently')http://ibm.com/ (200,...

创建 email 地址图标

  注意到有些网站上有这样的图标吗?如果想要,快来这里创建一...

[翻译]在 blog 中添加 Google 搜索引擎

  通过 Co-op - now with Custom Search Engine 可以轻松向你的 blog 中添加 Google 搜索引擎,而且可以按照你的需要自定义。  填上要搜索的网站地址和语言,得到代码后复制到你的 blog。非常简单!!译注:需要 Google 账号,而且设定界面是英文。英语不好就找朋友帮...

别了 Windows

在我看来,windows 只能当做游戏机了。不稳定、低效率,完全不能忍受。昨晚差点就砸电脑了。别了,祝 windows 早日...

May 14, 2007

[翻译]高亮显示作者评论与评论通知

原文:Author comment highlighting and notification  中断了一两个星期后,我又回来了。在评论部分我有了新的 hack ——高亮显示作者的评论并且可以在作者恢复评论后通知读者。你也许已经注意到了我的评论以红色显示,这也就是我所说的“高亮”。我相信这能帮助读者在长篇的评论找到我回复。一些读者问我如何在他们的博客中使用这种功能。现在我就与你们分享这一切。  评论回复通知是我在老 blogger 中做过的另一个 hack。当有人在博客中发布了问题(评论),在回复后,除非发表评论的人经常访问,要不很难看到。如果是通过搜索或者链接访问的,那么可能他不会记得博客地址。有时,你的回复很长但却再也没有得到回音。通过使用通知,只要简单的点击能自动发送邮件给评论的人。邮件会包含你的姓名、文章标题和固定链接,这样就能轻松的看到你的回复。这个 hack 实际上是我的网站 Anniyalogam.com 提供的一项服务(请注意邮件只有读者在个人资料中公开了邮件地址的情况下才能发送。)。  现在开始修改代码。首先找到 comment-body 类,复制粘贴后修改为 comment-body-author,并球该成需要的评论显示方式。比如,我想设置颜色和粗体显示。.comment-body { margin:0; padding:0 0 0 20px;}.comment-body p { font-size:100%; margin:0 0 .2em 0;}.comment-body-author...

May 12, 2007

[翻译]优化 tab 式标签

原文:Tweak your label tabs  我在 Hoctro 标签页面的基础上又进行了改进。很多人都有10个以上的标签,我肯定他们不想以 tab 的方式显示所有的标签。在修改的版本中允许只显示排名前5的标签(以使用频率为基础)。我同样做了其他两处改动:1. 显示指向主页的“Home”;2. 修改了标签链接地址。在 tab 页面中显示前 100 条结果(还记得我前一个 hack 吗?)。  如果希望使用这个升级版,首先安装 Hoctro 原来的 hack。然后在“页面元素”中编辑“tab 式标签部件”,修改排序方式为“按频率排序”。然后在 Hoctro 的代码中找到下面的代码。<b:widget id='Label2' locked='false' title='Labels' type='Label'><b:includable id='main'> <div id='tabsF'> <ul> <li><a expr:href='data:blog.homepageUrl'><span>Home </span></a></li> <script type='text/javascript'> var labelnum = 0; <b:loop values='data:labels' var='label'> if (labelnum++ &lt; 5) { document.write("<li><a expr:href='data:label.url + "?max-results=100"'><span><data:label.name/></span></a></li>");...

太厉害了,blogspot再次无法访问

  不知道是我这里的问题还是全国都一样。blogspot 再次无法访问。幸好我用的 Firefox,幸好这个世界上有人开发了 FoxyProxy、Tor。他们太伟大了。  向这些伟大的人...

May 11, 2007

一个自己很喜欢的歌手唱的很喜欢的歌的喜欢的flash

张学友——我真的受...

May 10, 2007

[翻译]在 blogger 中添加 Del.icio.us 与 Digg 链接

原文:Del.icio.us and Digg hotlinks for your Beta blog  很多博客都在自己的网站中添加像 Delicious 或者 Digg 这样社会书签网站,浏览的人能方便的提交自己喜欢的文章。Vivek Sanghi 指出在这篇文章中的方法在新 blogger 中已不适用了,同时建议我也许可以研究一下。我找到了新的方法而且在我的 blog 中也正常的工作,你能在我文章的标签旁边找到这些链接。  如果你想把链接添加到 blogger 中,展开模板代码,找到“post-labels”,你会看到下面这段代码。在 /span 前面添加红色的代码。<span class='post-labels'><b:if cond='data:post.labels'> <data:postLabelsLabel/> <b:loop values='data:post.labels' var='label'> <a expr:href='data:label.url' rel='tag'> <data:label.name/> </a><b:if cond='data:label.isLast != "true"'>,</b:if> </b:loop> </b:if> <a expr:href='"http://digg.com/submit?phase=2&amp;url=" + data:post.url + "&amp;title=" + data:post.title' target='_blank'>DiggIt!</a><a...

[翻译]在 blog 中使用PPT

原文:Embed Powerpoint in Your Blog  让我们说点不一样的东西。在 blog 中显示 PPT 怎么样?  登录 SlideAware,注册一个免费帐号。下载 PPT 插件,然后安装。在创建 PPT 后,保存为 SlideAware。集成到 blog 就很简单了:<iframe src="http://personal.slideaware.com/yourmailadress/presentationid" width="480" height="380" style="border:none"></iframe>下面显示...

May 9, 2007

[翻译]显示相关文章

原文:Related Posts  在看到 Hoctro 一个类似的 hack 文章后,我一下想到了这个点子。但不太走运的是,他要求所有的文章标题都有一个相同的前缀,而我希望按照标签显示相关的文章。我想用新的 JSON 格式做点什么。而我也在 Beautiful Beta 上阅读了关于如何解析 JSON 属性的文章。  如果你的标签中使用了任何 url 保留字符,比如“?”“/”。这个属性可能不会正常工作。在这里我没有对 url 进行编码。  首先,进入“模板 -> 编辑 HTML”。粘贴下面代码到 head 部分:<script type="text/javascript">//<![CDATA[var relatedTitles = new Array();var relatedTitlesNum = 0;var relatedUrls = new Array();function related_results_labels(json) {for (var i = 0; i < json.feed.entry.length; i++) {var entry = json.feed.entry[i];relatedTitles[relatedTitlesNum] = entry.title.$t;for (var k = 0; k < entry.link.length; k++) { if (entry.link[k].rel == 'alternate') { relatedUrls[relatedTitlesNum] = entry.link[k].href; relatedTitlesNum++; break; }}}}function removeRelatedDuplicates() {var tmp = new Array(0);var...

[翻译]用 RSS 代替 Atom

原文:Replace Atom With RSS  在你的 blogger 页面的最下面会看到类似于这样的一行:Subscribe to: Posts (Atom)  或者Subscribe to: Post Comments (Atom)  这取决于你当前浏览的页面的类型(索引,固定链接,搜索,标签等等)。  如果你想使用 RSS,那么进入“模板 -> 编辑 HTML”,选中“展开窗口小部件代码”,然后找到下面的代码段。<b:includable id="feedLinksBody" var="links"></b:includable><div class="feed-links"><data:feedlinksmsg><b:loop values="data:links" var="f"> <a class="feed-link" href="data:f.url" type="data:f.mimeType" target="_blank"><data:f.name> (<data:f.feedtype>)</data:f.feedtype></data:f.name></a></b:loop></data:feedlinksmsg></div>  从代码上来看,可以选择你希望使用的 feed。但是不走运的是,并没有提供可选的项或者还没有计划这么做。所以我们只能自己手动编辑。  把上面的代码替换成下面的。<b:includable id="feedLinksBody" var="links"></b:includable><div class="feed-links"><data:feedlinksmsg><b:loop...

May 8, 2007

[翻译]随机显示文章

原文:Display Random Post  是否曾经想如何随机显示文章?你马上就能知道:D  首先,把下面的 javascrpit 代码添加到模板头部标签之间(模板 -> 编辑 HTML)。<script type="text/javascript">//<![CDATA[var _yourBlogUrl = "http://purplemoggy.blogspot.com";function randomPost() {var script = document.createElement("script");script.setAttribute("type", "text/javascript");var theUrl = _yourBlogUrl +"/feeds/posts/summary?alt=json-in-script&callback=getTotalPostsCallback&start-index=1&max-results=1";script.setAttribute("src", theUrl);document.documentElement.firstChild.appendChild(script);};function getTotalPostsCallback(json) {var totalResults = json.feed.openSearch$totalResults.$t;if (totalResults > 0) {getRandomPostNumber(totalResults);}};function getRandomPostNumber(totalResults) {var randomNumber = Math.floor((Math.random() *...

Pages 251234 »
Twitter Delicious Facebook Digg Stumbleupon Favorites More

 
Powered by Blogger