Blogger技巧收集

茶宫人体姐妹篇 [10P]

2008-11-09T10:21:00.001-08:00

茶宫人体姐妹篇 [10P]

本文由倍可亲网友[ fdgds ] 于 2008-10-23 19:15 上贴

原文网址： http://club.backchina.com/main/viewthread.php?tid=717817

茶宫人体姐妹篇 [10P]

图片：

图片：

图片：

图片：

图片：

图片：

图片：

图片：

图片：

图片：

2008年网络名言

2008-11-09T10:14:00.003-08:00

男人要有钱，和谁都有缘。
亲人之间，谈到钱就伤感情；情人之间，谈到感情就伤钱。
我们产生一点小分歧：她希望我把粪土变黄金，我希望她视黄金如粪土！
当年是不上大学一辈子受穷，而现在是上了大学马上就受穷。
过去：一流学生出国，二流学生考研，三流学生就业。
现在：一流学生就业，二流学生出国，三流学生考研。
顾客不是上帝，顾客只是上当。
在网上碰上一群流氓并不可怕，可怕的是碰上了一堆流氓软件。
孩子把玩具当朋友，成人把朋友当玩具。
现实中用真名说假话，网络中用假名说真话。
没钱的时候，老婆兼秘书；有钱的时候，秘书兼老婆。
有钱的人怕别人知道他有钱，没钱的人怕别人知道他没钱。
好好活着，因为我们会死很久很久。
不要相信什么一见钟情，因为你不能一眼看出对方挣多少钱。
我们好像进入了一个只有拿出钱才能证明爱心的时代。
话说出去之前你是话的主人，说出去之后你便成了话的奴隶。
高职不如高薪，高薪不如高寿，高寿不如高兴。
偷一个人的主意是剽窃，偷很多人的主意就是研究。
有时解释是不必要的——敌人不信你的解释，朋友无须你的解释。
人干点好事儿总想让鬼神知道，干点坏事儿总以为鬼神不知道，我们太让鬼为难了。
广告就是告诉别人，他的钱还可以这么花。
对待知识分子的态度，标志着一个民族的文明程度；对待工人农民的态度，则是考问这个民族的良心。
问君能有几多愁，恰似太监上青楼！
兄弟我先抛块砖，有玉的尽管砸过来。
如果有钱也是一种错，那我情愿一错再错。
人生在世无非是让别人笑笑，偶尔笑笑别人。
内事不决问老婆，外事不决问Google！
女人喜欢有安全感的男人；男人却往往被缺乏安全感的女人吸引。
爱情不是避难所,想进去避难的话，是会被赶出来的。
前女友就好象是亲生的，后女友就像是领养的。
房价越来越高，所以，好男人越来越少……
早起的鸟儿有虫吃，早起的虫儿被鸟吃！
老鼠从不浪费晚上的时间，而我们人类却浪费了每天的三分之一。
当你穿上了爱情的婚纱，我也披上了和尚的袈裟……
不吃饭的女人这世上也许还有好几个，不吃醋的女人却连一个也没有。
怀才就像怀孕，时间久了才能让人看出来。
装傻这事，如果干的好，叫大智若愚。木讷这事，如果干的好，叫深沉。
毁灭友情的方式有许多，最彻底的一种是借钱。
世上有一半的书是笨人写给笨人看的。
有些人注定是等待别人的，有些人是注定被人等的。
吃的是草,挤出来的是青春痘。
想污染一个地方有两种方法：用垃圾，或者用钞票！
只有在大排长龙时，才能真正意识到自己是“龙的传人”。

是谁害死了小布托？

2007-12-28T01:19:00.001-08:00

是谁害死了小布托？
如果透过种种表象，我们最终可以发现是美国。
美国从最开始的阿富汗战争培养（资助）了塔利班，为了对付当时的苏联。苏联解体，塔利班成了麻烦，而美国不是采到政治手段化解，坚持以武力解决，从后来的阿富汗战争到伊拉克战争，美国穷兵黩武，但塔利班和基地组织没有得到削弱，反而加强了。为了打击恐怖组织，美国向巴基斯坦施压，不考虑巴国的现状，甚至威胁如果巴基斯坦不配合，要把巴基斯坦炸回石器时代，还不断叫嚣着要亲自派美军进入巴境内打击恐怖组织，激起了巴国人民普遍的反感和反对，巴国人民对美国是憎恶的。
在巴大选来临之际，美国又用其扶植的小布托与巴总统、陆军参谋长分权，逼穆脱下军装，名曰增强民主，其实就是扶植亲美势力，以期保证美国的利益。
小布托是一个悲情的人物，投入美国的怀抱，却成了美国利益的牺牲品。

是谁害死了小布托？

2007-12-28T01:03:00.001-08:00

是谁害死了小布托？
如果透过种种表象，我们最终可以发现是美国。
美国从最开始的阿富汗战争培养了塔利班，为了对付当时的苏联。苏联解体，塔利班成了麻烦，而美国不是采到政治手段化解，坚持以武力解决，从后来的阿富汗战争到伊拉克战争，塔利班没有得到削弱，反而加强了。为了打击恐怖组织，美国向巴基斯坦施压，不考虑巴国的现状，甚至威胁如果巴基斯坦不配合，要把巴基斯坦炸回石器时代，还不断叫嚣着要亲自派美军进入巴境内打击恐怖组织，激起了巴国人民普遍的反感和反对，巴国人民对美国是憎恶的。
现在又扶持了亲美的小布托与巴总统、陆军参谋长分权，名曰民主，其实就是扶植亲美势力，以期保证美国的利益。
小布托是一个悲情的人物，投入美国的怀抱，却成了美国利益的牺牲品。

如何看待巴基斯坦这个国家？

2007-12-27T09:47:00.001-08:00

吉戈／最近巴基斯坦的国内政治引发了国际社会的极大关注，局势复杂多变。如何看待巴基斯坦这个国家，我认为应从几个侧面解剖。
巴基斯坦像六个伊斯兰教国家：像中东的埃及，有一位带有军人背景的总统，埃及总统穆巴拉克过去是军人，而巴基斯坦总统穆沙拉夫不久前还是四星上将和陆军参谋长；巴基斯坦像土耳其，有比较成熟的世俗社会，军队在国家政治中有比较大的影响力和权力；巴基斯坦像伊朗，有比较强大的宗教极端势力和宗教政党，而且宗教政党在国家中的地位也很特殊；巴基斯坦像伊拉克，历来有什叶派和逊尼派的伊斯兰教派冲突；巴基斯坦像阿富汗，有非常强大的部落武装和部落矛盾；巴基斯坦还像沙特阿拉伯，遍地都是宗教学校，宗教教育在许多地区的影响力远远超过世俗教育。
此外，它又与四个非伊斯兰教国家相像。巴基斯坦像印度，百分之七十五的巴基斯坦人接受了印度文化，乌尔都语实际上与印地语同出一源；巴基斯坦像英国，所有的政治制度都是仿照英国的，这大概是旧殖民主义的残余；巴基斯坦像(向)美国，它是美国的非北约盟国，巴基斯坦像(向)中国，与中国的关系可谓是比喜马拉雅山高、比阿拉伯海深全天候战略合作关系。
其次，巴基斯坦国内有五大政治势力和五大矛盾。所谓五大政治势力是指军队势力、宗教势力(宗教政党联盟)、人民党势力(代表信德省大地主阶级的利益和旁遮普省以及其他两省的中产阶级和专业人员利益)、穆盟(谢里夫派)(代表旁遮普大工商资产阶级利益)、穆盟(领袖派)(代表巴基斯坦旁遮普省工商资产阶级利益，是执政党，也是穆沙拉夫总统的主要依靠力量)。巴基斯坦政治基本上是围绕着上述五大政治集团之间的角逐运行和演变的。此外，还有类似像移民运动(代表印度移民)、普什图人民党等小党，这些小党不具备全国影响力。
所谓五大矛盾就是宗俗(宗教与世俗)、军民(军队与民选政府)、朝野(执政党与反对党)、司政(司法与行政)、中地(联邦政府与地方政府或部落)矛盾。往往一个时期，一种矛盾上升为影响全国政治的主要矛盾。比如今年一月和六七月，由于红色清真寺事件，所以宗俗矛盾一度为主要矛盾，三月和八月，由于大法官被软禁后又被平反，所以司政矛盾为主要矛盾，而九月份谢里夫的无功而返，则最集中地体现了朝野和军民矛盾，而现在贝·布托回国遭遇恐怖袭击，则既体现了宗俗矛盾激化，也侧面地反映了朝野矛盾和军民矛盾。
巴基斯坦与美国的关系“从辈分”上讲要低，美国一直对巴基斯坦不信任，既把巴基斯坦当作反恐盟友，同时也把巴基斯坦当作恐怖策源地，而且美国对巴基斯坦有点像“后娘”对继子的味道，一方面利用，另一方面又限制和改造。巴基斯坦一方面要“听美国的教导”，一方面又要“挨美国的棒槌”。
（《新京报》，原标题为《巴基斯坦多重政治矛盾待决》）

中共能跳出七十年兴亡周期圈吗

2007-12-23T01:22:00.000-08:00

2007年7月1日是中国共产党86岁生日，从新中国成立时算起，也已58年，无论从哪方面讲，都是一个老党和执政时间较长的党。我作为一名老党员，抚今追昔，一方面为今日党的事业兴旺发达、国家繁荣昌盛、中国经济和中国模式得到国内外的重视和认可而欢欣鼓舞；另一方面又对党内现在存在的诸多问题，确有一些忧思。本着居安思危精神与君子和而不同的中国优良传统，特真实地把自己的忧思写出来，既供参考，又备他日查阅。

第一，当前党内政治生活的真实情况，和而不同是主流还是同而不和是主流？

和与同的关系，是我国历史上政治生活中的一个关键问题。凡是做到和而不同的，大家心情舒畅，畅所欲言，人际关系比较和谐，经济发展、社会安定、人民安居乐业。反之，一人或一个小集团说了算，不允许有不同意见，人人自危，人际关系紧张，社会生活死气沉沉，实际上是山雨欲来的寂静，是一个闷局，接踵而来的往往是大动乱、大变革。这方面的经验实在太多了。孔子有感于当时的形势，提出“君子和而不同，小人同而不和”，标出君子小人之别，用心可谓良苦。毛泽东在上世纪50年代曾希望我国出现一个新政治局面，特点是：“一个又有集中又有民主，又有纪律又有自由，又有统一意志、又有个人心情舒畅、生动活泼，那样一种政治局面”。他认为这种局面有“利于社会主义革命和社会主义建设，较易于克服困难，较快地建设我国的现代工业和现代农业，党和国家较为巩固，较为能够经受风险”。（毛选五卷456—457）应该说毛主席这种见解与历史上和而不同的论点，在精神上是一致的，是非常好的设想。可惜在毛主席的晚年，他领导了反右派、反右倾等运动特别是十年文化大革命，却又背离上述想法，弄得人人噤若寒蝉，全社会万马齐喑，国民经济到了崩溃边缘，政治上冤狱遍中国，他老人家原先的希望完全破灭，教训实在太沉重。

粉碎“四人帮” 后，我党领导中国，进行了近三十年的改革开放，使党和国家的情况发生了很大变化很大进步，人们的心情变化大，党内和国家政治生活变化更大，这是谁都感觉到的、认可的、拥护的。北京的出租车司机可以与乘客随意谈论朝野大事而毫无顾忌，“谤议于市朝”这一喜人局面竟在今日中国出现了，虽然党对它还没有奖励办法。网上议论更是内容丰富生动活泼。

但是，目前党内在和与同的问题上，究竟进步到什么程度，我以为还是一个应该进一步弄清楚的大问题。形势愈好，我党作为执政党，愈需要清醒。我的看法是，我们的实际生活中，是提不同意见的人得到重用和提拔，还是唯唯诺诺的人得到重用和提拔；是实干的人得到重用和提拔，还是弄虚作假、耍嘴皮子的人得到重用和提拔？我以为这才是最真实的考核干部的尺度。群众中广为流传的“数字出官、官出数字”议论，就是不少干部群众给我们的鉴定。现在一个相当普遍的现象是：人们不讲真话。许多领导干部慨叹：“很难听到真话和不同意见，迎合型干部太多”。下面则慨叹：“讲真话吃亏，不说为佳”。有人反映：现在讲成绩，层层加码，到中央一级成了无限大，完全失真。讲问题和缺点则层层减码，到中央一级仅存空壳，也完全失真。这两个金字塔现象所反映的干部心态不一定十分准确，但也实在太可怕了，其原因更值得我党认真思考。

两种慨叹，一个是想听听不到，一个是想讲不敢讲。本来人们是愿意讲真话的，弄得不敢讲了，根本原因是怕招祸。谁能给他祸呢，当然是各级有权力的人。因此，问题的关键在于各级领导人，能不能听不同意见并择其善者而从之，有不同见解的人能不能受到尊重并受到公平对待。如果社会上因言得祸的事不断发生，当然就没有人讲真话了。粉碎 “四人帮”前，在这个问题上我们有惨痛教训，粉碎“四人帮”后，我们有改进，但不能说已经解决。

一个听不到真话的社会，表明这个社会还是同而没有和。领导听不到真话就是最大的政治问题，说明脱离群众，人们不信任他。我党应该接受教训，并摆脱一切现实的虚假现象，研究群众目前不讲真话和领导听不到真话的现象，找到根本原因，认真解决听真话与讲真话的问题。我希望各级领导干部从自己做起，讲真话，讲到做到，身教重于言教。群众是最有能力区别真话与假话的。“知政失者在草野”，东汉的思想家王充早就认识到这一点。只有上面讲真话办实事，才能换来群众讲真话办真事。 www.6park.com

第二，不少干部中的几股歪风冷了许多群众的心

当前，干部队伍中几股歪风盛行。

一是豪华摆阔风。许多政府的“衙门”和官员宅第，愈来愈豪华气派，也愈来愈脱离群众，引起民怨与民怒。群众称“衙门”集中的街道为腐败一条街，称官员豪宅为贪官营。按照政府规定的标准和干部固定收入，他们不可能建设这样的“衙门”与豪宅，但修成了而且一些贫困地区也这样做了，资金从何而来呢？上级是不管还是管不住呢？这股风看来愈演愈烈，群众的心则愈来愈冷，党政领导的威信愈来愈低。有的群众说，再也看不到“老八路作风”了。这一声叹息包含着无限怀念与无奈，也含着一线希望。

二是迷信风。关于这个问题有不少报道，有的是调查资料，有的是理论上的批评，说得最清楚的是风水师们。一个调查资料说，有近三成的“县处级”干部迷信相面。《求是》杂志论文，则批评少数干部不信马列主义信鬼神。风水师们讲的就具体多了，“县处级以上干部中，相当一部分有风水方面的顾问，有不少人还聘请专职风水师为他规划”，“风水师和官员们的交易是悄然进行的”。“相较于商人，官员们更想念一些‘玄’ 的东西”。为了掩人耳目，风水师们不穿唐装，不留胡子，而是西装革履，打扮成一个推销员模样，出入官府和豪宅。官员不直接出面，有商人代办并买单，当然他们得到的更多。外电报道：“迷信风水现象在中国抬头”，或说：“鬼神迷信在中国抬头”。有报道说，有名的大寨大队，现在有人投资3000万元盖一座庙宇搞旅游。一些干部的迷信风与社会上的迷信风，究竟谁影响了谁，它们反映的是何种内心世界？

三是豪赌风。中国的豪赌已“享誉”世界，他们成了许多国家、地区赌城的常客，我国周边国家、地区都建设专门赌场迎接他们。澳门特区的赌场更是内地豪赌者的佳处，有材料指出，澳门赌场内地赌徒占到93%。官方统计，中国每年流失到国外的赌金达6000亿元，官员输的钱往往都是公款。商人参赌的也大都是官商，真正的民营企业家以创业为主，很少这样干的。这股赌风使中国人在全世界丢尽了脸，群众的愤怒是十分自然的也是应该的。对这股恶风党和政府似乎束手无策。

四是“跑部钱进”风。这已成为潜规则了，下面振振有词。“不跑部就拿不到项目，不用钱就进不了门。跑部钱进是下面的不得已之举，是逼出来的，含着眼泪干的。”送钱已成了一门大学问，神龙见首不见尾，不露痕迹，其妙无穷。比较公开的则是“项目车”是小干部干的，给小单位和个人一个小项目，不用说话就有一辆轿车送上供他使用，油和司机的开支也不用管。在这种潜规则支配下，下面的花样就更多了，风气也就愈来愈坏，上面的管理限制办法，永远跟不上形势。

还有一些风，如公款吃喝风、包二奶风、外逃风等等，就不细说了。

上述种种歪风的总的结果是：我们不少党政机关的办事能力愈来愈低下，出现了所谓的“体制性迟钝症”，处理事件拖拉，往往把一件民意小事情，酿成民怨甚至民怒，成为群体事件，社会安定大受影响。最近发生的两件事就充分说明这一点。一是山西黑砖窑事件。人贩子在河南郑州市等地方抓劳力，通过他们的交通线送到山西各地的黑砖窑，强迫劳动，过着非人生活。此事长期存在，两省的有关部门毫无作为，任其胡行，有的基层单位甚至与他们勾结共同作恶。这里的党政机关的无能已到了何等地步，岂仅是“迟钝症”而已。二是太湖兰藻事件，这是自然现象，完全可以预测到，南京市就有中科院的一个湖泊研究所，对太湖当然十分了解，为什么他们的信息就不能进入省市决策领域？太湖水质关系广大群众生活，当地领导却毫不了解即将发生的严重事故。特别严重的是三江三湖治理已实行多年，为什么还发生这样的事。这两件事太令人震惊并陷入沉思。国家环保部门已明确指出，我国已进入污染高发期。每一个污染源都与当地群众的生产和生活息息相关。高发期的特点及其对周围群众的影响，应早作研究并制定对策，再不能临时被动应付了。

第三，能请群众来监督干部吗？

上述种种歪风在我党我国还不能说处处如此，日日如此，但是若不能及时坚决刹住，不仅会破坏当前的大好形势，如果久拖不决，那就会彻底冷了群众的心，他们必然由怨而怒，势将酿成大祸。群众的耐心不是无限的，我们党的威信也不是天生，更不是一劳永逸的。

现在的问题是，单靠领导机关的力量能否彻底解决这个问题，回答是否定的，无数实践已证明这一点。下面对付上级的监督和检查规律，已弄得清清楚楚，对付办法更是天衣无缝，现在这套监督和检查办法可以说收效甚微。我们处分几个干部可以做到，但改变不了风气，一阵风过后，一切照旧。群众早就总结出一条检查规律： “河水突然清了，表明领导要来检查，河水又污浊了，表明领导走了。”领导得到的是假象，但误以为真，十分高兴。群众却认为下级玩弄领导又成功了。受苦受害的是当地群众，淮河沿岸现在出现不少癌症村，就是最明显的证据。他们既看笑话，对官僚主义的无能，心中怨气和愤怒也随之而来。这种情况是相当普遍的，许多报道都反映了这个情况，下面传说的笑话就更多了。

中国的官场是一个大染缸，有几千年封建社会的传统，积淀太深厚，是一股强大的传统力量，严重影响着我们党。对干部个人来说，这种坏传统坏作风很舒服自在，是很难抗拒的。我们如果没有强大的监督力量制度力量，很难解决大染缸这个大问题。

要彻底解决干部中存在的上述种种歪风，唯一办法就是请群众来批评、监督。他们的监督是全天候的，无时无处不在，谁也无法躲藏。干部干坏事总要伤害一些群众，受伤害的人当然愿意揭发，只要领导支持加以保护和奖励，举报和揭发就可以形成风气和制度，一切歪风就无处隐匿，久之就自然刹住了。如果监督还包括各级领导的决策和工作上的失误，以及一切形式主义的做法，其作用就更大。我以为必须包括这些内容。

请不请群众来监督干部、监督党和政府的决策和工作，是考验我党领导层是否决心依靠群众改变作风和改进工作、发展大好形势的试金石。

请群众来监督干部和我们的工作，要有一套办法和具体制度，要明确规定群众享有的权力，有一定的运行方式，还应有对干部打击报复的处分办法，所有这些都得认真执行。实行起来当然有困难，但不实行这一套，我们遇到的不仅是困难而是灾难。

群众路线，是我们的传家宝，请群众来监督干部和各方面的工作，必将得到广大群众的拥护，这个力量是巨大的，一定会成功，效果一定会很好。

第四、怎样跳出历史周期律

毛泽东和黄炎培关于这个问题的著名对话，是大家熟知的。黄提出中国历史上的封建王朝都未能逃脱“其兴也焉，其亡也忽焉”这一历史周期律的支配，希望中共能找出一条新路来跳出这个周期律。毛泽东回答说已找到了，新路就是民主，让人民来监督政府，政府才不敢松懈，人人起来负责，才不会人亡政息。黄深表赞同，这是1945年7月发生的事情。据说，1949年我军接管北平时，傅作义也提出类似的问题。他说，国民党执政20年就腐化了，结果被人民打倒，共产党执政后，30年、40年后会不会也腐化？（薄一波《若干重大决策与事件的回顾》上册P157）可见，这个历史周期律问题是人们普遍关心的问题，任何执政党都要遇到和解决的问题。

我以为可以从国内经验和国际经验来探索和思考，寻找跳出这个周期圈的办法，特别是怎样实行毛泽东提出的办法。

从国内经验讲，人们关心历史上三个黄金时代及其以后的变化。第一个黄金时代，史称文景之治包括汉武帝的开拓疆域。从文帝开始到武帝末年共94年，之后逐渐衰败，最后是王莽专权和称帝。第二个黄金时代，史称贞观之治直到开元之治共114年，如果算到安史之乱则129年。之后唐朝进入衰败期直到灭亡。第三个黄金时代是清初的康、雍、乾三朝共133年。之后就是内忧外患频繁，虽然消灭了太平天国运动，也未中兴起来，末期的“戊戌变法”更遭到镇压实行不了，最后被辛亥革命推翻。为什么黄金时代之后就是衰败或大乱（如唐朝）是一个值得研究的大问题。我国现在的形势可说也处于黄金时代，但我国的经济高速增长还能维持多久，未来前景怎样，也已是今日人们思考和议论的话题，各种观点都有。从整个中国历史看，黄金时代少而且较为短暂，动乱时代则较多而长，这个问题也值得深思。

从国际经验看，有人提出70年现象问题。指出墨西哥的革命制度党，在上世纪五六十年代曾被世人誉为北大西洋的民主模式，执政71年后失去政权。苏联共产党执政72年后解散，苏联也随之解体。似乎 70年是一个坎。另外，中国国民党在连续执政70年后也失去政权。上述三党失去政权各有自己的具体原因，但脱离群众、不顾群众疾苦，不能妥善处理各种社会问题，内部腐化堕落等等，似乎又是共同的。还是唐朝杜牧在《阿房宫赋》一文中提出的论点：“灭六国者，六国也，非秦也。族秦者，秦也，非天下人也。”就是说统治阶级自己打倒了自己。所谓七十年坎是现象，是长期执政的党放弃自我管束和改造，许多社会问题、环境问题不能解决，群众的实际困难不能解决，统治集团和广大官员生活优裕和腐败盛行。群众无法忍受只能另找他人来帮助自己保护自己，也就是我们常讲的官逼民反。责任在官而不在民。不是民弃官，首先是官弃民。

想通了，解决办法其实十分简单，因为真理总是简单明了的。执政党要做到，一方面实行党内民主，定期改选领导集体，让有作为而清廉的人来领导，解决党内老化、腐化问题。另一方面真正实行政治民主，请人民来监督执政党和政府的干部。两者结合，上述种种问题就能彻底解决。也就是毛泽东对黄炎培所说的实行民主的办法。现在要弄清的问题是：毛泽东为什么说的好，但执政后不但没有实行民主，而且反其道而行之。我们党执政快60年了，直到今日，这党内党外民主，也还实行的不好，没有完全执行。难点究竟在哪里？唐太宗与魏徵的故事最能说明问题。接受批评能防止错误发生，但唐太宗有时也很难受，甚至想杀这个田舍翁。只愿自己说了算的统治者，当然不愿意有人监督他。这就是英明的君主与昏聩君主的区别所在，结局也不大相同。现在是人民当家作主的时代，我们自称是人民公仆，为人民服务，对群众监督总应该有新的认识、新的态度。要为人民服务，又不愿听人民的意见和接受人民的监督，岂不是自相矛盾。结论应是：长期执政的政党要想继续执政打破70年这道坎，必须解决自身腐化和脱离群众问题，除自身不断改革外，唯一有效办法就是严格的强有力的群众监督，这个婆婆非要不可。官员们的不舒服、不自在是很自然的，换来的是群众拥护和社会稳定、和谐，国运昌盛，全国人民大自在、大满意、大舒服。值得，完全值得。

（作者石山，我国著名生态经济学者，曾任中国生态经济学会副理事长，国务院农村发展研究中心原顾问）

jQuery中文入门教程_译自Getting Started with jQuery

2007-12-03T02:15:00.001-08:00

jQuery中文入门指南，翻译加实例，jQuery的起点教程

中文版译者：Keel

此文以实例为基础一步步说明了jQuery的工作方式。现以中文翻译（添加我的补充说明）如下。如有相关意见或建议请麻烦到我的 BLOG 写个回复或者 EMAIL 告知。

英文原版：http://jquery.bassistance.de/jquery-getting-started.html ，感谢原文作者 Jörn Zaefferer

本文发布已征求原作者同意。

另外我认为在学习过程中,有两个API文档你要打开随时查看:

http://jquery.com/api/

http://visualjquery.com/

以下部分为原文翻译:

jQuery入门指南教程

这个指南是一个对jQuery库的说明，要求读者了解HTML(DOM)和CSS的一些常识。它包括了一个简单的Hello World的例子，选择器和事件基础，AJAX、FX的用法，以及如何制作jQuery的插件。这个指南包括了很多代码，你可以copy它们，并试着修改它们，看看产生的效果。

内容提要

安装

Hello jQuery

Find me:使用选择器和事件

Rate me:使用AJAX

Animate me(让我生动起来):使用FX

Sort me(将我有序化):使用tablesorter插件(表格排序)

Plug me:制作您自己的插件

Next steps(下一步)

安装

一开始,我们需要一个jQuery的库,最新的下载可以到这里找到。这个指南提供一个基本包含实例的包供下载.

下载：jQuery Starterkit

(译者Keel注:一定要下载这个包，光看文章不实践肯定是不行的。)

下载后解压缩，然后用你最喜欢的文本编辑器打开starterkit.html和custom.js这两个文件。(译者Keel注:这两个就是例子文件,所有的例子都用这两个例子作出,custom.js写jQuery代码,starterkit.html观察效果.建议用editPlus打开)

现在,我们就已经做好了一切准备来进行这个著名的"Hello world"例子.

本章的相关链接:

Starterkit

jQuery Downloads

Hello jQuery

在做所有事情之前,我们要让jQuery读取和处理文档的DOM,必须尽可能快地在DOM载入后开始执行事件,所以,我们用一个ready事件作为处理HTML文档的开始.看看我们打开的custom.js这个文件,里面已经准备好了:
$(document).ready(function() {
	// do stuff when DOM is ready
});
放一个简单的alert事件在需要等DOM完成载入,所以我们把任务稍稍变复杂一点:在点击任何一个链接时显示一个alert.
$(document).ready(function() {
	$("a").click(function() {
		alert("Hello world!");
	});
});
这样在你点击页面的一个链接时都会触发这个"Hello world"的提示。

(译者Keel注:请照此代码修改custom.js并保存,然后用浏览器打开starterkit.html观察效果。)

让我们看一下这些修改是什么含义。$("a") 是一个jQuery选择器(selector),在这里，它选择所有的a标签（译者Keel注：即<a></a>），$号是 jQuery “类”(jQuery "class")的一个别称，因此$()构造了一个新的jQuery 对象(jQuery object)。函数 click() 是这个jQuery对象的一个方法，它绑定了一个单击事件到所有选中的标签(这里是所有的a标签),并在事件触发时执行了它所提供的alert方法.

这里有一个拟行相似功能的代码:
<a href="#" onclick="alert('Hello world')">Link</a>
不同之处很明显,用jQuery不需要在每个a标签上写onclick事件,所以我们拥有了一个整洁的结构文档(HTML)和一个行为文档(JS),达到了将结构与行为分开的目的,就像我们使用CSS追求的一样.

下面我们会更多地了解到选择器与事件.

本章的相关链接:

jQuery Base

jQuery Expressions

jQuery Basic Events

Find me:使用选择器和事件

jQuery提供两种方式来选择html的elements，第一种是用CSS和Xpath选择器联合起来形成一个字符串来传送到jQuery的构造器（如：$("div > ul a")）；第二种是用jQuery对象的几个methods(方法)。这两种方式还可以联合起来混合使用。

为了测试一下这些选择器，我们来试着在我们starterkit.html中选择并修改第一个ordered list.

一开始，我们需要选择这个list本身，这个list有一个ID叫“orderedlist”，通常的javascript写法是document.getElementById("orderedlist").在jQuery中，我们这样做：
$(document).ready(function() {
	$("#orderedlist").addClass("red");
});
这里将starterkit中的一个CSS样式red附加到了orderedlist上(译者Keel注：参考测试包中的css目录下的core.css，其中定义了red样式)。因此，在你刷新了starterkit.html后，你将会看到第一个有序列表(ordered list )背景色变成了红色，而第二个有序列表没有变化.

现在，让我们添加一些新的样式到list的子节点.
$(document).ready(function() {
	$("#orderedlist > li").addClass("blue");
});
这样，所有orderedlist中的li都附加了样式"blue"。

现在我们再做个复杂一点的，当把鼠标放在li对象上面和移开时进行样式切换，但只在list的最后一个element上生效。
$(document).ready(function() {
	$("#orderedlist li:last").hover(function() {
		$(this).addClass("green");
	}, function() {
		$(this).removeClass("green");
	});
});
还有大量的类似的CSS和XPath例子，更多的例子和列表可以在这里找到。（译者Keel注：入门看此文，修行在个人，要想在入门之后懂更多，所以这段话的几个链接迟早是要必看的！不会又要翻译吧...^_^!）

每一个onXXX事件都有效，如onclick,onchange,onsubmit等，都有jQuery等价表示方法（译者Keel注：jQuery不喜欢onXXX，所以都改成了XXX，去掉了on）。其他的一些事件，如ready和hover,也提供了相应的方法。

你可以在Visual jQuery找到全部的事件列表，在Events栏目下.

用这些选择器和事件你已经可以做很多的事情了，但这里有一个更强的好东东！
$(document).ready(function() {
	$("#orderedlist").find("li").each(function(i) {
		$(this).html( $(this).html() + " BAM! " + i );
	});
});
find() 让你在已经选择的element中作条件查找,因此 $("#orderedlist).find("li") 就像 $("#orderedlist li")一样。each()方法迭代了所有的li，并可以在此基础上作更多的处理。大部分的方法,如addClass(), 都可以用它们自己的 each() 。在这个例子中, html()用来获取每个li的html文本, 追加一些文字，并将之设置为li的html文本。（译者Keel注：从这个例子可以看到.html()方法是获取对象的html代码，而.html('xxx')是设置'xxx'为对象的html代码）

另一个经常碰到的任务是在没有被jQuery覆盖的DOM元素上call一些方法，想像一个在你用AJAX方式成功提交后的reset：
$(document).ready(function() {
	// use this to reset a single form
	$("#reset").click(function() {
		$("#form")[0].reset();
	});
});
（译者Keel注：这里作者将form的id也写成了form，源文件有<form id="form">，这是非常不好的写法，你可以将这个ID改成form1或者testForm，然后用$("#form1")或者$("#testForm")来表示它，再进行测试。）

这个代码选择了所有ID为"form"的元素，并在其第一个上call了一个reset()。如果你有一个以上的form，你可以这样做：
$(document).ready(function() {
	// use this to reset several forms at once
	$("#reset").click(function() {
		$("form").each(function() {
			this.reset();
		});
	});
});
（译者Keel注：请注意一定要亲自将这些代码写在custom.js中并在starterkit.html上测试效果才能有所体会！必要时要观察starterkit.html的html代码）

这样你在点击Reset链接后，就选择了文档中所有的form元素，并对它们都执行了一次reset()。

还有一个你可能要面对的问题是不希望某些特定的元素被选择。jQuery 提供了filter() 和not() 方法来解决这个问题。 filter()以过滤表达式来减少不符合的被选择项, not()则用来取消所有符合过滤表达式的被选择项. 考虑一个无序的list，你想要选择所有的没有ul子元素的li元素。
$(document).ready(function() {
	$("li").not("[ul]").css("border", "1px solid black");
});
这个代码选择了所有的li元素，然后去除了没有ul子元素的li元素。刷新浏览器后，所有的li元素都有了一个边框，只有ul子元素的那个li元素例外。

（译者Keel注：请注意体会方便之极的css()方法，并再次提醒请务必实际测试观察效果，比方说换个CSS样式呢？再加一个CSS样式呢？像这样：$("li").not("[ul]").css("border", "1px solid black").css("color","red");）

上面代码中的[expression] 语法是从XPath而来，可以在子元素和属性(elements and attributes)上用作过滤器，比如你可能想选择所有的带有name属性的链接:
$(document).ready(function() {
	$("a[@name]").background("#eee");
});
这个代码给所有带有name属性的链接加了一个背景色。（译者Keel注：这个颜色太不明显了，建议写成$("a[@name]").background("red");）

更常见的情况是以name来选择链接，你可能需要选择一个有特点href属性的链接，这在不同的浏览器下对href的理解可能会不一致，所以我们的部分匹配("*=")的方式来代替完全匹配("=")：
$(document).ready(function() {
	$("a[@href*=/content/gallery]").click(function() {
		// do something with all links that point somewhere to /content/gallery
	});
});
到现在为止，选择器都用来选择子元素或者是过滤元素。另外还有一种情况是选择上一个或者下一个元素，比如一个FAQ的页面，答案首先会隐藏，当问题点击时，答案显示出来，jQuery代码如下：
$(document).ready(function() {
	$('#faq').find('dd').hide().end().find('dt').click(function() {
         var answer = $(this).next();
         if (answer.is(':visible')) {
             answer.slideUp();
         } else {
             answer.slideDown();
         }
     });
});
这里我们用了一些链式表达法来减少代码量，而且看上去更直观更容易理解。像'#faq' 只选择了一次，利用end()方法，第一次find()方法会结束(undone)，所以我们可以接着在后面继续find('dt')，而不需要再写$('#faq').find('dt')。

在点击事件中的，我们用 $(this).next() 来找到dt下面紧接的一个dd元素，这让我们可以快速地选择在被点击问题下面的答案。

（译者Keel注：这个例子真是太酷了，FAQ中的答案可以收缩！从利用next()的思路到实现这些效果都有很多地方需要我们消化，注意 if (answer.is(':visible'))用法，注意answer.slideUp();不懂的地方赶紧查我在最开始提到的两个必看API文档）

除了选择同级别的元素外，你也可以选择父级的元素。可能你想在用户鼠标移到文章某段的某个链接时，它的父级元素--也就是文章的这一段突出显示，试试这个：
$(document).ready(function() {
	$("a").hover(function() {
		$(this).parents("p").addClass("highlight");
	}, function() {
		$(this).parents("p").removeClass("highlight");
	});
});
测试效果可以看到，移到文章某段的链接时，它所在的段全用上highlight样式，移走之后又恢复原样。

（译者Keel注：highlight是core.css中定义的样式，你也可以改变它，注意这里有第二个function()这是hover方法的特点，请在API文档中查阅hover，上面也有例子说明）

在我们继续之前我们先来看看这一步： jQuery会让代码变得更短从而更容易理解和维护，下面是$(document).ready(callback)的缩写法：
$(function() {
	// code to execute when the DOM is ready
});
应用到我们的Hello world例子中，可以这样:
$(function() {
	$("a").click(function() {
		alert("Hello world!");
	});
});
现在，我们手上有了这些基础的知识，我们可以更进一步的探索其它方面的东西，就从AJAX开始！

本章的相关链接:

jQuery API documentation

Visual jQuery - A categorized browsable API documentation

jQuery Expressions: CSS

jQuery Expressions: XPath

jQuery Expressions: Custom

jQuery Special Events

jQuery DOM Traversing

Rate me:使用AJAX

在这一部分我们写了一个小小的AJAX应用，它能够rate一些东西（译Keel注：就是对某些东西投票），就像在youtube.com上面看到的一样。

首先我们需要一些服务器端代码，这个例子中用到了一个PHP文件，读取rating参数然后返回rating总数和平均数。看一下rate.php代码.

虽然这些例子也可以不使用AJAX来实现，但显示我们不会那么做，我们用jQuery生成一个DIV容器，ID是"rating".
$(document).ready(function() {
	// generate markup
	var ratingMarkup = ["Please rate: "];
	for(var i=1; i <= 5; i++) {
		ratingMarkup[ratingMarkup.length] = "<a href='#'>" + i + "</a> ";
	}
	// add markup to container and applier click handlers to anchors
	$("#rating").append( ratingMarkup.join('') ).find("a").click(function(e) {
		e.preventDefault();
		// send requests
		$.post("rate.php", {rating: $(this).html()}, function(xml) {
			// format result
			var result = [
				"Thanks for rating, current average: ",
				$("average", xml).text(),
				", number of votes: ",
				$("count", xml).text()
			];
			// output result
			$("#rating").html(result.join(''));
		} );
	});
});
这段代码生成了5个链接，并将它们追加到id为"rating"容器中，当其中一个链接被点击时，该链接标明的分数就会以rating参数形式发送到rate.php，然后，结果将以XML形式会从服务器端传回来，添加到容器中，替代这些链接。

如果你没有一个安装过PHP的webserver，你可以看看这个在线的例子.

不使用javascript实现的例子可以访问 softonic.de 点击 "Kurz bewerten!"

更多的AJAX方法可以从这里找到，或者看看API文档下面的AJAX filed under AJAX.

（译者Keel注：这个在线实例从国内访问还是比较慢的，点击后要等一会儿才能看到结果，可以考虑对它进行修改，比如加上loading，投票后加上再投票的返回链接等。此外，这个例子中还是有很多需要进一步消化的地方，看不懂的地方请参考API文档。）

一个在使用AJAX载入内容时经常发生的问题是：当载入一个事件句柄到一个HTML文档时，还需要在载入内容上应用这些事件，你不得不在内容加载完成后应用这些事件句柄，为了防止代码重复执行，你可能用到如下一个function:
// lets use the shortcut
$(function() {
	var addClickHandlers = function() {
		$("a.clickMeToLoadContent").click(function() {
			$("#target").load(this.href, addClickHandlers);
		});
	};
	addClickHandlers();
});
现在，addClickHandlers只在DOM载入完成后执行一次，这是在用户每次点击具有clickMeToLoadContent 这个样式的链接并且内容加载完成后.

请注意addClickHandlers函数是作为一个局部变量定义的，而不是全局变量(如：function addClickHandlers() {...})，这样做是为了防止与其他的全局变量或者函数相冲突.

另一个常见的问题是关于回调(callback)的参数。你可以通过一个额外的参数指定回调的方法，简单的办法是将这个回调方法包含在一个其它的function中:
// get some data
var foobar = ...;
// specify handler, it needs data as a paramter
var handler = function(data) {
  ...
};
// add click handler and pass foobar!
$('a').click( function(event) { handler(foobar); } );

// if you need the context of the original handler, use apply:
$('a').click( function(event) { handler.apply(this, [foobar]); } );
用到简单的AJAX后，我们可以认为已经非常之“web2.0”了，但是到现在为止，我们还缺少一些酷炫的效果。下一节将会谈到这些效果.

本章的相关链接:

jQuery AJAX Module

jQuery API: Contains description and examples for append and all other jQuery methods

ThickBox: A jQuery plugin that uses jQuery to enhance the famous lightbox

Animate me(让我生动起来):使用FX

一些动态的效果可以使用 show() 和 hide()来表现:
$(document).ready(function() {
	$("a").toggle(function() {
		$(".stuff").hide('slow');
	}, function() {
		$(".stuff").show('fast');
	});
});
你可以与 animate()联合起来创建一些效果,如一个带渐显的滑动效果:
$(document).ready(function() {
	$("a").toggle(function() {
		$(".stuff").animate({
			height: 'hide',
			opacity: 'hide'
		}, 'slow');
	}, function() {
		$(".stuff").animate({
			height: 'show',
			opacity: 'show'
		}, 'slow');
	});
});
很多不错的效果可以访问interface plugin collection. 这个站点提供了很多demos和文档

这些效果插件是位于jQuery插件列表的前面的，当然也有很多其他的插件，比如我们下一章讲到的表格排序插件。

本章的相关链接:

jQuery FX Module

Interface plugin

Sort me(将我有序化):使用tablesorter插件(表格排序)

这个表格排序插件能让我们在客户端按某一列进行排序，引入jQuery和这个插件的js文件，然后告诉插件你想要哪个表格拥有排序功能。

要测试这个例子，先在starterkit.html中加上像下面这一行的代码：
<script src="lib/jquery.tablesorter.js" type="text/javascript"></script>
然后可以这样调用不着:
$(document).ready(function() {
	$("#large").tableSorter();
});
现在点击表格的第一行head区域，你可以看到排序的效果，再次点击会按倒过来的顺序进行排列。

这个表格还可以加一些突出显示的效果，我们可以做这样一个隔行背景色（斑马线）效果:
$(document).ready(function() {
	$("#large").tableSorter({
		stripingRowClass: ['odd','even'],	// Class names for striping supplyed as a array.
		stripRowsOnStartUp: true		// Strip rows on tableSorter init.
	});
});
关于这个插件的更多例子和文档可以在 tablesorter首页找到.

几乎所有的特件都是这样用的:先include插件的js文件,然后在某些元素上使用插件定义的方法,当然也有一些参数选项是可以配置的

经常更新的插件列表可以从jQuery官方站 on the jQuery site找到.

当你更经常地使用jQuery时,你会发现将你自己的代码打包成插件是很有用处的,它能方便地让你的公司或者其他人进行重用.下一章我们将谈到如何构建一个自己的插件.

本章的相关链接:

Plugins for jQuery

Tablesorter Plugin

Plug me:制作自己的插件

写一个自己的jQuery插件是非常容易的,如果你按照下面的原则来做,可以让其他人也容易地结合使用你的插件.
为你的插件取一个名字,在这个例子里面我们叫它"foobar".

创建一个像这样的文件:jquery.[yourpluginname].js,比如我们创建一个jquery.foobar.js
创建一个或更多的插件方法,使用继承jQuery对象的方式,如:
jQuery.fn.foobar = function() {
	// do something
};
可选的:创建一个用于帮助说明的函数,如:
jQuery.fooBar = {
	height: 5,
	calculateBar = function() { ... },
	checkDependencies = function() { ... }
};
你现在可以在你的插件中使用这些帮助函数了:
jQuery.fn.foobar = function() {
	// do something
	jQuery.foobar.checkDependencies(value);
	// do something else
};
可选的l:创建一个默认的初始参数配置,这些配置也可以由用户自行设定,如:
jQuery.fn.foobar = function(options) {
	var settings = {
		value: 5,
		name: "pete",
		bar: 655
	};
	if(options) {
		jQuery.extend(settings, options);
	}
};
现在可以无需做任何配置地使用插件了,默认的参数在此时生效:
$("...").foobar();
或者加入这些参数定义:
$("...").foobar({
	value: 123,
	bar: 9
});
如果你release你的插件, 你还应该提供一些例子和文档,大部分的插件都具备这些良好的参考文档.

现在你应该有了写一个插件的基础,让我们试着用这些知识写一个自己的插件.

很多人试着控制所有的radio或者checkbox是否被选中,比如:
$("input[@type='checkbox']").each(function() {
	this.checked = true;
	// or, to uncheck
	this.checked = false;
	// or, to toggle
	this.checked = !this.checked;
});
无论何时候，当你的代码出现each时，你应该重写上面的代码来构造一个插件,很直接地:
$.fn.check = function() {
	return this.each(function() {
		this.checked = true;
	});
};
这个插件现在可以这样用:
$("input[@type='checkbox']").check();
现在你应该还可以写出uncheck()和toggleCheck()了.但是先停一下,让我们的插件接收一些参数.
$.fn.check = function(mode) {
	var mode = mode || 'on'; // if mode is undefined, use 'on' as default
	return this.each(function() {
		switch(mode) {
		case 'on':
			this.checked = true;
			break;
		case 'off':
			this.checked = false;
			break;
		case 'toggle':
			this.checked = !this.checked;
			break;
		}
	});
};
这里我们设置了默认的参数,所以将"on"参数省略也是可以的,当然也可以加上"on","off", 或 "toggle",如:
$("input[@type='checkbox']").check();
$("input[@type='checkbox']").check('on');
$("input[@type='checkbox']").check('off');
$("input[@type='checkbox']").check('toggle');
如果有多于一个的参数设置会稍稍有点复杂,在使用时如果只想设置第二个参数,则要在第一个参数位置写入null.

从上一章的tablesorter插件用法我们可以看到,既可以省略所有参数来使用或者通过一个 key/value 对来重新设置每个参数.

作为一个练习,你可以试着将第四章的功能重写为一个插件.这个插件的骨架应该是像这样的:
$.fn.rateMe = function(options) {
	var container = this; // instead of selecting a static container with $("#rating"), we now use the jQuery context
	
	var settings = {
		url: "rate.php"
		// put more defaults here
		// remember to put a comma (",") after each pair, but not after the last one!
	};
	
	if(options) { // check if options are present before extending the settings
		$.extend(settings, options);
	}
	
	// ...
	// rest of the code
	// ...
	
	return this; // if possible, return "this" to not break the chain
});
Next steps(下一步)

如果你想做更好的javascript开发,建议你使用一个叫 FireBug的firefox插件. 它提供了断点调试(比alert强多了)、观察DOM变化等很多漂亮的功能

如果你还有未解决的问题，或者新的想法与建议，你可以使用jQuery的邮件列表 jQuery mailing list.

关于这个指南的任何事情，你可以写mail给作者或者发表评论在他的日志：blog.

关于这个指南的翻译任何事情，你可以写mail给我或者发表评论在我的日志：blog.

还有什么...

大大感谢John Resig创造了这么好的library! 感谢jQuery community 为John提供了如此多的咖啡和其他的一切!

© 2006, Jörn Zaefferer - last update: 2006-09-12

中文版翻译:Keel - 最后更新: 2006-12-13

jQuery中文入门教程_译自Getting Started with jQuery

Google Web APIs 参考中文版

2007-11-27T07:05:00.001-08:00

内容

1. 概况

1.1 搜索请求
 1.2 缓冲请求
 1.3 拼写请求

2. 搜索请求格式

2.1 搜索参数
 2.2 查询条件
 2.3 自动过滤
 2.4 约束
 2.5 输入输出编码
 2.6 安全搜索
 2.7 局限性

3. 搜索结果格式

3.1 搜索响应
 3.2 结果元素
 3.3 目录种类

1. 概况
Back to top

这篇文档详细解释了Google Web APIs函数语法的调用,你可以方便的使用Google Web APIs服务。在文档中，你会学习到以下几个方面:

Google的查询语句是怎么工作的。

怎样约束你的查询去获得Google索引中的一部分，例如特殊的语言或国家。

怎样解释通过Google Web APIs服务反馈的搜索结果信息。

你也可以通过Google Web APIs开发者工具包文档来帮助你:

GoogleSearch.wsdl - 描述Google Web APIs SOAP 接口的WSDL文件.

soap-samples/ - SOAP 消息和响应的范例.

javadoc/index.html - Java 库范例文档.

这是一个 beta版的文档. 如果你有任何意见,或者发现了错误，或者有疑问，请联系api-support@google.com .

1.1 搜索请求
Back to top

搜索请求会提交一个查询字符串和一组参数给Google Web APIs服务，并返回一组搜索结果。搜索结果来源于超过二十亿网页的Google索引。

涉及搜索请求的详细交互过程包含在这个文档的搜索请求格式和搜索结果格式章节中。

1.2 缓冲请求
Back to top

缓冲请求会提交一个URL给Google Web APIs服务，并返回Google爬虫程序最后访问的页面的URL内容（如果是可用的话）。

请注意：Google既不是缓冲页面的作者，也不对那些内容负责。

缓冲页面的返回类型是base64编码文本.

1.3 拼写请求
Back to top

拼写请求会提交一个查询给Google Web APIs服务，并为查询返回一个拼写修正的建议（如果是可用的话）。拼写修正模仿，其行为就像在Google网站上查找一样。

拼写请求服从和其他查询请求相同的查询字符串的限制。（输入字符串最大为2048字节和10个单词）

拼写请求返回的类型是一个文本字符串。

2. 搜索请求格式
Back to top

2.1 搜索参数
Back to top

这个表格列出了所有的合法的名称和对应的值。这些名称和值能够用于一个搜索请求中，并描述了这些参数将怎样修改搜索结果。

名称

描述

key

由Google提供的，这是你访问Google服务所必需的。Google使用key来验证和记录。

q

(详见查询条件章节中的查询语法。)

start

基于零的第一个期望的搜索结果的索引.

maxResults

每次期望查询结果数，最大查询值为10。
注意: 如果你的查询结果没有更多的匹配项，真实的查询结果数可能小于你的请求数。

filter

激活或抑制自动结果过滤，隐藏非常相似的结果和所有来自相同网站主机的结果。过滤往往是改进终端用户在Google上的使用体验。但是对于你（程序员）的应用程序来说，你最好把这个功能关了。(详见自动过滤章节)

restrict

限定在Google Web索引子集的搜索, 例如限定在一个叫'乌克兰'的国家中或者限定在'Linux'主题中 (详见约束章节.)

safeSearch
能够在搜索结果中过滤成人内容的一个布尔值. 详见安全搜索章节.

lr

语言限定- 限定在一种或多种语言的范围内的搜索.

ie

输入编码 - Google已经不赞成大家使用这个这个参数了，而且这个参数已经被忽视了。所有对API请求都必须是UTF-8编码。 (详见输入和输出编码章节)

oe

输出编码 - Google已经不赞成大家使用这个这个参数了，而且这个参数已经被忽视了。所有对API请求都必须是UTF-8编码。 (详见输入和输出编码章节)

2.2 查询条件 - <q>
Back to top

默认搜索

默认情况下, Google只返回所有符合那些字符串查询条件的页面。不必在查询条件中写逻辑关系'AND'。记住，查询条件的顺序会影响到搜索结果。

忽略的单词(stop words)

Google 忽略最普通的单词和字符，例如：'where' 和 'how' 以及单个的数字和字母。把最普通的单词忽略掉被称为“忽略的单词”(stop words)。

如果你想阻止Google把某些单词忽略掉，可以通过加双引号来解决，例如'to be or not to be'这个短语。

特殊字符

通常，所有非字母字符在搜索中会被当作分隔符来处理。

但以下情况除外: 双引号('), 加号(+), 减号或连字符(-), 以及＆符号(&).

＆符号(&) 会被当作另一个包含在查询词条中字符来处理。这个特例字符符合以下章节列出的搜索特性。

特殊查询词条

Google支持一些特殊的查询词条的使用，允许用户或搜索管理者去访问Google搜索引擎的附加功能。

特殊查询功能

查询范例

描述

包含查询词条
Star Wars Episode +I

如果一个普通的单词是你搜索所必需的，你就在这个单词前放上'+'号。

排除查询词条
bass -music
你可以在那个要排除的单词前放上'-'号，这样就可以在搜索结果中去除这个单词。

短语搜索
'yellow pages'

如果要搜索一个完整的短语，可以通过加上双引号或用连字符连接这些单词来完成。词组用这种方法标注，在搜索结果中就会显示在一起，就像你输入的那样。

注意: 在一个短语中，你可能需要用'+'号来强制将普通的单词连接起来。

布尔或（OR）搜索
vacation london OR paris
Google搜索支持'OR'布尔操作，用大写OR来连接词条A和B，反馈的页面将既包含A又包含B。

网站限定搜索
admission site:www.stanford.edu

如果想要搜索的网站是你知道的那个网站，但是不确定是否有需要的信息在那个网站中，你能用google来指定只在这个网站中搜索。

搜索时，在查询词条后跟'site:' 然后写上主机名。

注意:排除操作符('-')号可运用到查询条件中,它所起到的作用是把某些网站从搜索描述中排除出去。
注意: 每次查询只支持一个site:

日期限定搜索
Star Wars daterange:2452122-2452234
如果你想限定搜索到的结果是在一个特殊的日期范围内发布的，那么你可以用 'daterange: '查询条件来完成它。 'daterange:' 查询条件必须用以下格式:

daterange:<start_date>-<end date>

其中

<start_date> =开始的时间（公历）
<end_date> = 结束的时间（公历）

公历日期是从公元前4713年1月1日开始计算的天数。例如, 公历2001年8月1日天数为 2452122。

标题搜索(term)
intitle:Google search
如果你用'intitle:'来作为查询条件, Google搜索结果会限定在标题中。注意在 'intitle:'和查询的单词之间没有空格。

注意: 将 'intitle:'放在每个你查询的单词前就等于将'allintitle:'放在你的查询条件前。

标题搜索(all)
allintitle: Google search
在查询条件前用 'allintitle:'，将限定其结果来自于在标题中包含所有查询条件的网站。

URL 搜索 (term)
inurl:Google search
如果你用 'inurl:'来作为查询条件 , Google 搜索结果会限定在URL中。注意在 'inurl:' 和查询的单词之间没有空格。

注意: 'inurl:' 只作用在查询单词上 , 不作用在URL结构上。特别是, 它会忽略标点符号，并忽略只用一个单词写在 'inurl:'后面的情况. 查询多个单词在URL中, 应为每一个单词都使用'inurl:'符号。

注意: 将'inurl:'放在需要查询的每一个单词前就等于将'allinurl:' 放在需要查询的条件前

URL 搜索 (all)
allinurl: Google search
在查询条件前用'allinurl:' 将限定其结果来自于在URL中包含所有查询条件的网站。

注意: 'allinurl:'只作用在 查询单词上 , 不作用在URL结构上。特别是,它会忽略标点符号. 因此, 'allinurl: foo/bar' 将限定在包含具有'foo'和'bar'的URL的结果集中，但不会将包含字符串'foo/bar'（包括斜杠）的URL作为结果集，或者将其作为特殊的词序。目前没有方法强制这些约束。

纯文本搜索 (all)
allintext: Google search
在查询条件前用 'allintext:' 来限定那些满足所有查询单词的纯文本的结果，忽略链接,URL,和标题匹配。

纯链接搜索 (all)
allinlinks: Google search
在查询条件前用 'allinlinks:'来限定那些满足所有查询单词，包含URL链接的页面。

文件类型过滤
Google filetype:doc OR filetype:pdf
前缀'filetype:' 前缀'filetype:'会立即反馈只包含指定扩展名的文档的查询结果。注意：在'filetype:'和指定的扩展名之间没有空格。

注意: 通过增加更多的'filetype:' 来搜索出多种类型的文件。

文件类型排除
Google -filetype:doc -filetype:pdf
前缀'-filetype:'将排除掉指定扩展名的文档。注意：在'-filetype:' 和指定的扩展名之间没有空格。

注意:通过增加更多的'-filetype:'来排除掉多种类型的文件。

网页文件信息
info:www.google.com
前缀'info:' 会根据指定的URL来返回单个结果（如果这个URL在索引中存在）。

注意:当使用这个特殊的查询条件时，不能使用其他指定的查询条件。

主页链接
link:www.google.com
前缀'link:' 列出连接到指定网页的所有网页。注意：在'link:' 和网页URL之间不能有空格.

注意:在使用这个查询方法的同时不能使用其他查询条件。

相关链接
related:www.google.com
前缀'related:'列出了与指定网页相似的网站页面。注意：在 'link:' 和网页URL之间不能有空格。

注意:在使用这个查询方法的同时不能使用其他查询条件。

缓冲结果页面
cache:www.google.com web
前缀'cache:'会返回缓冲在google服务器中的HTML版本指定网页文档。（'Google搜索爬虫器'会将抓取的网页临时存储在google系统中。）注意在'cache:' 和网页URL之间不能有空格。

注意:如果你在查询中包含其他的关键字，Google将会在缓冲的文档中高亮显示。

2.3 自动过滤 - <filter>
Back to top

这个<filter> 参数会引起Google把搜索的结果再次过滤掉一些。这个是为有经验的用户准备的。但对于你的应用程序来说，为了得到完整的搜索结果，你最好把这个过滤参数关闭。

当过滤参数打开的时候，过滤器会做以下工作：

Near-Duplicate Content Filter = 如果重复的搜索结果包含同样的标题和内容片断，只会有一个结果会反馈回来。

Host Crowding = 如果重复的搜索结果来自于同一个网站主机，那么只有前2个会反馈回来。

2.4 限定 - <lr> <restrict>
Back to top

Google 提供了一些功能，能搜索一些Google的网页索引预先确定的子集。使用的参数就是lr 和 restrict 。

<lr> - 语言限定
在特殊的语言范围内搜索文档，可以使用<lr>参数,以下就是语言参数列表：

语言           <lr>值

阿拉伯语 lang_ar
冰岛语      lang_is

中文简体 lang_zh-CN
意大利语 lang_it

中文繁体 lang_zh-TW
日语        lang_ja

捷克语     lang_cs
韩语        lang_ko

丹麦语      lang_da
拉脱维亚语 lang_lv

荷兰语       lang_nl
立陶宛语    lang_lt

英语          lang_en
挪威语       lang_no

爱沙尼亚语 lang_et
葡萄牙语   lang_pt

芬兰语        lang_fi
波兰语       lang_pl

法语         lang_fr
罗马尼亚语 lang_ro

德语         lang_de
俄语         lang_ru

希腊语      lang_el
西班牙语   lang_es

希伯来语   lang_iw
瑞典语       lang_sv

匈牙利语     lang_hu
土耳其语    lang_tr

<restrict> - 国家和主题限定

Google允许你搜索一个或多个国家的网站信息 , 这是通过顶级域名服务和服务器IP地址所在的地理位置确定的。

自动的国家子集当前支持以下这些国家: (不列举了，详细信息请见：有关日志)

Google同时也有4个主题限定:

主题

<restrict>   值

美国政府      unclesam

Linux           linux

Macintosh     mac

FreeBSD        bsd

结合 <lr>和<restrict> 参数

使用lr和restrict参数的搜索请求支持布尔操作，见下表：(按优先级排序).

注意: 如果在搜索请求中同时使用lr和restrict参数，子集字符串将用'AND'逻辑结合起来。

布尔操作 范例 描述 :

布尔值 NOT [ - ]

-lang_fr

移除所有紧跟在'-'操作符后面的子集的结果。

范例中限定了所有的法语结果将会去除。

布尔值 AND [ . ]

linux.countryFR

反馈'.'操作符左右两端的子集的交集（intersection）的结果。

范例中限定了所有既是'linux'主题又是法国地区信息的结果集。

布尔值 OR [ | ]

lang_en|lang_fr

反馈'|'操作符两端子集的并集。

范例中限定了既是英语又是法语的，所有匹配的查询结果。

括号 [ ( ) ]

(linux).(-(conutryUK|countryUS))

在括号里面的一个子集字符串中的所有查询条件将会比括号外的先估算，使用括号来调整查询条件估算的顺序。

范例中 限定 了查询结果为：在Linux子集中但既不是美国地区信息子集又不是英国地区信息子集的所有结果。

注意:在限定参数中，空格是不允许的。

2.5 输入和输出编码 - <ie>, <oe>
为了支持在多语言和字符编码中搜索文档，Google Web APIs用UTF-8码来执行所有的请求和响应。在客户端请求查询时，参数<ie>和<oe>是必须的，但值会被忽略。客户端应该把所有的请求数据编码成UTF-8码，同时期待结果集也是UTF-8码的形式。

2.6 安全搜索 - <safeSearch>
许多Google用户希望没有成人网站包含在搜索结果中， Google安全搜索特性掩蔽了包含这种信息的网站，将其排除在搜索结果中。没有任何过滤方法是100%正确的，google过滤方法使用了先进的具有专利的技术，它能检查关键字，短语，URL和公开的目录分类。

如果你发现在你的搜索结果中的某些网站包含讨厌的内容，甚至涉及安全内容的，请将网站URL发送到safesearch@google.com，Google会进行调查。

2.7 限制
有一些重要的限制你是应该知道的，由于Google当前基础设施是为终端用户优化的，所以，将来我们希望为Google Web API开发者的提高限制等级。

结构                                限制

搜索请求长度                     2048 bytes

查询最大单词数                  10

最大site:条件数目                每次搜索请求1个

每次查询最大结果数            10

<start> + <maxResults>的最大值   1000

3. 搜索结果格式

3.1 搜索响应
每次你提出一个搜索请求给Google服务,会有一个响应反馈给你. 这章描述具体描述反馈值的含义.

<documentFiltering> - 一个布尔值,表示是否在搜索结果中执行过滤. 如果你请求过滤并过滤实际情况也发生了,这个值将是'true'.

<searchComments> - 显示给最终用户的一个文本字符串。当你在搜索结果中发现有最普通的信息时,其实是让你注意:“被忽略的单词(stop words)”会自动从搜索中被删减掉。 (常见的有:'and'和'as'.')

<estimatedTotalResultsCount> - 注意:估计的数值可能高于或低于实际的结果数.
注意:估计的数值可能高于或低于实际的结果数.

<estimateIsExact> - 估计的数值实际存在.是布尔值.

<resultElements> - <resultElement>数组项,这个数组项符合真实的搜索结果列表.

<searchQuery> - 这是为搜索结果存在的 <q>值.

<startIndex> - 在<resultElements>中第一个搜索结果的索引，（索引是从1开始的）。

<endIndex> - 在<resultElements>中最后一个搜索结果的索引，（索引是从1开始的）。

<searchTips> - 为终端用户显示一串字符串，告诉终端用户一些使用Google的建议和技巧。

<directoryCategories> - 一个<directoryCategory>数组项. 这是为了让搜索符合 ODP（开放式目录管理）的目录规则。

<searchTime> - 文本，浮点数，是指总的反馈搜索结果的时间，精确到秒。

3.2 结果元素
<summary> - 如果搜索结果在ODP目录下有列表，ODP摘要会以文本字符串形式显示在这里。

<URL> - 搜索结果的URL, 返回URL绝对路径的文本类型。

<snippet> - A 显示查询到的上下文的片断，这个是HTML格式的，通常在其中包括<B>标记,注意: 查询条件不总是显示在片断中. 注意: 查询条件将会在结果中加粗高亮，行断点也将包含在适当的文本中。

<title> - 搜索结果的标题，返回HTML格式。

<cachedSize> - 文本(Integer + 'k')，是指URL的缓冲版本是可用的，size是KB（千字节）。

<relatedInformationPresent> - 布尔值，是指'related:'查询条件支持这个URL。

<hostName> - 当过滤发生的时候，在相同主机结果中，顶多只有2个结果会返回，当这种情况发生的时候来自那个主机的第二个结果元素（resultElement）在参数中包含有主机名.

<directoryCategory> - 见下条.

<directoryTitle> - 如果这个结果元素（resultElement）的URL包含ODP目录,显示在目录中的标题会在此显示一串文本字符串,注意:directoryTitle可能和<title>的URL不同。

3.3 目录类别
<fullViewableName> - 文本, 为当前的ODP类别包含ODP目录名。

<specialEncoding> - 指定目录信息编码方案。

?nbsp;2002 Google, Inc. All Rights Reserved.

Google Web APIs 参考中文版

测试图片

2007-11-27T06:30:00.001-08:00

Blog选址,可实现通过xml-rpc标准进行远程离线发布的Blog服务商(BSP)测评 - 文化消费者 - 博客园

2007-11-19T04:06:00.001-08:00

Blog选址,可实现通过xml-rpc标准进行远程离线发布的Blog服务商(BSP)测评 2006-2-13 21:45

国内开放API，即可实现通过xml-rpc标准进行远程离线发布的Blog服务商(BSP)测评
我这个人很懒，可以设置远程发布网志写的blog是绝对不会跑到控制台里来写.
既看起来大方，没有广告，又能完美地通过各种常用的客户端软件发布的BSP没有。
Blogbus差了那么一点点（把标题都用日期来代替），算是目前我用起来最舒服的了。Bokee对05年6月以前注册的用户虽然会显示出错，但仍然可以发布，对后注册的用户则彻底不好用，发信问他们的技术支持也没有回音。
1.Blogbus API： http://rpc.blogbus.com/blogger (/blogger as endpoint)
Blogbus提供基于 XML-RPC 的交互式 API(Application Program Interface) ，任何用户都可以通过此API从Flickr等支持Blogger API的网站发送内容到BUS上，这是blogbus提供的又一项个性化的服务。打开Flock浏览器Tools\\Options中的\"Blogging\"选项，单击\"+\"号，Flock Blog设置向导会让你填入你的Blog地址，点击\"Next\"后，Flock会提示无法侦测你的Blog设置，此时点击\"Cancel\"进行
手动设置：在Blog API设置中，将\"XML-RPC API\"选项设为\"Blogger\"，然后填入你的Blogbus用户名，
在\"Access Point\"一栏填入Blogbus的API地址(http://rpc.blogbus.com/blogger)，之后会让你输入你的Blogbus用户名和密码，通过检测后会出现\"Blog Setup Compete!\"的信息。然后后就可以使用Flock书写和发布你的Blog了，随想随录，随时发布，免去了登录Blogbus的繁琐，节省了发布时间。 Blogbus还提供了一个关于“如何通过API从flickr调用图片到blogbus”的帮助文档。
缺点：发现blogbus的API把标题都用日期来代替,可见此功能发布时测试的不完善
2.Bokee and blog client的站点配置
E.g., blogbuddy setting (Other clients are also ok):
type:blogger 站点名: publishblog.blogchina.com 端口号: 80 相对路径: /xml-rpc 字符集: GB2312
http://publishblog.bokee.com/xml-rpc //ok for API: Blogger
3. blog.run2me.com
靠近我-似曾相识-从Flickr向Run2me发图片日志
(Source: http://blog.run2me.com/timesite/archive/2005/11/18/12054.aspx)
从Flickr向Run2me发图片日志
Posted on 2005-11-18 12:15 似曾相识阅读(225) 评论(0) 编辑收藏
相信有不少朋友都在用Flickr相册，对于Blogger.com、Livejournal、Typepad等可以直接添加，但对于.TEXT的Blog程序，却没那么直接，在这里教你Run2me等使用.TEXT程序的Blog...
⑴. 在Run2me个人首页，[管理] - [选项] - [Configure] 确认已勾选“Allow Web Service Access” [Save]
⑵. 登录你的Flickr，Your Account，Blogging - Your blogs- Set up a new blog-What kind of weblog do you have?
下拉列表中选“MetaWebBlogApi Enabled Blog”(如图)- [NEXT] 下一步
⑶. Enter your login details
API Endpoint:输入：http://blog.run2me.com/youraccount/services/MetaBlogApi.aspx
(注：youraccount 替换为自己的用户名)
Username: Password: 分别输入自己的用户名和密码，[NEXT]
如图(Omitted)：[NEXT] 下一步，如果操作无误，则显示下图
注：Label是自己定义这个Blog标签，方便自己识别。如我在Donews的Label定义为似曾相识(Donews)
这样，以后在Flickr浏览图片时，点击图片上方[Blog this] ，就可以发图片日志了。
其它使用.TEXT程序的Blog，如Donews Blog、CSDN Blog、天极Blog等，只要把第三步中提到的http://blog.run2me.com/youraccount/services/MetaBlogApi.aspx中Blog.run2me.com换为对应的Blog地址即使，如CSDN为：http://blog.csdn.net/youraccount/services/MetaBlogApi.aspx
Sorry，因Donews、CSDN Blog在后台管理里并没有开放“Allow Web Service Access”的选项，所以即使添加成功，也不能从Flickr向Donews、CSDN Blog发图片。Run2me、BCchinese等可以使用Flickr的Blog this功能。
--Evaluation:
Donews,CSDN Blog have not open their API yet
Run2me is only a personal site that is untrustable.
http://blog.yesky.com/ too many ads.
4. cited from 网摘的自动发布
(Source: http://blog.podlook.com/archive/2005/06/01/294.aspx)
和做TrackBack功能时一样，遇到的最多的问题是标准化的问题，太多的网站不支持像TrackBack, BlogAPI这样在Blog初始非常基本的功能。现在的Blog，从某些角度讲可以说是有倒退。
言归正传，我们用的是最标准的BlogAPI，理论上大多数Blog系统都支持，如果你是自己有一个站点的话，应该问题不大。但如果使用一些Hosting如Donews, blogChina, blogBus, blogcn都不行（没有接口）。下面列出一些做过测试肯定可以的：
http://blog.bcchinese.net http://blog.bcchinese.net/[user]/services/metablogapi.aspx
http://www.blogme.cn http://www.blogme.cn/xmlrpc.php
http://computer.mblogger.cn http://computer.mblogger.cn/services/[user]/metablogapi.aspx
Blogme: Blog支持以网页方式、xml-rpc和邮件方式提交，xml-rpc支持blogger、MT、metaWeblog三种API，后两者可以支持网站的分类系统，推荐使用。
--Evaluation:
P.S.
bcchinese has too many ads too and seems the site is not located in China, which is easy to be blocked.
mblogger account can not be registered!
blogme has too many ads, and can not setup the configurations.
blogcn didnot provide api, i.e.,xml-rpc service.

5.个性的Space空间：

a. Creat BlogIt.url
[InternetShortcut]
URL=http://spaces.msn.com/blogit.aspx

b.Space PowerToy三大工具
MSN Spaces官方小组发布了三个Space增强工具：
媒体播放器工具
自定义HTML工具
界面设置工具
http://www.siteexperts.com/blogging/editit.htm
msn spaces日志在线编辑器

c.MetaWeblog (MovableType) API for MSN Spaces now widely available
unable to parse the xml response
不过我到最后一步的时候，出现了一个错误，w.bloggar提示说：Unable to parse the XML response. Parser Reason:Invalid at the top level of the document.
You must use https instead of http to make it work. Complete url is https://storage.msn.com/storageservice/MetaWeblog.rpc

Type https://storage.msn.com/storageservice/MetaWeblog.rpc in Server URL API
Type your msn space name as userid for e.g. if the space url is http://spaces.msn.com/members/ket000 it will be ket000
For password Type in secret word that you have used for turning on email publishing. To get the steps on how to turn on this, see this entry from Carnege4Life's Space blog hosted on MSN Space and press next.
http://spaces.msn.com/ket000/Blog/cns!1pm_peVcRrtQtZAc4WaU3FBA!278.entry

http://spaces.msn.com/carnage4life/Blog/cns!1piiOwAp2SJRIfUfD95CnRLw!1046.entry
Posting to your blog on MSN Spaces using W.Bloggar
http://spaces.msn.com/carnage4life/Blog/cns!1piiOwAp2SJRIfUfD95CnRLw!1045.entry
Posting to your blog on MSN Spaces using Blogjet

---------------
[Reference1](zz)为自己的另一个Blog选址
我对blogbus提供的服务很满意（没有模板适合我...），所以我要建另一个blog并不是要搬迁。我的blog标题所写的“测试中”，已经不是测试blogbus是否好用了（事实上我认为 blogbus比国内外的大部分BSP都出色，就凭它的tag和export系统就把我征服了）。我一直都在寻找一个比较稳定的体系，通过这个体系我可以我组织信息的获取、发表个人看法、获得系统的知识、提高个人能力等...我不知道该怎么表述，大概的意思就是这样，或许可以说是一个个人信息系统吧。在 blogbus这里的blog是我在这个体系里的一部分，而我已初步将其定位在关注<1>web2.0、<2> eBusiness和<3>一些特别的事上。另外，为了实实在在地提高英语写作能力，我打算通过blog这种形式来达到较熟练地运用英语的水平。又，根据GTD中“找一个好的工具能激发工作的动力”这个理论，我决定再在国外的BSP上建一个英语blog。这个英语blog上要写些什么暂时还没详细的计划，不过肯定把它当作“垃圾桶”，写些Personal的事，也算是对在这个Blog的补充吧。
于是我花了一点时间找一个免费的BSP，结果嘛...还真难找。被封的就免了，省得用代理；有的停止注册了，可惜；有的有广告，我不喜欢...剩下的选择有：blogneo、iblog.com、wordpress.com和innereyes。
blogneo给人的感觉很不稳妥，倒不是说它系统不稳定，只是它除了给我一个帐号外，什么都没提供，help、接口什么的都没有，它是哪条道上的也不说说。我实在放心不下，怕它什么都不说的忽然关闭了，同时也不满意它的服务，所以决定走人。
innereyes，wordpress引擎，提供了包括FTP、Email、数据库连接等一大堆功能。无语，高兴死了，赶紧注册了一个。可是中文支持有问题，名字也不怎么好，官方主页略显简陋，一点时尚的感觉都没有。先占个坑吧，以后再说...
iblog.com给人印象很好，还提供多国语言。用英语会给你xxx.iblog.com，用中文会给你xxx.iblog.cn，中文的帐户不能在外文的blog上登陆，反之亦然。它提供的系统很好，模板也很漂亮，我几乎就打算在那儿安家了，然后...
然后冒出来个wordpress.com！光是名气就让我无法拒绝了。听说用Flock可以免邀请注册，赶紧下了搞来一个帐号。哈！爽！在wordpress.com上有了个Blog！嗯？不对，怎么整一个blogneo似的，除了给你个帐号就什么都不提供了？晕！模板也很少，插件、主题不知道往哪里放，用着就不爽！
结果我决定用innereyes。本来iblog.com也很好，只是它没有接口，无法使用客户端写blog。我搞错了！iblog.com使用的是plog系统，接口是MetaWeblog，好不容易才发现的......innereyes凭着 wordpress引擎这个优势，配合FTP，基本上就跟自己建服差不多了（吧...我瞎猜的）。它对中文的支持与我的目的并不冲突，OK！
接下来还有不少工作要做，两个blog的内容都要根据"weblog设计十大失误"一文修改一下，模板也要改，Blog的定位还要再具体些。所有的工作预定在11月13日（也就是我在这里发的第一篇blog的三个月后）之前完成。祝自己好运！
Flock的出现对我们思路的扩展有很多帮助，通过开放的API和源码，Web2.0的服务是可以这样组合的。让我们（在这个周五）畅想一下：
国内的网摘们（hexun、sina、sohu等）、相册们（yupoo、foto等）开放标准的API（365key、igooi已经开放），方便第三方开发者使用。
国内的BSP（BlogBus、Donews等）开放或加载Blog API，让客户端软件可以方便操作Blog。
国内的浏览器们（Maxthon等）和国内Web2.0各服务商合作，捆绑推销产品和服务
最后的情景会不会是这样，我可以在Maxthon上面收藏网页到365key、发图片到yupoo、用yupoo的图片在Donews写Blog，而这一切都在Maxthon一个产品里面完成？！
p.s.发现Flock网站使用的程序是ruby的，没准Flock.com以后会变成基于Ruby on Rails的AJAX项目~
----------------
[Reference2]国内主要Blog站点所在位置 BSP
由于电信和网通公司之间的网络互联问题，造成电信服务器和网通服务器之间访问速度不甚理想，Blog托管站点所在的位置很大程度上影响了浏览访问速度，故整理了国内近50家Blog网站主机所在位置...
博客名称.网址所在位置
Donews http://blog.donews.com 北京市
博客网 http://www.bokee.com 北京市
和讯博客 http://blog.hexun.com 北京市
博客动力 http://www.blogdriver.com 天津网通
天涯博客 http://www.tianyablog.com 海南电信
歪酷博客 http://www.yculblog.com 上海电信
中国博客网 http://www.blogcn.com 浙江杭州
AnyP http://www.anyp.cn 广东佛山
Blogbus http://www.blogbus.com 上海电信
你的博客网 http://www.yourblog.org 上海电信
柒零博客 http://blog.houhai.com 天津铁通
博客中国人 http://www.blogchinese.com 湖北武汉
博客天下 http://www.blog.com.cn 北京网通
博客天下 http://www.139.com 广东深圳
我爱博客网 http://www.52blog.net 上海电信
VV博客网 http://www.vvblog.com 河南新乡
敏思博客 http://www.blogms.com 广东广州
好博客 http://www.blogok.net 山东网通
阳光博客网 http://www.shineblog.com 江苏电信
BlogCup http://blogcup.com 广东深圳
我的博客 http://www.5dblog.com 浙江杭州
博客之家 http://www.blogerhome.com/ 江苏徐州
博客人 http://www.bloger.com.cn 江苏苏州
神州博客 http://www.blogercn.com 内蒙古
博客园 http://www.cnblogs.com 江苏扬州
博客堂 http://blog.joycode.com 上海电信
一起来 http://www.i170.com 广东深圳
悠悠易 http://www.uuyi.com 天津铁通
艾幽博客 http://www.iiu.cn 北京市
阿Q博客 http://www.a-q.cn 北京市
移动博客 http://www.moblog.cn 北京市
中华部落阁 http://www.mblogger.cn 上海电信
博客之家 http://www.bloghome.cn 山东淄博
博客之家 http://www.blogyes.net 山东淄博
天极博客 http://blog.yesky.com 北京市
天极博客 http://blog.chinabyte.com 北京市
赛迪博客 http://blog.ccidnet.com 北京市
CSDN Blog http://blog.csdn.net 北京市
博客风 http://www.blogwind.com 广东汕头
靠近我 http://blog.run2me.com 上海电信
博客物语 http://blog.discloser.net 上海电信
播客天下 http://www.imboke.com 浙江杭州
Blogku http://www.blogku.com 四川电信
中国播客网 http://www.vvlogger.com 北京市
好博客 http://www.haoblog.com 北京电信网通
你好Blog http://www.nihaoblog.com 上海电信
91Blog http://www.91blog.com 上海电信
[Reference3]
blog程序的考量标准
看到一个国外的网站对目前比较流行的blog进行了综合考量，非常详细
http://www.asymptomatic.net/blogbreakdown.htm
受考评的系统有b2Evolution，bBlog，BLOG:CMS，Blojsom，Blosxom，Expression Engine，MovableType，Nucleus，Pivot，pMachine Pro，Serendipity，SPIP，.Text TextPattern，WordPress。
我把它的考评标准简单翻译一下：
Current Version 当前版本号
Home URL 主页地址
Trial URL 试用地址
License 软件协议
User Community 用户社区
Documentation 在线文档
Sample Sites demo 简单演示
Cost (US$) 价格（美元）
Minimum Server Requirements 最小系统要求
Localization 默认语言
Multilingual 多国语言支持
Data Storage 数据存储方式
Max. Weblogs 最大blog数目
Multiple Sites 是否支持多站点
Post Ordering 文章排序方式
Categories 分类方式
Subcategories 是否支持子分类
Keywords 是否支持关键字索引
Default Post Fields 默认输入区域数目
Max Post Fields 最多的输入区域
Post Editor 是否允许编辑
Draft Mode 是否支持草稿模式
Post API Support 是否支持接口
Post Moderation 是否支持管理审核
Post Pings 是否支持ping
Bookmarklets 是否支持书签
RSS Output 是否支持rss输出
Atom Output 是否支持atom输出
Comments 是否支持评论
Comment Spam 是否支持评论过滤
Comment RSS 评论是否支持rss输出
Template Storage 模版是否可以存储
Template Tagging 模板标签库
Edit Templates Online 是否可以在线编辑模版
Template Expert 是否可以导出模板
Edit Templates Offline 是否可以离线编辑模版
Template Conditionals 是否支持为分类或作者单独定制的模版
Open Registration 开放注册？
User Security 用户权限
Trackback 是否支持trackback？
Pingback 是否支持pingback？
RSS Aggregator 是否可以读取其他站的RSS
Forum 是否支持论坛形式
File Editor 文件编辑
CSS Editor CSS 编辑
Plugins/ Extensions 是否支持插件
Plugin Directory 是否有插件目录
Visitor Logs 访问记录
Referrer Logs 来源记录
Imports From 可以导入其他blog系统数据
User Profiles 是否有用户资料
SEF URLs 是否支持friendlyURL
Thumbnails 自动生成缩略图
Category Images 分类图片
Skin Switch 支持即时换风格
Cross-Post 是否支持同一文章放在多分类里
Linkroll 是否支持外部链接链
Password Posts 是否可以设置浏览密码
Blog By Email 是否支持Email更新blog
[Reference] 月光的BLOG http://blog.yam.com/williamlong
1.免費中文博客服務評測本文介紹了國內外主要免費博客服務Blog Service Providers (BSP)的個人評測，為了進行相關測試，每個Blog我都申請了一個站點進行測試，速度測試以南方的中國電信線路為準。
對于有主機空間的Blogger來說，可以參見另外一篇文章“2005年BLOG程序評點”，裏面講的是如何使用各類程序搭建自己的Blog，我這裏主要說的是沒有主機空間的用戶，如何選擇好的Blog服務系統，這是很多人的難題，我個人感覺，用戶體驗是最重要的。其中包括，速度要快，廣告要少，模板要多，使用要簡單，域名要易記。下面是我對目前主要博客服務商的一些評測。
Blogger - http://www.blogger.com 演示地址 http://williamlong.blogspot.com ：提到Blog，不得不提一下世界使用最多的Google推出的blogger.com。其有中文界面，頁面極為簡潔，符合Google的風格，在全球使用量驚人，可惜一直被國內屏蔽，如果其被解封的話，那選擇博客服務的首選。
Yahoo - http://360.yahoo.com 演示地址 http://360.yahoo.com/williamlong ： Yahoo推出的博客服務，還處于Beta測試階段，目前沒有中文界面，因此就不介紹了。
MSN - http://spaces.msn.com 演示地址 http://spaces.msn.com/members/williamlong ：巨頭微軟提供的博客服務，有點結合了主頁空間的感覺，可以放相冊和音樂，速度馬馬虎虎，就是其日誌的Url地址實在太不友好了。
蕃薯藤 - http://blog.yam.com 演示地址 http://blog.yam.com/williamlong ：臺灣最大的Blog服務商，程序用的是世界最流行的Movable Type，廣告非常少，頁面也很清爽，Url地址也很容易記憶，速度還算湊合，看來選擇Movable Type的確是明智的選擇。不足之處是每次發表一篇文章，頁面都要重建一次。
博客中國 - http://www.blogchina.com 演示地址 http://williamlong.blogchina.com ：是一個比較老牌的博客服務商，早期用的Plog程序做服務，感覺還可以，後來就慢慢變質，收購了Blogdriver.com，名字變成了Bokee.com，服務卻越來越不行了，速度也慢的要死。
中國博客 - http://www.blogcn.com 演示地址 http://williamlong.blogcn.com ：也是個老牌的博客服務商，木子美發家的地方，其二級域名是假二級域名，實際進行了轉向，很不爽，博客程序使用Oblog打建，不是很專業，速度也不爽。頂部有一橫條廣告，頁面上還有懸浮廣告，其特色據說是女孩子較多，模板比較女性化。
Blogbus - http://www.blogbus.com 演示地址 http://williamlong.blogbus.com ：據說是中國首個推出付費博客的服務商，不過也提供免費服務。博客首頁面竟然是零廣告，非常清爽，博客日誌頁面底部有橫幅廣告，博客訪問速度也快，看起來是個很專業的博客服務商。缺點是空間太小，免費用戶衹有2M的空間，收費用戶可以使用最大100M空間，還可綁定頂級域名，也算是物有所值吧。
DoNews - http://blog.donews.com 演示地址 http://blog.donews.com/williamlong ：以IT寫作為主的博客服務後起之秀，系統用.Text搭建，速度挺快，首頁廣告較少，衹有DoNews導航鏈接，最終日誌頁面底部有窄告的廣告，閃來閃去地很不美觀。缺點是沒有二級域名，模板少，Url地址是動態地址，不好被搜索引擎索引。
CSDN - http://blog.csdn.net 演示地址 http://blog.csdn.net/williamlong ：和DoNews一樣使用.Text搭建，作者以程序員為主，廣告少，模板也少，沒有二級域名，頁面底部有CSDN的導航條。
和訊博客 - http://blog.hexun.com 演示地址 http://blog.hexun.com/williamlong ：博客服務的後起之秀，通常認為其以財經博客為主，博客界面較幹凈，廣告比較少，可惜沒有個人的二級域名。
歪酷博客 - http://www.yculblog.com 演示地址 http://williamlong.yculblog.com ：速度還可以，有二級域名，Url地址對搜索引擎友好，並且可以修改模板的HTML源代碼，不足之處是每個管理操作都要輸入驗證碼，域名也怪怪的，不好記憶。
新浪博客 - http://blog.sina.com.cn 演示地址 http://blog.sina.com.cn/u/1494759712 ：沒有二級域名，Url地址極不友好，很難記住，首頁鏈接的一大堆“名人博客”卻有短地址，說明這個服務商非常勢利。訪問速度雖快，但博客服務很不專業。
搜狐博客 - http://blog.sohu.com 演示地址 http://williamlong.blog.sohu.com ：二級域名是假二級域名，會自動跳轉到 http://blog.sohu.com/members/williamlong，不爽。不過頁面廣告較少，衹在底部有搜狐的廣告。
網易博客 - http://blog.163.com 演示地址 http://williamlong.blog.163.com ：廣告少，速度還可以，頂部有網易LOGO，博客的Url地址不友好。
TOM博客 - http://blog.tom.com 演示地址 http://williamlong.blog.tom.com ：不僅僅二級域名是跳轉的，而且跳轉地址不友好，頂部有巨幅TOM導航頁面，中間有左右漂浮廣告，底部也有廣告，總而言之，就是滿屏廣告亂飛，頁面一塌糊塗。
mblogger - http://www.mblogger.cn 演示地址 http://williamlong.mblogger.cn ：二級域名會自動跳轉，也是.Text搞的，網站首頁看起來不美觀，好像個人主頁似的，感覺不很正規。
2.免費主頁空間服務評測做主頁比做博客復雜一些，但靈活度就大多了，我這裏介紹的大多是國外的免費主頁空間，因為國外的空間雖然經常被封，但較為穩定，少有關門的，國內的則大部分都關了，而國外的Angelfire、Tripod、GeoCities等卻都一直存活到現在，說明別人的贏利方式很多，經營管理不錯。
下面是我認為幾個不錯的免費個人主頁的提供商。
geocities - http://geocities.yahoo.com
DEMO URL: http://www.geocities.com/williamlong
說明：大名鼎鼎的地球村，15MB空間，每小時限制流量4.2MB，可惜每頁右邊都有一個討厭的框架廣告，長期被封中。
fortunecity - http://www.fortunecity.com
DEMO URL: http://williamlong.fortunecity.com
說明：容量是25MB空間，每月流量是3GB，支持FTP。頁面頂部和底部都有fortunecity的橫幅廣告。
Tripod - http://www.tripod.lycos.com
DEMO URL: http://williamlong.tripod.com
說明：20MB空間，支持Blog和照片，每頁頂部有廣告。每月有流量限制。
Angelfire - http://www.angelfire.lycos.com
DEMO URL: http://www.angelfire.com/me/williamlong
說明：20MB空間，和Tripod幾乎完全一樣。衹有頂部有一個angelfire的廣告，流量有限制。
Freewebs - http://members.freewebs.com
DEMO URL: http://www.freewebs.com/williamlong
說明：100MB空間，每月衹有500MB流量，限制可太厲害了。
Infoseek - http://isweb.www.infoseek.co.jp
DEMO URL: http://williamlong.hp.infoseek.co.jp
說明：日本的100MB空間，好象沒有流量限制。
AOL - http://hometown.aol.com
DEMO URL: http://hometown.aol.com/williamlone
說明：12MB空間，頂部廣告，可以FTP。
中華網 - http://home4u.china.com
DEMO URL: http://williamlong.home4u.china.com
說明：免費空間是10M。沒有廣告，不限制流量，速度快的出奇，不過衹能WEB上傳，而且上傳的文件需要被審核才能看到。
多來米 - http://diy.myrice.com
DEMO URL: http://williamlong.diy.myrice.com
說明：首頁頂部有廣告，還有彈窗，很不爽。

Blog选址,可实现通过xml-rpc标准进行远程离线发布的Blog服务商(BSP)测评 - 文化消费者 - 博客园

EditPlus v2.12 使用技巧集萃

2007-11-18T12:53:00.001-08:00

Liangjh@CCF
------------------------------------------------------
技巧中，在编译器集成例子中参照了部分官方的文献。有几篇是从网上搜集来的，这里我注明了来源或原始作者。如果你是相应作者，不希望文章放在这里，请通知我，我会及时删掉。

------------------------------------------------------
文章或者技巧及原始作者或出处：

正则表达式类
【1】正则表达式应用——替换指定内容到行尾
【2】正则表达式应用——数字替换----------------------------Microshaoft,jiuk2k
【3】正则表达式应用——删除每一行行尾的指定字符
【4】正则表达式应用——替换带有半角括号的多行
【5】正则表达式应用——删除空行----------------------------江德华
软件技巧类
------------------------------------------------------
【6】软件技巧——键盘记录的注意事项
【7】软件技巧——关闭文档标签的便捷方法
【8】软件技巧——如何去掉 EditPlus 保存文本文件时的添加后缀提示？
【9】软件技巧——提示找不到语法文件的解决办法
【10】软件技巧——设置editplus支持其它文字，如韩文----------jackywu1978
【11】软件技巧——FTP 上传的设置----------------------------李应文2.11汉化版
【12】软件技巧——如何禁用备份文件功能？
【13】软件技巧——添加语法文件、自动完成文件、以及剪辑库文件
工具集成类
------------------------------------------------------
【14】工具集成——编译器集成例子（Java、Borland C++、Visual C++、Inno Setup、nsis、C#）
【15】工具集成——让Editplus调试PHP程序----------------------avenger,aukw
【16】工具集成——打造 PHP 调试环境(二)----------------------老七2.11汉化版
【17】在 WINPE 中集成 EDITPLUS

每个步骤都说得很详细了，就没有必要贴图了，体积不要太大才好。

【1】正则表达式应用——替换指定内容到行尾
原始文本如下面两行
abc aaaaa
123 abc 444

希望每次遇到“abc”，则替换“abc”以及其后到行尾的内容为“abc efg”
即上面的文本最终替换为：
abc efg
123 abc efg

解决：
① 在替换对话框，查找内容里输入“abc.*”
② 同时勾选“正则表达式”复选框，然后点击“全部替换”按钮
其中，符号的含义如下：
“.” ＝匹配任意字符
“*” ＝匹配0次或更多

注意：其实就是正则表达式替换，这里只是把一些曾经提出的问题加以整理，单纯从正则表达式本身来说，就可以引申出成千上万种特例。

【2】正则表达式应用——数字替换
希望把
asdadas123asdasdas456asdasdasd789asdasd
替换为:
asdadas[123]asdasdas[456]asdasdasd[789]asdasd

在替换对话框里面，勾选“正则表达式”复选框；
在查找内容里面输入“[0-9][0-9][0-9]”，不含引号
“替换为:”里面输入“[/0/1/2]”，不含引号
范围为你所操作的范围，然后选择替换即可。

实际上这也是正则表达式的使用特例，“[0-9]”表示匹配0～9之间的任何特例，同样“[a-z]”就表示匹配a～z之间的任何特例
上面重复使用了“[0-9]”，表示连续出现的三个数字
“/0”代表第一个“[0-9]”对应的原型，“/1”代表第二个“[0-9]”对应的原型，依此类推
“[”、“]”为单纯的字符，表示添加“[”或“]”，如果输入“其它/0/1/2其它”，则替换结果为：

asdadas其它123其它asdasdas其它456其它asdasdasd其它789其它asdasd

功能增强（by jiuk2k）：
如果将查找内容“[0-9][0-9][0-9]”改为“[0-9]*[0-9]”，对应1 或 123 或 12345 或 ...
大家根据需要定制

相关内容还有很多，可以自己参考正则表达式的语法仔细研究一下

【3】正则表达式应用——删除每一行行尾的指定字符
因为这几个字符在行中也是出现的,所以肯定不能用简单的替换实现
比如
12345 1265345
2345
需要删除每行末尾的“345”
这个也算正则表达式的用法，其实仔细看正则表达式应该比较简单，不过既然有这个问题提出，说明对正则表达式还得有个认识过程，解决方法如下
解决：
在替换对话框中，启用“正则表达式”复选框
在查找内容里面输入“345$”
这里“$”表示从行尾匹配

如果从行首匹配，可以用“^”来实现，不过 EditPlus 有另一个功能可以很简单的删除行首的字符串
a. 选择要操作的行
b. 编辑－格式－删除行注释
c. 在弹出对话框里面输入要清除的行首字符，确定

【4】正则表达式应用——替换带有半角括号的多行
几百个网页中都有下面一段代码：
<SCRIPT LANGUAGE="javascript1.1">

</SCRIPT>
我想把它们都去掉，可是找了很多search & replace的软件，都是只能对“一行”进行操作。

EditPlus 打开几百个网页文件还是比较顺畅的，所以完全可以胜任这个工作。
具体解决方法，在 Editplus 中使用正则表达式，由于“(”、“)”被用做预设表达式（或者可以称作子表达式）的标志，所以查找
“<SCRIPT LANGUAGE="javascript1.1">/n/n</SCRIPT>/n”
时会提示查找不到，所以也就无法进行替换了，这时可以把“(”、“)”使用任意字符标记替代，即半角句号：“.”。替换内容为
<SCRIPT LANGUAGE="javascript1.1">/n/n</SCRIPT>/n
在替换对话框启用“正则表达式”选项，这时就可以完成替换了

【5】正则表达式应用——删除空行
启动EditPlus，打开待处理的文本类型文件。
①、选择“查找”菜单的“替换”命令，弹出文本替换对话框。选中“正则表达式”复选框，表明我们要在查找、替换中使用正则表达式。然后，选中“替换范围”中的“当前文件”，表明对当前文件操作。
②、单击“查找内容”组合框右侧的按钮，出现下拉菜单。
③、下面的操作添加正则表达式，该表达式代表待查找的空行。（技巧提示：空行仅包括空格符、制表符、回车符，且必须以这三个符号之一作为一行的开头，并且以回车符结尾，查找空行的关键是构造代表空行的正则表达式）。
直接在"查找"中输入正则表达式“^[ /t]*/n”，注意/t前有空格符。
（1）选择“从行首开始匹配”，“查找内容”组合框中出现字符“^”，表示待查找字符串必须出现在文本中一行的行首。
（2）选择“字符在范围中”，那么在“^”后会增加一对括号“[]”，当前插入点在括号中。括号在正则表达式中表示，文本中的字符匹配括号中任意一个字符即符合查找条件。
（3）按一下空格键，添加空格符。空格符是空行的一个组成成分。
（4）选择“制表符”，添加代表制表符的“/t”。
（5）移动光标，将当前插入点移到“]”之后，然后选择“匹配 0 次或更多”，该操作会添加星号字符“*”。星号表示，其前面的括号“[]”内的空格符或制表符，在一行中出现0个或多个。
（6）选择“换行符”，插入“/n”，表示回车符。
④、“替换为”组合框保持空，表示删除查找到的内容。单击“替换”按钮逐个行删除空行，或单击“全部替换”按钮删除全部空行（注意：EditPlus有时存在“全部替换”不能一次性完全删除空行的问题，可能是程序BUG，需要多按几次按钮）。

【6】软件技巧——键盘记录的注意事项
EditPlus 的键盘记录有些类似于 UltraEdit 的宏操作，不过功能相对单一，录制的文件可编辑性较差。
由于基本无法编辑录制的文件，所以录制的时候为了避免录制失败，推荐纯粹使用键盘操作，以下是比较关键的几个键盘组合：
Ctrl+F ＝调出查找对话框
Ctrl+H ＝调出替换对话框
Alt+F4 ＝关闭作用，比如，关闭查找对话框、关闭替换对话框，等等
其它键盘快捷键在“帮助－快捷键列表”里面可以很容易的查找到，这里就不细说了。

【7】软件技巧——关闭文档标签的便捷方法
右键单击文档标签工具条，弹出菜单中选择“标签选项”，选中“用鼠标中间的按钮关闭”，这里包括鼠标的滚轮。

【8】软件技巧——如何去掉 EditPlus 保存文本文件时的添加后缀提示？
如果你使用 EditPlus 进行文本编辑，那么每次创建文本文件，编辑后保存时，尽管文件类型下拉列表中显示的是文本文件， EditPlus 还是询问你是否添加".txt"后缀，是不是很烦？
解决方法:
① 在程序目录建立一个空的文件“template.txt”
② “工具－参数设置－模板”里面，单击“添加”按钮添加模板，“菜单文本”这里输入“Text”，浏览“template.txt”，之后确定即可
③ “文件－新建－text”，就可以建立一个空的文本文件，保存时，这个文件自动带有扩展名".txt"，也就避免了令人头疼的确认
④ 模板设置文件名称为“template.ini”，如果和主程序同一路径，可以使用相对路径
罗嗦了点，不过管用
要自动创建带有某种后缀的文件，方法同上。

【9】软件技巧——提示找不到语法文件 *.stx 的解决办法
原因多为设置的语法文件不存在或者是路径设置不对。这是因为 EditPlus 的语法是设置文件采用的是绝对路径，而在你设置了语法文件之后，再把程序复制到其它目录，因而导致 EditPlus 无法找到该语法文件。
解决办法：
在主程序目录里，找到 Setting.ini 这是 EditPlus 存放语法的文件
查找后缀为“.stx”、“acp”的文本内容，或者查找带有驱动器符号的行，比如
Syntax file=C:/Program Files/EditPlus 2/cpp.stx
那么，就把”C:/Program Files/EditPlus 2/“替换成你当前软件的路径。
其它提示找不到文件的解决方法同上

【10】软件技巧——设置editplus支持其它文字，如韩文
在editplus里打开文件，出来打开文件对话框；然后点击“转换器”后面的那个省略号，会出来自定义转换器对话框；在右边选择你需要的编码方式，添加到左边，然后点确定；最后在下拉框中选择需要的编码方式，然后打开文件即可。

【11】软件技巧——FTP 上传的设置
“文件->远程操作->FTP 上传”在“设置”选项卡中设置好参数（“子目录”前面应该加“/”如“/web/”），点击“确定”回到“FTP 上传”选项卡，然后点击“上传”即可；“批量上传”的设置类似。

【12】软件技巧——如何禁用备份文件功能？
在“参数选择”的文件选项页，禁用“'保存时自动创建备份文件”选项

【13】软件技巧——添加语法文件、自动完成文件、以及剪辑库文件
要添加 *.STX（语法文件）或 *.ACP（自动完成文件）：
1. 选择“参数选择→语法”
2. 单击“添加”按钮，命名，在“扩展名”部分输入对应扩展名（不带“.”）
3. 浏览/输入 STX（语法文件部分）以及 ACP（自动完成文件部分）。
添加剪辑库文件（*.CTL）
复制相应 *.CTL 文件到软件安装目录，重新启动 EditPlus ，则系统自动识别。

【14】工具集成——编译器集成例子（Java、Borland C++、Visual C++、Inno Setup、nsis）
在“工具→参数选择→用户工具”选项页设置，设置步骤
① 设置组名称，这里也可以不设置
② 单击“添加工具→应用程序”按钮并进行如下设置
③ 各种类似"$(FilePath)"的参数可以在文本框右侧的箭头下拉菜单中获取，具体含义如下
参数描述
$(FilePath) 文件路径（文件全名，含目录和文件名）
$(FileDir) 文件目录（不带文件名）
$(FileName) 文件名（不带目录）
$(FileNameNoExt) 不带扩展名的文件名（不带目录）
$(FileExt) 扩展名（当前文件）
$(ProjectName) 工程名称（当前工程名）
$(CurLine) 当前行号（光标位置处的行号）
$(CurCol) 当前列号（光标位置处的列号）
$(CurSel) 当前文本（插入当前选定文本）
$(CurWord) 当前单词（插入当前单词）
$(WindowList) 显示当前窗口列表并选择特定文件

例子 1. Java 编译器

菜单文本：Java 编译器
命令：c:/java/bin/javac.exe
参数："$(FilePath)"
初始目录：$(FileDir)
捕获输出：开启

要运行已编译的 Java 类文件，你可以进行如下设置：
菜单文本：Java
命令：c:/java/bin/java.exe
参数：$(FileNameNoExt)
初始目录：$(FileDir)
“命令”部分应当替换为实际的 Java 解释器的路径。

例子 2. Borland C++

菜单文本：Borland C
命令：c:/bc/bin/bcc32.exe
参数：-Ic:/bc/include -Lc:/bc/lib -n$(FileDir) $(FilePath)
初始目录：c:/bc/bin
捕获输出：开启

例子 3. Visual C++

菜单文本：Visual C++
命令：c:/msdev/vc98/bin/cl.exe
参数："$(FilePath)"
初始目录：$(FileDir)
捕获输出：开启

例子 4. Inno Setup
菜单文本：编译 Inno
命令：C:/Program Files/Inno Setup 4/Compil32.exe”
参数：/cc $(FileName)
初始目录：$(FileDir)
捕获输出：开启

例子 5. nsis
菜单文本：编译 nsis
命令：C:/NSIS/makensis.exe
参数：$(FileName)
初始目录：$(FileDir)
捕获输出：开启

例子 6. C#
菜单文本：编译 C#
命令：C:/WINDOWS/Microsoft.NET/Framework/v1.0.3705/csc.exe
参数：$(FileName)
初始目录：$(FileDir)
捕获输出：开启

在上面设置中，在命令部分，必须使用系统中各自编译器的绝对路径。

设置完毕后，你可以在“工具”菜单运行对应工具了，运行结果会显示在底部的输出窗口，你也可以通过快捷键(Ctrl + 0-9) 运行，或者是通过“用户工具栏”的快捷按钮运行。

要运行已编译的 *.exe 文件，你可以进行如下设置（此时可执行文件需要和编译文件同名）：
菜单文本：Run
命令：$(FileNameNoExt)
参数：
初始目录：$(FileDir)

【15】工具集成—— 让Editplus调试PHP程序
1:打开Editplus，选择"工具->配置用户工具..."菜单。
2: 在弹出的窗口中选择"添加工具->应用程序",给新程序起一个好记的名字，比如这里我们用"Debug PHP",在"菜单文本"中输入"Debug PHP"。点击"命令行"右边的按钮,找到你的php.exe所在的路径，例如这里是"c:/php/php.exe"。再点击"参数"右边的下拉按钮选择"文件路径",最后再把"捕获输出"前面的复选框选上。
3:现在测试一下，新建一个php文件，按快捷键Ctrl+1可以激活刚才我们设置的工具(如果你设置了多个工具,快捷键可能会有所不同),现在你可以看到它已经能正常工作了。但是还有一点不太理想:如果你的PHP程序出错,在输出窗口会提示你第几行出错 ,单击这一行提示,Editplus老是提示你找不到某某文件，是否新建。接下下我们要修正这个功能。
4:打开刚才用户工具设置窗口，找到刚才设置的"Debug PHP"工具。点击"捕获输出"复选框旁边的"输出模式"按钮,会弹出一个定义输出模式的窗体，把"使用默认输出模式"前面的复选框去掉, 在"正则表达式"这一项的文本框中输入" ^.+ in (.+) line ([0-9]+) "(不包括引号),细心的朋友可能会发现，这里使用的也正则表达式的语法。然后，在下面的"文件名"下拉菜单中选择"预设表达式 1"，即上边正则表达式中的第一个参数,"行"下拉菜单项选择"预设表达式 2"，"列"下拉项保持为空。然后保存设置。
5:好了，现在再来试一下吧，双击出错的行数，Editplus就会自动激活出错文件，并把光标定位到出错行,是不是特别方便呢?!
现在,Editplus经过我们的"改造",已经可以即时的调试PHP文件了，虽然还不是"可视化"界面的，但对于一些平常的小程序来查错还是非常好用的。Editplus真是不款不可多得的好工具，如果你有什么使用技巧，不要忘了大家一起分享哦。^O^

如果不能切换错误行号，请尝试作如下修改：（by aukw）
1.php.ini 中html_errors = Off打开
//如果你不打开，3.中的表达式要修改
2.参数改成：-q -f "$(FilePath)"
//不加"符号的话文件名有空格的文件调试失败。。
//-q不输出html头信息，你去掉也行，不过调试时候你一般用不到那些header信息
3." ^.+ in (.+) line ([0-9]+) " 改成 "^.+ in (.+) on line ([0-9]+)$"
//如果还是不行，请注意调试结果，自己修改表达式来取出文件名和行号

【16】工具集成——打造 PHP 调试环境(二)
1: 把剪辑库定位在 PHP4 Functions 上就可以在编辑时, 利用[插入]->[匹配剪辑]命令,就可以自动完成末输入完整的 PHP 函数(或直接按 F2 键)
2: 类似上面,在选择部分文字后,同样可以自动完成。(同 F2)
3: 在[参数选择]->[设置和语法]->PHP->自动完成, 选择目录下的 php.acp 文件,你可以定制自己的自动完成方式.
4: 想要即时预览文件,可在[参数选择]->[工具]->WEB 服务器中添加本地目录，(注意不要加 http:// , 应是一个有效的站点)。
如: 主机->localhost/php | 根目录->D:/php
主机->localhost/asp | 根目录->D:/asp
主机->localhost/cgi | 根目录->D:/cgi
完成设置后只要脚本文件位于这些目录下(子目录也没问题), 就能够正确解释.
5: 各种语法和模板文件可以在 www.editplus.com 获得，可根据需要选用和编辑。
6: Ctrl+F11 可显示当前文件中的函数列表.
7: 添加各种用户工具.如:
启动MYSQL服务器管理工具->C:/mysql/bin/winmysqladmin.exe
启动Apache服务器->C:/Apache/bin/Apache.exe -k start
启动Apache服务器->C:/Apache/bin/Apache.exe -k stop (shutdown)
8: DBG 附带有一个 prof_results.php 文件,可剖析 PHP 程序的性能.
虽不是真正的调试器,但已经够了.
OK! 经过改造后,是不是有点象一个 IDE 什么?还差点,没有即时帮助...看我的,再来:
9: 把 php_manual_en.chm (最好是扩展帮助手册)加入到用户工具中, 当遇到需要参考的关键字时, 把光标定位其上, 按下快捷键 Ctrl+1, 看到了吗.
在输入时有想不起来的函数名时, 先按照第 1 条的方法调出函数, 然后...怎么样?

以上有的是对于调试工具的设置，由于此类工具比较多，大家设置时参考以上的基本就差不多了，所以就不过多的列举了。

【17】在 WINPE 中集成 EDITPLUS
可以基于目前的bartpe做得WINPE中，菜单使用nu2menu制作

默认位置为 /programs/editplus/
默认系统位置为光盘的 i386 目录

i386/system32 的 autorun.bat 中添加外壳集成（系统右键）
regedit /s %SystemDrive%/programs/editplus/REG.REG
regsvr32 /s /programs/editplus/EPPSHELL.DLL

复制editplus安装包里面的文件到programs/editplus/，注意，如果有setting.ini，删掉该文件在nu2menu里面加入，可以根据需要安排位于特定菜单条目下
<MITEM TYPE="ITEM" DISABLED="@Not(@FileExists(@GetProgramDrive()/Programs/EditPlus/editplus.exe))" CMD="RUN"
FUNC="@GetProgramDrive()/Programs/EditPlus/editplus.exe">EditPlus 文本编辑</MITEM>

Chinese Blogger 禾草唐楷: 博客技巧

2007-11-18T12:33:00.001-08:00

BLOGGER中如果你选择的是一个两栏模版，那么大量的外部调用你必须要全部放在SIDEBAR里边，最后造成侧栏高高耸立，在WORDPRESS中，很多发烧友设计的模版都会在文章底部集成一部分侧栏功能，通过一番演练，其实通过简单步骤就可以轻松增加新的SIDEBAR。
研究后台代码，发现SIDEBAR是通过类似代码展现的：
<div id='sidebar-wrapper'>这是侧栏装载器声明<b:section class='sidebar' id='sidebar' preferred='yes'>这是侧栏属性声明<b:widget id='BlogArchive1' locked='false' title='所有文章' type='BlogArchive'>这是内容模块声明。
好了，我们通过以上代码发现，如果你需要在BLOGGER中增加一个新的模块，那么你需要有新的装载器，新的属性声明和新的内容声明。装载器可以通过CSS来实现，定义一个新的块，包括颜色，大小，宽窄等，而属性声明可以直接拷贝原内容后略作更改，内容模块声明则是通过在后台的页面设置中增加新的页面同时设定必要的标题和内容。比如我博客底部的SIDEBAR1，代码如下：
<div id='bottom'>新的底部装载器，需要在CSS中增加，这里主要设定他的宽度和高度及背景色。
<div id='sidebar1'>拷贝SIDEBAR的代码，很轻松就实现。<b:section class='sidebar1' id='left-sidebar' preferred='yes'>继续拷贝，唯一需要注意的是修改名称以免出现重复。<b:widget id='HTML2' locked='false' title='My Recent Posts' type='HTML'>这个可以在模版页面设置中增加，这里代码显示我增加的是一个HTML/JS的新内容。剩下的都可以拷贝原侧栏代码，注意结束标记的一一对应即可大功告成。
思路总结:构思你页面中需要放置新SIDEBAR的位置，构思你装载器的色彩，宽窄及样式；根据构思写装载器CSS代码；在HTML页面中增加装载器<DIV>，抄袭原代码中的侧栏属性；在页面设置中增加新标题内容；不断调试直至彻底完工。喜欢跟代码折腾的同志，就折腾，其实折腾本身还是很有乐趣的。参考文章：BEAUTIFULBETA。

Chinese Blogger 禾草唐楷: 博客技巧

Chinese Blogger 禾草唐楷: 解答“亚一”关于blogger模版修改的问题

2007-11-18T12:07:00.001-08:00

重点提示：修改前务必备份你的代码，可以通过download的方式也可以直接把所有代码拷贝粘贴进记事本保存，以备修改崩溃后能够顺利恢复。

重要提示：在模版编辑页面，有个小的选择框，是针对所有模块的代码是否展开的选择项，我们一般修改模版和备份模版的时候都应该把这个选择项选择上，保证代码的完整性。

blogger模版中各模块介绍：

通读模版代码，你会发现主要有这么几块内容：

1，标准声明
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>

这是标准xml的声明内容，也有些后台参数，本修改与此无关，不多说。

2，头文件声明
<head>大量代码...</head>
一个头文件的声明，也包括整个模版很核心的CSS数据。我们对很多的修改是集中在对CSS的修改上，因此这块是我们关注的重点。我的模版修改的首页LOGO图，字体，字体颜色，去处顶部导航等均是在这部分操作的。

3，内容展示
<body>大量代码.....</body>
这是整个内容展示模块，所有的CSS设定通过在这个模块中产生作用并展示给用户。因为beta版本已经有了很好的可视模块添加，修改，删除等操作，因此这块仅仅是我们为了实现更多个性化操作需要了解的内容。我的添加返回首页，返回文顶，屏蔽LABEL等均是在这部分操作的。

一，如何去掉blogger的导航条（位居顶部的）

在CSS声明中添加如下代码：
#navbar-iframe {height: 0px; visibility: hidden; display: none }

我选择的位置是在头部装载器的后边，示例如下：

#header-wrapper {
background: url("") no-repeat left top;
margin:0px 0 0 0;
padding:0px 0 0 0;
color:#eae7ba;
}
#navbar-iframe {height: 0px; visibility: hidden; display: none }

二，字体应该如何设置

中文字体是非常特殊的字体，如果不能很好的设置字体，会给访问者带来不好的体验效果。当然在字体设置上也是各有所爱，我采用的字体仅仅是根据自己的喜好而定，在此提供给大家作为参考。

blogger多采用的是相对尺寸显示字体大小和字体内容，多采用的是100％，200％这样的方式，个人感觉也比较好看，配置比较规整，但是我还是选择了我更加喜欢的方式。

博客内容字体：verdana 大小：14px
博客标题字体：黑体大小：200％ 250％ 300％
全文字体：verdanna 大小：9pt

示例如下：

<Variable name="pageTitleFont" description="Blog Title Font" type="font"
default="normal bold 300% 黑体" value="normal bold 10% 黑体">
将博客标题文字最小化，因为我采用了LOGO图，不再需要标题文字及说明

<Variable name="postTitleFont" description="Post Title Font" type="font"
default="normal bold 135% 'Trebuchet MS',Verdana,Arial,Sans-serif" value="normal bold 250% 黑体">
这是文章标题字体设置

.post-body {
border:1px dotted $borderColor;
border-width:0 1px 1px;
border-bottom-color:$mainBgColor;
padding:10px 10px 1px 20px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 14px;
color: #333;
line-height: 25px;
}
这是文章字体设置，这里我设置了一个line－height：他主要的作用是在你的发帖文字那部分拉开行与行的距离，不会让文字一行挨一行的堆积在一起，行与行之间保留一定的距离为访问者看文章的时候提供一个舒适的观看效果。padding是一个在这个文字模块的周边营造一个距离空间，也是为了视觉上的美观特意设定的。我很多文章都有图片，如果不留一定的空间距离，文字紧紧贴在边框旁边或者图片旁边也是非常难看的。padding后边跟着的参数是针对上，右，下，左的顺序来定制的。

.post img {
margin:0PX 30px 5px 0px;
padding:4px;
border:1px solid $borderColor;
}
这是文章中图片属性设定，这段代码主要是设定你在发帖内容里边如果有图片，你希望他按照什么样的形式去显示，主要修改的是他的padding属性，保证图片有边框，边框距离图片多宽，以及图片外围跟文字距离多大合适。

重点提示：字体选择应该选择那些在操作系统中默认安装的字体，这些字体英文一般verdana很漂亮，中文字体宋体，黑体。尺寸大小一般小字可以设置为9pt，中号字体可以设置为14px。这些可以保证无论英文还是中文都显示更加方正规范美观。

三，如何增加一个图片性质的标题LOGO

CSS中所有的图片都是以背景图片的形式显示的，这同我们html中是有很大不同的。那么我们只需要在认为合适的地方增加一个背景图片就可以实现标题LOG图。

示例如下：
#header {
background:url("你需要的图片地址") no-repeat left bottom;
padding:0 0px 0px;
height:252px
}
在头部装载器这块增加背景图片内容，显示你的标题LOGO。height是根据你的需要设定背景图片的高度，如果省略可能会有显示不全的问题。

Chinese Blogger 禾草唐楷: 解答“亚一”关于blogger模版修改的问题

blogger:在Blogger Beta的独立文章页中增加所在位置导航

2007-11-14T14:27:00.000-08:00

这个功能可以使你在每篇文章的独立页中增加一个所在位置的导航链接，此项功能一般常见于大型的、路径比较复杂的网站，实际上在 Blogger 上不存在这种问题，但如果你愿意也还是可以加上一个，以方便你的浏览。

第一步：
进入 Template->Edit HTML ，备份，勾选 Expand Widget Templates 展开，找到 Blog1 部件 () 。将下列代码紧贴其后。

You are here:
Home & g t ;

& g t ;

然后将& g t ;中的空格全部取消。

第二部：
接着再找到这句

将下列代码紧贴其上（如图所示）：

第三步：
将下列 CSS 代码粘贴在之间任何合适的位置（如图所示）：

.breadcrumbs {
border-bottom:1px dotted $bordercolor;
margin:0 0 0.5em;
padding:0 0 0.5em;
}

具体样式可以自行修改，保存更新，大功告成。
如果你的一篇文章有多个 Label 时，它只会显示最后一个，如果你的文章没有加上 Label 的话，它就不会显示了。

希望上文对你有所帮助，如有任何疑问可留言告知，我会尽快给予回复。

Blogger: 怎样实现三栏的Blogger Beta模板

2007-11-14T13:42:00.001-08:00

11月30日在8个圈圈的Blogger上做了一个有关三栏模板和两栏模板的民意测验，结果如上。看来喜欢三栏模板的还是多数，那就介绍一下怎样实现三栏的blogger模板。
基础知识：

beta的模版编辑分为layout和html两种。
在layout中模板分成：标题、博客文章、侧边栏、页脚4个部分。
同样在html中对应有
<body>
<div id='outer-wrapper'>...外层
<div id='header-wrapper'>...标题
<div id='content-wrapper'>...内容
<div id='main-wrapper'>...帖子
<div id='sidebar-wrapper'>...侧边栏
<div id='footer-wrapper'>...页脚
</body>
这些模块对应的CSS样式信息为
#header-wrapper {
width:660px;
margin:0 auto 10px;
border:1px solid $bordercolor;
}
......
#outer-wrapper {
width: 660px;
margin:0 auto;
padding:10px;
text-align:left;
font: $bodyfont;
}
#main-wrapper {
width: 410px;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
#sidebar-wrapper {
width: 220px;
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
......
因为o们要做的就是在原有模板的基础上增加一个侧边栏，因此不需要太在意footer-wrapper。差不多可以开始了：
养成好习惯，给模板动手术前要记得备份！！！
1. 复制以下代码：
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'/>
......
</div>
将其粘贴到<div id='main-wrapper'>...前；
2. 删除其中的......部分，并将作如下修改：
<div id='l-sidebar-wrapper'>
<b:section class='sidebar' id='l-sidebar' preferred='yes'/>
</div>
3. 如果觉得有必要，可以将原来的
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'/>
......
</div>
改为
<div id='r-sidebar-wrapper'>
<b:section class='sidebar' id='r-sidebar' preferred='yes'/>
......
</div>
4. 回到CSS部分，将
#sidebar-wrapper {
width: 220px;
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
改为
#l-sidebar-wrapper {
width: 220px;
float: left;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
#r-sidebar-wrapper {
width: 220px;
float: right;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
5. 最后一步啦，因为增加了一个侧边栏，需要将原来的out-wrapper的长度从660px改为880px。
保存，看看结果还满意吗？

PS：
@冰山：这篇文章应该可以回答你的第2个问题，第1个问题请参考Blogger-Beta Hack之“导航菜单式的分类”和Beta Hack之“导航菜单式的分类”——扩展版，第3个问题：o每次都是手动添加一些相关文章。还没有看到过比较理想的自动添加相关文章的方案，一旦有了一定向大家介绍。
@avx：看了你推荐的文章，太复杂了，而且要用到js脚本，懒得尝试了。建议使用o向冰山推荐的方法（给个要分层的理由先，o空下来了再和你切磋）。

Blogger: 怎样实现三栏的Blogger Beta模板

色彩斑斓: Blogger beta技巧：添加导航栏

2007-11-14T13:40:00.001-08:00

以前我们把标签做成导航，尽管那个Hack也可以添加一些自定义的按钮，但似乎不太方便。这次我们直接得用Blogger beta里的Links Widget来制作导航，无论添加还是调节顺序都将变得非常方便。这里我们将它添加在标题之上，如果添加在标题下，需要调节Header-wrapper的大小，或者再定义一个区域。(via Hans)

1.为了让字体颜色和鼠标经过时的颜色都可以在Fonts&Colors里方便的修改，我们先定义这两个颜色的变量。

<Variable name="headerTextColor"
description="headerTextColor"
type="color" default="#000" value="#006699">
<Variable name="headerCornersColor"
description="headerConersColor"
type="color" default="#000" value="#940f04">

2.添加CSS以定义导航栏区域

#menubar h2 {display:none;}
#menubar ul {
list-style: none;
}
#menubar li {
float: left;
}
#menubar a:link, #menubar a:visited, #menubar a:hover {
padding: 5px;
display: block;
color: $headerTextColor;
}
#menubar a:hover {
background-color: $headerCornersColor;
}

3.在Html里添加相应的区域，即红色的代码。

<div id='header-wrapper'>
<b:section class='menubar' id='menubar' maxwidgets='1' showaddelement='yes'>
<b:widget id='LinkList2' locked='true' title='Menubar' type='LinkList'/>
</b:section>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='false' title='Beautiful Beta (Header)' type='Header'/>
</b:section>
</div>

色彩斑斓: Blogger beta技巧：添加导航栏

色彩斑斓: Blogger beta:把模板修改为三栏

2007-11-14T13:37:00.001-08:00

如果你的Widget较多，那么你可能会希望模板变成三栏。下面是一种方法，不过这仅仅是一个参考，不同的模板可能不同，视情况修改，记住在修改之前保存模板。
这儿我们需要自定义CSS，以设置各栏的宽度等。在Blogger中我们通过以下3部分控制页面：
#outer-wrapper - 用来定义整个页面
#main-wrapper - 用来定义文章部分
#sidebar-wrapper - 用来定义侧栏部分
在这儿，我们要添加一栏，所以我们需要再定义一个新的Wrapper，我们把新的Wrapper命名为#newsidebar-wrapper，因为大部分设置是相同的，我们只要Copy/Paste Sidebar-wrapper并做简单修改即可。
Step1：首先我们要确定各栏的宽度，推荐outer-wrapper:750px,main-wrapper:400px,两个sidebar-wrapper各为150px.要保证outer>main+sidebar*2。
Step2：修改CSS（Expand Widget Templates已选中），各个模板可能不同，在模板中找到相应的位置修改，下面是一个例子，如果需要调整页面距边框距离，请调整相应的margin值。我们通过float来控制Sidebar在不同的位置显示，如果你希望他们都在同一侧，可将它们都调整为right或left.
#outer-wrapper {
width: 750px;
...
}
#main-wrapper {
width: 400px;
margin-left: 20px;
...
}
#sidebar-wrapper {
width: 150px;
float: right;
...
}
#newsidebar-wrapper {
width: 150px;
float: left;
...
}
Step3：定义CSS之后，我们要再定义一个NewSidebar，此时关闭Expand Widget Templates即可，大约在代码的最后，你可以看到类似的代码，并添加红色标记的部分。
<div id='newsidebar-wrapper'> <b:section class='sidebar' id='newsidebar' preferred='yes'> <b:widget id='NewProfile' locked='false' title='About Me' type='Profile'/> </b:section> </div>
<div id='main-wrapper'>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='false' title='Blog Posts' type='Blog'/>
</b:section>
</div>
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='BlogArchive1' locked='false' title='Blog Archive' type='BlogArchive'/>
</b:section>
下面是鱼做完后的效果：

色彩斑斓: Blogger beta:把模板修改为三栏

色彩斑斓: Blogger beta:技巧：随机显示页首图片（Banner）

2007-11-14T13:36:00.001-08:00

此Hack（via Gabriel Lau）在每次刷新页面时随机显示页首的Banner，是不是很酷呢？这是Wordpress里一个默认的插件，现在我们也可以在Blogger beta里体验它了。

1.首先要备份你的模板，这是很重要的。另外你要为你的Blogger制作几张适合你的Blog的图片，并上传到一些图片服务器上。下面的以“Rounder4”这个模板为示例，不同的模板可能不同，因为有一些模板并没有Banner，或者位置不同，请做相应的修改。

2.先来看一下在CSS里定义Header背景的部分。这一部分不同的模板可能不同。

#header {
background:url("http://www.blogblog.com/rounders4/bg_hdr_bot.jpg") no-repeat left bottom;
margin:0 0 0;
padding:0 0 8px;
color:#fff;
}

3.我们要做的就是用脚本重写background url，把下面的代码<body>之后。

<script type="text/javascript">
var banner= new Array()

banner[0]="图片地址1"
banner[1]="图片地址2"
banner[2]="图片地址3"
banner[3]="图片地址4"
banner[4]=“图片地址5”

var random=Math.round(4*Math.random());

document.write("<style>");
document.write("#header {");
document.write(' background:url("' + banner[random] + '") no-repeat left TOP;');
document.write(" }");
document.write("</style>");

</script>

4.自定义部分。注意用红色标出的数字，如果你有N张图片，那么红色数字应该为N-1。比如这儿有5张图片，那么值为4。

5.一些补充。Blogger beta中头部CSS中以Header-wrapper来定义其样式，默认它有一个角，所以鱼把Header-wrapper去掉了，这样更和谐一些，如果你的图片比较大，可以用Height属性来定义头部的高度。如鱼用的：

#header{
background: #476 url("http://www.blogblog.com/rounders4/corners_cap_top.gif%22) no-repeat left bottom;
margin:0 0 0;
padding:0 0 8px;
color:#fff;
height:200px; }

最近好像Blogger服务器非常不稳定，经常不能保存模板。很浪费时间

色彩斑斓: Blogger beta:技巧：随机显示页首图片（Banner）

色彩斑斓: Blogger beta：头信息优化

2007-11-14T13:35:00.001-08:00

< data="'blog'" name="'all-head-content'/">
我们在Blogger Beta模板代码的头部会发现这样一条语句，它是用来做什么的呢？这条语句的作用就是加载那些无需修改的头部信息，比如RSS地址，网页编码等
那么我们可以做些什么呢？比如鱼，很希望别人订阅自己烧录的Feedburner地址，而不是Blogger默认的地址，这样更容易统计网站的信息。那么这个语句就变得非常关键了。
我们应该怎么做呢？把这条语句删除我们就可以自定义任何自己想要的信息了。其中有两条是必须要添加上的，一条是网页编码(如果你是按Blogger默认的编码就是UTF-8)，另一条是RSS。
下面是这两句的内容：
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type' />
<link href='http://feeds.feedburner.com/eool' rel='alternate' title='RSS for this blog' type='application/rss+xml' />
其它内容：
name 属性
1、<meta name="Generator" Content="">用以说明生成工具（如Microsoft FrontPage 4.0）等；
2、<meta name="KEYWords" content="">向搜索引擎说明你的网页的关键词；
3、<meta name="DEscription" content="">告诉搜索引擎你的站点的主要内容；
4、<meta name="Author" content="你的姓名">告诉搜索引擎你的站点的制作的作者；
5、<meta name="Robots" content= "all|none|index|noindex|follow|nofollow">
其中的属性说明如下：
设定为all：文件将被检索，且页面上的链接可以被查询；
设定为none：文件将不被检索，且页面上的链接不可以被查询；
设定为index：文件将被检索；
设定为follow：页面上的链接可以被查询；
设定为noindex：文件将不被检索，但页面上的链接可以被查询；
设定为nofollow：文件将不被检索，页面上的链接可以被查询。
http-equiv属性
1、<meta http-equiv="Content-Type" content="text/html";charset=gb_2312-80"> 和 <meta http-equiv="Content-Language" content="zh-CN">用以说明主页制作所使用的文字以及语言；
又如英文是ISO-8859-1字符集，还有BIG5、utf-8、shift-Jis、Euc、Koi8-2等字符集；
2、<meta http-equiv="Refresh" content="n;url=http://yourlink">定时让网页在指定的时间n内，跳转到页面http://yourlink；
3、<meta http-equiv="Expires" content="Mon,12 May 2001 00:20:00 GMT">可以用于设定网页的到期时间，一旦过期则必须到服务器上重新调用。需要注意的是必须使用GMT时间格式；
4、<meta http-equiv="Pragma" content="no-cache">是用于设定禁止浏览器从本地机的缓存中调阅页面内容，设定后一旦离开网页就无法从Cache中再调出；
5、<meta http-equiv="set-cookie" content="Mon,12 May 2001 00:20:00 GMT">cookie设定，如果网页过期，存盘的cookie将被删除。需要注意的也是必须使用GMT时间格式；
6、<meta http-equiv="Pics-label" content="">网页等级评定，在IE的internet选项中有一项内容设置，可以防止浏览一些受限制的网站，而网站的限制级别就是通过meta属性来设置的；
7、<meta http-equiv="windows-Target" content="_top">强制页面在当前窗口中以独立页面显示，可以防止自己的网页被别人当作一个frame页调用；
8、<meta http-equiv="Page-Enter" contect="revealTrans(duration=10,transtion= 50)">和<meta http-equiv="Page-Exit" content="revealTrans(duration=20，transtion=6)">设定进入和离开页面时的特殊效果，这个功能即 FrontPage中的“格式/网页过渡”，不过所加的页面不能够是一个frame页面。
Update:忘了补充了，你必须在每一条语句后面加一个“ /”以让标记“结束”，这些信息都是放在Head之间的。

色彩斑斓: Blogger beta：头信息优化

色彩斑斓: Blogger:自动隐藏搜索栏（Navbar）

2007-11-14T13:33:00.001-08:00

貌似在IE中只能隐藏。CSS标准不统一，FF下一切正常。

以前也介绍过一个简单隐藏Navbar的方法，但那种方法会完全去除Navbar，即使我们需要的时候。现在我们可以让它在鼠标移动到上面的时候显示出来。其它时候会自动隐藏，用了一个滤镜。添加下面的CSS：

#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)}
#navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}

把这些代码放在

body {
background:$bgcolor;

之上即可。

色彩斑斓: Blogger:自动隐藏搜索栏（Navbar）

GG派: blogger:如何隐藏Blogger Beta的导航条Navbar

2007-11-14T13:32:00.001-08:00

如果你正在使用 Blogger Beta 架构博客，并同时自由托管在 Blogspot 空间下的话，那在你博客的上方就一定会出现这个叫做 Navbar 的导航条了。它其实是一个功能强大的导航工具，并有4种颜色可供选择，具体操作可以参见 Blogger 的帮助文档。
但也许有人会觉得它有些碍眼，与自己的博客风格不是很搭配，等等。那这时应该怎样把它去掉呢？ Blogger 并没有提供给我们直接的操作途径，但我们依然可以通过改变模板中的 CSS 参数来达到这个效果。
首先登陆你的Blogger Beta帐户，然后点击“Template”，接着点击“Edit HTML"，先在代码中找到这一行
/* global
    
----------------------------------------------- */
再将如下代码添加至它的后面
#navbar #Navbar1 iframe{
    
height:0px;

    
display:none;

    
visibility:hidden;

    
}
事实上你也可以将这段 Hack Code 添加到 CSS 表单中的任何位置，但应该以保持表单的规整并方便查找为原则。

现在保存更改，并从新查看你的博客，这时 Navbar 就会消失了。

希望上文对你有所帮助，如有任何疑问可留言告知，我会尽快给予回复。

GG派: blogger:如何隐藏Blogger Beta的导航条Navbar

色彩斑斓: Blogger beta：一分钟修改页首图片

2007-11-14T13:31:00.001-08:00

对于像鱼一样的Slacker来说，修改模板是一件很痛苦的事.懒人就应该有懒办法，不用面对CSS/Html，只需要简单的复制/粘贴就能做到
1.切换到Layout设置
2.在Layout底部 Add Page Element——>HTML/JavaScript
3.添加并根据实际情况修改代码
<div style="position:absolute; left:0; top:57px; text-align:center; width:100%">
<a href="博客地址" />
<img src="图片地址" />
</a>
</div>
4.这个设置适于minima这个模板，修改top的值以适应不同的模板。

色彩斑斓: Blogger beta：一分钟修改页首图片

色彩斑斓: 关注博客的反向链接

2007-11-14T13:30:00.001-08:00

互联网是由链接组成的。
如果你寄生于网络上已经有很长一段时间了，那么你可能会有如此的感觉：尽管Internet非常庞大，可是要找到自己真正喜欢的内容是如此的不容易。腻烦了RSS，讨厌门户的小圈子，网络上的伪装也已感到疲惫，那么是换一种“生活方式”的时候了。
鱼现在喜欢上了一种新的网络的探索方式，就是查看自己网站的反射链接然后一一“拜访”他们，这是真正跟自己的生活相关的，也是所熟悉的、喜欢的。未来的SNS应该包含发现的快乐。
我们应该如何更快、更全面的找到自己Blog的反向链接呢？Technorati是Blog世界里的Google，因此用它来跟踪我们的链接是最佳工具，尽管它在中国已经被封,可是我们可以通过国外的Rss阅读工具如Google reader来订阅自己的地址的反射链接。形式如下：
反向链接：
http://feeds.technorati.com/search/sunr.blogspot.com
关注的内容：
http://feeds.technorati.com/search/咖啡鱼
 Google blogsearch也支持搜索结果订阅，只要到Google blogsearch搜索“ link:网址 ”,然后在侧边栏就会提供四种形式的Rss订阅地址。例如鱼搜索 link:sunr.blogspot.com 然后得到的Rss地址为：http://blogsearch.google.com/blogsearch_feeds?hl=en&q=link:sunr.blogspot.com&ie=utf-8&num=100&output=atom
抓虾用户可以用Feedburner烧制Technorati的Rss，然后再订阅。

色彩斑斓: 关注博客的反向链接

色彩斑斓: Blogger beta：图片解剖Blogger beta模板代码

2007-11-14T13:28:00.001-08:00

说明(点击看大图)：
1.所有蓝色的部分都是位于Style标记之间的CSS样式表代码，红色的部分是位于Body标记之间的Html代码。
2.并不是所有的模板都完全一样，但大体类似。
3.享受自己的Hack吧^-^
4.via Blogatech
A)头部（Header）。此部分位于页首部，包含标题和网站描述，概括了整个页首部分。

CSS=

#header {
width:660px;
margin:0 auto 10px;
border:1px solid #ccc;
}

HTML=

<div id="header">
<h1 id="blog-title">
<ItemPage><a href="<$BlogURL$>"></ItemPage>
<$BlogTitle$>
<ItemPage>
</h1>
<p id="description"><$BlogDescription$>
</div>

B）导航栏（Navigation Bar）。此部分代码默认在代码中是不显示的。如果你要去掉NavBar只要在CSS中添加以下代码即可：

CSS=

#b-navbar { height:0px; visibility:hidden; display:none
}

C) Blog标题（Blog title）

CSS=

#blog-title {
margin:5px 5px 0;
padding:20px 20px .25em;
border:1px solid #eee;
border-width:1px 1px 0;
font-size:200%;
line-height:1.2em;
font-weight:normal;
color:#666;
text-transform:uppercase;
letter-spacing:.2em;
}
HTML=
<$BlogTitle$>

D)Blog 描述（Blog Description）

CSS=
#blog-description {
margin:0 5px 5px;
padding:0 20px 20px;
border:1px solid #eee;
border-width:0 1px 1px;
max-width:700px;
font:78%/1.4em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif;
text-transform:uppercase;
letter-spacing:.2em;
color:#999;
}
HTML=
<$BlogDescription$>

E)Blog日期首（Blog Date Header）。贴子发布时自动生成日期。

CSS=
h2 {
margin:1.5em 0 .75em;
font:78%/1.4em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif;
text-transform:uppercase;
letter-spacing:.2em;
color:#999;
.date-header {
margin:1.5em 0 .5em;
}
HTML=
<BlogDateHeader>
<h2 class="date-header"><$BlogDateHeaderDate$></h2>
</BlogDateHeader>

F)文章标题（Blog Item Title)

CSS=
.post-title {
margin:.25em 0 0;
padding:0 0 4px;
font-size:140%;
font-weight:normal;
line-height:1.4em;
color:#c60;
HTML=
<BlogItemTitle>
<h3 class="post-title">
<BlogItemUrl><a href="<$BlogItemUrl$>" title="external link"></BlogItemUrl>
<$BlogItemTitle$>
<BlogItemUrl></a></BlogItemUrl>
</h3>
</BlogItemTitle>

G)文章区域（Post Division）。此部分包含了Blog Date header, Blog Item Title, Blog Item Body 和 Blog Item Footer。

CSS=
.post {
margin:.5em 0 1.5em;
border-bottom:1px dotted #ccc;
padding-bottom:1.5em;
.post div {
margin:0 0 .75em;
line-height:1.6em;
HTML=
<div class="post">
</div>

H)文章援引区域（Post Block Quote）

CSS=
.post blockquote {
margin:1em 20px;
}
.post blockquote p {
margin:.75em 0;
}
HTML=
<blockquote>

I)文章文字区域（Blog Item Body)

CSS= .post div {
margin:0 0 .75em;
line-height:1.6em;
}
HTML=
<$BlogItemBody$>

J)个人资料部分（Blog Member Profile Division）

CSS=
#profile-container {
margin:0 0 1.5em;
border-bottom:1px dotted #ccc;
padding-bottom:1.5em;
}
.profile-datablock {
margin:.5em 0 .5em;
}
.profile-img {
display:inline;
}
.profile-img img {
float:left;
padding:4px;
border:1px solid #ddd;
margin:0 8px 3px 0;
}
.profile-data {
margin:0;
font:bold 78%/1.6em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif;
text-transform:uppercase;
letter-spacing:.1em;
}
.profile-data strong {
display:none;
}
.profile-textblock {
margin:0 0 .5em;
}
.profile-link {
margin:0;
font:78%/1.4em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif;
text-transform:uppercase;
letter-spacing:.1em;
}
HTML=
<$BlogMemberProfile$>

K)文章底部（Post Footer）这部分包含了Authors Nickname, Item Date Time, Item Comment Count, Comments and blog item control variables等

CSS=
p.post-footer {
margin:-.25em 0 0;
color:#ccc;
}
.post-footer em, .comment-link {
font:78%/1.4em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif;
text-transform:uppercase;
letter-spacing:.1em;
}
.post-footer em {
font-style:normal;
color:#999;
margin-right:.6em;
}
HTML=
<p class="post-footer">
<em>posted by <$BlogItemAuthorNickname$> at <a href="<$BlogItemPermalinkUrl$>" title="permanent link"><$BlogItemDateTime$></a></em>
<MainOrArchivePage><BlogItemCommentsEnabled>
<a class="comment-link" href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnclick$>><$BlogItemCommentCount$> comments</a>
</BlogItemCommentsEnabled><BlogItemBacklinksEnabled>
<a class="comment-link" href="<$BlogItemPermalinkUrl$>#links">links to this post</a>
</BlogItemBacklinksEnabled>
</MainOrArchivePage> <$BlogItemControl$>
</p>

L)链接（Links）

CSS=
a:link {
color:#58a;
text-decoration:none;
}
a:visited {
color:#969;
text-decoration:none;
}
a:hover {
color:#c60;
text-decoration:underline;
}
a img {
border-width:0;
}
#sidebar ul {
margin:0 0 1.5em;
padding:0 0 1.5em;
border-bottom:1px dotted #ccc;
list-style:none;
}
HTML=
<h2 class="sidebar-title">Links</h2>
<ul>
<li><a href="http://news.google.com/">Google News</a></li>
<li><a href="http://help.blogger.com/bin/answer.py?answer=110">Edit-Me</a></li>
<li><a href="http://help.blogger.com/bin/answer.py?answer=110">Edit-Me</a></li>
</ul>

M)之前文章（Previous Posts）

CSS=
#sidebar ul {
margin:0 0 1.5em;
padding:0 0 1.5em;
border-bottom:1px dotted #ccc;
list-style:none;
}
h2 {
margin:1.5em 0 .75em;
font:78%/1.4em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif;
text-transform:uppercase;
letter-spacing:.2em;
color:#999;
}
HTML=
<h2 class="sidebar-title">Previous Posts</h2>
<ul id="recently">
<BloggerPreviousItems>
<li><a href="<$BlogItemPermalinkURL$>"><$BlogPreviousItemTitle$></a></li>
</BloggerPreviousItems>
</ul>

N)存档（Archives ）

CSS=
#sidebar ul {
margin:0 0 1.5em;
padding:0 0 1.5em;
border-bottom:1px dotted #ccc;
list-style:none;
}
h2 {
margin:1.5em 0 .75em;
font:78%/1.4em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif;
text-transform:uppercase;
letter-spacing:.2em;
color:#999;
}
HTML=
<h2 class="sidebar-title">Archives</h2>
<ul class="archive-list">
<BloggerArchives>
<li><a href="<$BlogArchiveURL$>"><$BlogArchiveName$></a></li>
</BloggerArchives>
</ul>

O)侧边栏区域。此部分包含了Member Profile, Links, Resent Posts and Archives等

CSS=
#sidebar {
width:220px;
float:right;
}
#sidebar ul {
margin:0 0 1.5em;
padding:0 0 1.5em;
border-bottom:1px dotted #ccc;
list-style:none;
}
#sidebar li {
margin:0;
padding:0 0 .25em 15px;
text-indent:-15px;
line-height:1.5em;
}
#sidebar p {
color:#666;
line-height:1.5em;
HTML=
<div id="sidebar"><div id="sidebar2">
</div>

P)页脚部分

CSS=
#footer {
width:660px;
clear:both;
margin:0 auto;
}
#footer hr {
display:none;
}
#footer p {
margin:0;
padding-top:15px;
font:78%/1.6em "Trebuchet MS",Trebuchet,Verdana,Sans-serif;
text-transform:uppercase;
letter-spacing:.1em;
}
#sidebar p {
color:#666;
line-height:1.5em;
HTML=
<div id="footer"><hr />
<p> </p>
</div>

色彩斑斓: Blogger beta：图片解剖Blogger beta模板代码

色彩斑斓: Blogger简单代码修改

2007-11-14T13:26:00.001-08:00

在不同的浏览器中显示可能会不一致
1.为标题设置固定链接
有些模板并未提供此功能，这给引用日志带来了不便，通过添加简单代码即可实现。
找到如下代码（使用时请将《》改为<>）：
《!-- Begin .post --》
《div class="post"》《a name="《$BlogItemNumber$》"》《/a》
《BlogItemTitle》
《h3 class="post-title"》
《BlogItemUrl》《a href="<$BlogItemUrl$>" title="external link"》
《/BlogItemUrl》
《a href="<$BlogItemPermalinkUrl$>"》《$BlogItemTitle$》《/a》
最后一行即为要使用的代码。
2.文字汉化
个人资料无法汉化。唯一的做法就是自己用语句引用图片和链接
在代码中找到相应的英文字符，直接替换成中文即可。以我的模板为例，代码如下
（不同模板代码不一定完全相同，另外我添加了一个"固定链接"并更改了顺序，请注意）：
《!-- Begin .post --》
《div class="post"》《a name="《$BlogItemNumber$》"》《/a》
《BlogItemTitle》
《h3 class="post-title"》
《BlogItemUrl》《a href="《$BlogItemUrl$》" title="external
link"》《/BlogItemUrl》
《a
href="《$BlogItemPermalinkUrl$》"》《$BlogItemTitle$》《/a》
《BlogItemUrl》《/a》《/BlogItemUrl》
《/h3》
《/BlogItemTitle》
《div class="post-body"》
《div》
《$BlogItemBody$》
《/div》
《/div》
《p class="post-footer"》
《em》《$BlogItemAuthorNickname$》于《$BlogItemDateTime$》
发布《/em》
《MainOrArchivePage》《BlogItemCommentsEnabled》
《font size=2》《a class="comment-link"
href="《$BlogItemPermalinkUrl$》"
title="固定链接"》固定链接《/a》《a class="comment-link"
href="《$BlogItemCommentCreate$》"《$BlogItemCommentFormOnclick$》》《$BlogItemCommentCount$》
评论《/a》《/font》
《/BlogItemCommentsEnabled》《BlogItemBacklinksEnabled》
《font size=2》《a class="comment-link"
href="《$BlogItemPermalinkUrl$》#links"》引用通告《/a》《/font》
《/BlogItemBacklinksEnabled》
《/MainOrArchivePage》《$BlogItemControl$》
《/p》
《/div》
《!-- End .post --》
《!-- Begin #comments --》
《ItemPage》
《div id="comments"》
《BlogItemCommentsEnabled》《a name="comments"》《/a》
《h4》《$BlogItemCommentCount$》评论:《/h4》
《ul》
《BlogItemComments》
《li id="c《$BlogCommentNumber$》"》《a
name="c《$BlogCommentNumber$》"》《/a》
《p class="comment-data"》At 《a href="#c《$BlogCommentNumber$》"
title="comment permalink"》《$BlogCommentDateTime$》《/a》,
《$BlogCommentAuthor$》 said…《/p》
《div class="comment-body"》
《p》《$BlogCommentBody$》《/p》
《$BlogCommentDeleteIcon$》
《/div》
《/li》
《/BlogItemComments》
《/ul》
《p class="comment-data"》
《$BlogItemCreate$》
《/p》
《/BlogItemCommentsEnabled》
《BlogItemBacklinksEnabled》
《a name="links"》《/a》《h4》引用通告:《/h4》
《dl id="comments-block"》
3.链接下划线、背景色的修改
因为Blog里链接较多，带上下划线会显得杂乱，尤其是sidebar看起来相当不爽。通过CSS全局设置即可去除下划线以及添加鼠标经过时的背景色。此代码要跟在《style
type="text/css"》之后，代码如下：
去除下划线：a{TEXT-DECORATION:none}
添加背景：a:hover {
text-decoration:none;
background-color: #70e1ff;
}
红色字体为相应颜色值，在此附上一组比较漂亮的颜色代码
4.Flickr
Sidebar上的Flickr徽章的代码也经过了修改，去掉了广告性质的两个链接，看起来舒服多了，不妨自己试一试。

色彩斑斓: Blogger简单代码修改

GG派: blogger beta:beta的基础知识图解

2007-11-14T13:25:00.001-08:00

2006年12月18日星期一

blogger beta:beta的基础知识图解

GG派: blogger beta:beta的基础知识图解

Blogger Hacks总集

2007-11-14T12:54:00.001-08:00

在网上查看了一圈，跟着别人的方法，又简单地更新了一下褪墨：在右上角加入导航栏。然后顺便看到一个Blogger Hacks总集，贴了过来，分享给大家：

1。现成的模板： 8个新的三栏式模板 12个可更换主题的模板 hoctro的高级模板 anki的模板 son of moto模板 underwater

2。 hack/扩展的基础知识：基础知识图解 blogger的简单代码修改图片剖析模板代码关注博客的反向链接

3。模板头部：一分钟修改页首图片隐藏navbar 会自动隐藏/出现的navbar 随机显示页首图片头信息优化

4。模板结构：把模板修改为三栏咖啡鱼版把模板分为三栏8个圈圈版把代码复制进博客模板里无法保存的解决给文章页增加跳转到页首的按钮能够一键变更模板布局的hack1 模板布局的hack2

5。侧边栏：折叠式链接列表一键增加折叠式链接在侧边栏展开收缩项目

6。帖子页：在首页展开收缩文章即增加阅读全文选项给单独文章页增加所在位置的导航以标签定位以时间定位解决部分帖子在IE下无法显示的hack 带有按钮效果的图片和链接给帖子增加两个可以直达文章顶部或页首的按钮自定义博客里的引用样式1 样式2 以日历的形式显示首页文章的日期如何在一般文章中添加代码如何在文章里显示代码框添加google map 首字下沉

7。评论：高亮作者评论在首页展开收缩评论利用light box做的页内评论一键添加最新评论模块在文章页的评论边上出现头像

8。搜索：添加站内搜索（使用navbar的搜索）横向式的ajax 搜索（代码详解）侧边栏样式的ajax搜索把ajax地图，视频，文字搜索全部加到你博客上

9。标签：“下拉标签/分类” 把标签栏改成标签订阅RSS 下拉菜单形式的标签为标签添加说明标签页面元素添加标签云

10。导航条：把标签做成导航条添加导航条 CSS做的的自动下拉式导航条

11。相关文章：给博客添加相关文章模块（通过标题）通过标签来鉴别的相关文章模块一键添加最新文章的模块

12。简化显示：标题形式显示所有文章（补充） Blogger beta收缩/展开文章让某一项只在首页（非首页）显示存档/标签页仅显示标题文章按标签分类的页面元素随机显示十条信息的页面元素

13。RSS供稿：更改默认feed订阅地址 feed按钮的制作另外一种侧边栏feed按钮标签RSS的准确地址

14。美化：页面加载的转换效果

15。google adsense：如何把google ad放进你得文章页内

16。链接：让链接在新窗口打开增加snap链接预览让你的链接更迷人一些

17。其他：添加公告栏增加滚动条去掉首页地址的多余部分控制模块在不同的页面显示记录访问者的上次浏览时间

弥缝's 博客分享: Blogger Hacks总集

如何在Blogger首页显示文章的摘要

2007-11-14T11:51:00.001-08:00

Blog提供的模板样式都比较好看，视觉效果挺好的。但是有个问题一直让我耿耿于怀，就是Blog首页不能显示文章摘要，造成首页太长，看到浏览器侧面的导航条缩成小小一块，感觉很不好，而且不容易找到兴趣内容。于是在网上寻找显示摘要的办法，总结一下，存在手动和自动两种方案。

一、自动化方案：

这个方案使用了overflow属性，即定义一个文章显示的样式框，指定高度，超出高度的部分用省略号代替。首先在样式表中添加代码：
.post-body_new{
border-right:0 px;
border-top:0 px;
border-left:0px;
border-bottom:0px;
height:100px;
overflow:hidden;
text-overflow:ellipsis;
}
改动 height，就可以改动首页文章显示的高度，这里是100px。
接着在找到代码<p><data:post.body></p>，改为：
<b:if cond='data:blog.pageType !="item"'>
<div class='post-body2'>
<data:post.body/>
</div><p>......<a expr:href='data:post.url' title='阅读全文'><b>[阅读全文]</b></a></p>
<b:else/>
<data:post.body/>
</b:if>
优点：方便，不用人工介入，系统自动截取文章的一部分进行显示，而且页面非常整齐，一块一块的，真正体现什么叫豆腐块文章。
缺点：很短的文章，下面一样留一块空白，因为样式框的高度是固定的。不能控制显示内容。
二、手动方案：
找到代码<p><data:post.body></p>，改为
<b:if cond='data:blog.pageType == "item"'>
<style type='text/css'>.fullpost
{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style type='text/css'>.fullpost
{display:none;}</style>
<p><data:post.body/></p>
<p>...<br/><a
expr:href='data:post.url'>阅读全文...</a></p>
</b:if>
保存模板。这个模板的意思就是，在文章页面全文显示，在首页，则隐藏<span
class="fullpost"></span>之间的内容并增加“阅读全文”的链接。因此，以后发表文章的时候，注意手动添加代码<span class="fullpost"></span>将需要需要隐藏的部分包起来。通常做法是在文章模板处添加帖子模板：
<span class="fullpost">
</span>
优点：自行控制显示内容，可以很好的把文章的摘要或者主要内容显示在首页上，一目了然。
缺点：稍复杂一些，在输入文章的时候要注意添加模板。

天南地北戈壁沙漠: 如何在Blogger首页显示文章的摘要

如何将作者姓名链接到我的团队 Blog 中的个人资料？

2007-11-14T11:10:00.001-08:00

如何将作者姓名链接到我的团队 Blog 中的个人资料？

如果有多个人在您的 Blog 上发帖，您也许希望将其设置成使帖子末尾的人名链接到他们的个人资料。目前评论可以自动执行此项功能，但是对于普通的帖子还没有此功能。以下方法可以实现类似功能。

首先，您需要获得要在 Blog 上发帖的每个人的个人资料地址。各个地址形式如下所示：http://www.blogger.com/profile/XXXXXXX，其中 "XXXXXXX" 是一个特定的 ID 号。请注意每个人的 ID 号。

然后，在模板的 HTML <head> 标记间添加以下代码：
<script type="text/javascript"> var team = new Array(); team["First Member"]="XXXXXXX"; team["Second Member"]="YYYYYYY"; team["Third Member"]="ZZZZZZZ"; function makeprofilelink (authorname) { var pid = team[authorname]; document.write("<a href=\"http://www.blogger.com/profile/" + pid + "\">" + authorname + "</a>"); } </script>
用第一个成员帖子上显示的名称替代"First Member"，并用其个人资料对应的 ID 号替代 "XXXXXXX"。对第二个成员重复同样的操作，并以此类推。您可以根据需要添加任意多的行数。

现在，请看看模板上 <Blogger> 标记之间的部分，帖子本身就显示在此处。根据您所拥有的模板类型，您在此处应该可以找到 <$BlogItemAuthorNickname$> 或 <data:post.author/> 标记。它列出了每个人的显示名称。使用以下内容替代此标记：

（用于经典模板）

<script type="text/javascript"> makeprofilelink("<$BlogItemAuthorNickname$>"); </script>

（用于布局）

<script type="text/javascript"> makeprofilelink("<data:post.author/>"); </script>

完成所有操作后，请进行预览以确认其显示正常，然后保存所做更改并重新发布。最终结果将是每个帖子的末尾会以如下形式显示，并且名称会链接到相应的个人资料：

... blah blah blah，帖子到此结束。

# Graham 于 4:14 pm 发布。

请注意：

在任何时候添加新成员或成员更改其显示名称后，您都需要更新成员的列表及其 ID 号。

每个成员使用的显示名称都应该唯一，这样他们才能被链接到正确的个人资料。

如何将作者姓名链接到我的团队 Blog 中的个人资料？

我还可以利用 CSS 的哪些其他功能？

2007-11-14T11:07:00.001-08:00

Blog 外观的各个方面几乎都可以通过模板中的样式表来进行更改。下面列出了一些最常见的项目。要查看更为深入的教程及示例，请参阅 W3 Schools CSS Examples（W3 学校 CSS 示例）和 W3C Introduction to CSS（W3C 的 CSS 简介）。

我们的默认模板中包括接近顶部的介于 <style></style> 标记之间所有 CSS 信息。您将在那里看到很多行，显示为：

突出显示的行是应用于 Blog 中所有 <h3> 标记的样式。我们在这里主要为您介绍如何通过一些选项来设置样式。下面的任何一段代码都可以插入到样式表中的 { 大括号 } 内。

代码
示例

颜色

color:blue;
此文字是蓝色的。

background:yellow;
此代码将背景设置为黄色。

可以在这里插入许多常用颜色的名称（例如，red、green、yellow），要选用范围更宽广的颜色，可以使用十六进制代码（例如，#0033AA）。有关颜色的详细信息，请参阅 Web 颜色参考。

边框

border:solid 1px red;

此代码将边框设置为红色。

边框既可以是实线，也可以是点线或虚线。这里指定的宽度以像素 (px) 为单位。颜色既可以是名称，也可以是十六进制代码。要设置单侧边框，请使用 border-top、border-bottom、border-right 或 border-left。

字体

font-family:"Times New Roman",Serif;
此代码将字体设置为 serif。

font-family:Verdana,Sans-Serif;
此代码将字体设置为 sans-serif。

您可以指定一个字体列表。如果读者的计算机没有第一个选项，将使用第二个，依此类推。如果在代码中指定了"serif"，则使用的字体是任何一种可用 serif 字体。

font-size:24px;
此文字的高度为 24 像素。

字号的单位可以是像素 (px)、磅 (pt)、英寸 (in) 或默认字号的百分比 (%)。

font-weight:bold;
此文字是粗体。

您可以选择 bold（粗体）或 normal（常规）。

text-decoration:underline;
此文字带下划线。

文字的修饰效果可以设置为 none（无）、underline（下划线）、overline（上划线）或 line-through（删除线）。这是删除链接中的下划线最常用的方法。

text-align:right;

此文字右对齐。

对齐方式可以设置为 left（左对齐）、right（右对齐）、或 justify（两端对齐）。

外边距和内边距

margin:15px;

所有外边距均为 15px。

padding:15px;

所有内边距均为 15px。

内边距和外边距均指某个对象周围的空间。区别在于外边距指边框外侧的距离，而内边距指边框内侧的距离。（这里的边框仅仅是一个例子。）
对于边框，可以分别使用 margin-left（左外边距）、padding-top（上内边距）等一一设置与上下左右边框的距离，也可以使用 margin:1px 2px 3px 4px;（依次为上、右、下、左）一次性设置与各边框的距离。

备注：
如果要一次性设置帖子中某一段特定文字的格式，还可以使用直列式。下面是要使用的格式：
<span style="color:red;">此文字将为红色。</span>

我还可以利用 CSS 的哪些其他功能？

用于布局的字体和颜色标记

2007-11-14T11:05:00.001-08:00

如果您熟悉 HTML 或 CSS，则可以随意修改模板的字体和颜色。不过，如果您想让模板使用"Blogger 布局"的"字体和颜色"功能，就需要遵循一些原则。这样，如果您稍后改变主意，可以更加轻松地修改颜色。这么做在您与他人共用模板，而他们想要稍微自定义其模板的情况下，也会很有帮助。

在代码的 <head> 段，您需要一对 <b:skin> </b:skin> 标记。CSS 样式声明会插在这对标记之间，附带变量名称，使您的设计能够在"字体和颜色"页面中发挥作用。进一步讨论之前，请先查看下列简单的代码示例：
<head> ... <b:skin> <style type='text/css'> /* * Variable definitions: * <Variable name='bgcolor' description='Page Background Color' type='color' default='#fff'/> */ body { background: $bgcolor; margin: 0; padding: 40px 20px; } </style> </b:skin> </head>
CSS 代码的第一部分包含在 /* and */ 注释标记中，使 CSS 代码仅供 Blogger 内部使用，而不会出现在您的博客上。这里会有一个变量列表，每个您希望能在"字体和颜色"标签中修改的字体或颜色都有一个变量。要让上述示例能够显示信息，每个变量都不可或缺，以下针对每个变量加以说明：

name - 此名称只能包含字母或数字，而且模板中的每一个名称必须是独一无二的。

description - 可以是较具描述性的名称，且包含空格。此变量会出现在"字体和颜色"标签中。

type - 可以是"字体"或"颜色"。

default - 默认值。对于颜色，此变量应是十六进制颜色代码，例如 #FF0066。对于字体，此变量会是font-style font-weight font-size font-family 格式的列表。

设定变量后，代码的其它部分看起来就像常规 CSS，除了一项例外。无论何时，当您想使用已设定变量的颜色或字体时，需要输入 $variable_name，而不是实际的颜色或字体。在上述示例中，您可以看到我们创建了一个名为 bgcolor 的变量，并将其设置为白色 (#fff)。接着，在代码中，我们不会直接说将正文背景属性设置为白色，而是说 background: $bgcolor。这样仍然能够使背景变成白色，不同之处在于，如果我们想要的话就能轻松地在"字体和颜色"标签中进行更改。

设计模板时，您需要为想要控制的所有字体和颜色添加许多变量。不过，您不需要为其他类型的 CSS 属性创建变量。这些变量将如往常般包含在 CSS 中（如同上述示例中的 margin: 和 padding: 属性）。

用于布局的字体和颜色标记

用于布局的窗口小部件标记

2007-11-14T11:03:00.001-08:00

创建窗口小部件的基本 <b:widget> 标记在用于布局的页面元素标记中介绍。如果您只想使用"页面元素"标签完成所有工作，那么了解这里的内容就已经足够了。不过，如果您想要更加精细的控制，并且在"编辑 HTML"页的"扩展窗口小部件模板"模式下工作，本文会告诉您可在窗口小部件中放入哪些元素。

首先要添加结束标记。因此：
<b:widget [...属性...]/>
就变成：
<b:widget [...属性...]> </b:widget>

现在，让我们来讨论可以在标记之间放置哪些元素。

包含

窗口小部件的内容包含在"includable"段中，其格式如下：
<b:includable id='main' var='thiswidget'>     [在此插入您想要的任何内容] </b:includable>

属性如下：

ID：（必需）由字母和数字组成且独一无二的标识符。

var：（可选）由字母和数字组成的标识符，用于引用此段内的数据。（请参阅下面的"数据"部分。）

每个窗口小部件都应有一个 id='main' 的可包含内容。这样通常会包含此窗口小部件可显示的大多数或全部内容，而这些内容大多是您所需要的。

如果您有多个具有不同 ID 的可包含项，则系统无法自动显示这些可包含项。不过，如果让其中一个可包含项包含 id='new'，则可在主包含项中以 <b:include name='new' /> 格式引用该项，而该项也会如此显示。

b:include 标记的属性如下：

name：（必需）由字母和数字组成的标识符。应与同一窗口小部件中现有 b:includable 的 ID 匹配。

data：（可选）要传递到 includable 段的表达式或数据片断。在 includable 段中，这也是 var 属性的值。

下例演示如何使用 b:includable 和 b:include。"循环"和"数据"将在本文的稍后部分介绍。此处需要了解的主要内容是"main"段如何将"post"段包含在内。它将自己命名为"i"的帖子传递下去，而包含在内的段则引用它作为变量"p"的值，然后输出标题。

<b:includable id='main'>    <b:loop var='i' values='posts'>       <b:include name='post' data='i'/>    </b:loop> </b:includable> <b:includable id='post' var='p'>    Title: <data:p.title/> </b:includable>

如果想在不同的位置重复使用一段代码，"包含"是最有用的方法。您可以只写这些代码一次，将其置入 b:includable 中，然后在需要时使用 b:include。如果您不需要这样做，那么可以只使用单个主包含项，而忽略其他部分。（请注意，系统会自动包含 main includable 段，因此没有必要添加 <b:include name='main'/>。）

数据

事实证明，data: 标记是最重要的标记之一，因为它才是呈现所有实际内容的途径。此标记的示例如下：
<data:title/>
or
<data:photo.url/>

第一个示例最简单，且适用于大多数的窗口小部件，因为大多数窗口小部件都有标题。此属性只需要输出窗口小部件的标题即可。第二个示例显示较复杂的变量，我们从中选取了一个特殊组件。对个人资料窗口小部件来说，photo 可包含 url、height 和 width 等组件。使用符号 (".") 表示我们需要此照片的网址，而不是其他内容的网址。

使用 data: 标记，您可以访问很多数据，且此标记会因您所使用的窗口小部件不同而异。我们提供了一份完整的列表帮助您查找需要的数据。

循环

b:loop 标记可让您多次重复一段内容。如果要输出指定页面帖子列表中的每个帖子、评论列表中的每条评论或标签列表中的每个标签等项目，这是最常用的标记。使用循环的一般格式为：

<b:loop var='identifier' values='set-of-data'>    [此处为重复的内容] </b:loop>

"identifier"部分可以是任意选择的名称，每次执行循环时，都会使用列表中每个新项目的标识符。常见的做法就是将其简称为"i"。您为值指定的一组数据可以是数据标记文章项目列表中的任何一段数据。例如，在博客帖子窗口小部件中，posts 就是一个列表。下列代码循环执行到每个帖子，输出每个帖子的标题，标题两侧为标题标记。

<b:loop var='i' values='data:posts'>    <h2><data:i.title/></h2> </b:loop>

请注意"i"如何依次取用每个帖子的值，使您能从每个帖子中取得标题。

条件循环

您可以使用 b:if 和 b:else 在某些位置显示特定内容，而在其他位置不显示。一般格式如下：

<b:if cond='condition'>    [条件为"真"时显示的内容] <b:else/>    [条件为"假"时显示的内容] </b:if>

b:else 标记为可选。如果没有此标记，输出结果可以是 b:if 段列出的内容或空白。但是，无论哪种情况，都需要添加结束标记 </b:if>。

关于"条件"，您可以置入任何为真或假的内容。某些数据标记本身就是真或假值，如帖子上的 allowComments。对于其他数据段，您可以通过与特定的值进行比较来得出真或假结果。请见下例：

<b:if cond='data:post.showBacklinks'>如果当前帖子设置为显示反向链接则为真。

<b:if cond='data:blog.pageType == "item"'>如果当前页为项目页（帖子页）则为真。

<b:if cond='data:displayname != "Fred"'>如果不是张三的显示名称则为真。

<b:if cond='data:post.numComments > 1'>如果当前帖子有多条评论则为真。

用于布局的窗口小部件标记

如何创建新窗口小部件以便其他用户添加到其布局中？

2007-11-14T10:57:00.001-08:00

Blogger 的布局功能可以使用户以各种引人注目的新颖方式自定义其博客。更妙的是，您可以设计新窗口小部件或模块，以便其他用户将您的博客添加到其自己的博客。

常规原则如下：首先，设计您的窗口小部件。然后，在您的网站上，创建向 Blogger 发送网站结果内容的表单。在此表单中包含已创建的窗口小部件的内容，还可能包含一些其他可选信息。如果某人在您的表单上单击了"提交"按钮，则将转到 Blogger 的特定位置，可在此处将您的窗口小部件添加到其自己的博客布局（如下所示）中。

让我们看一个简单的示例。以下代码为用户提供了标为"添加 Blogger 言论窗口小部件"的单个按钮。单击此按钮可以使用户将一个窗口小部件添加到其链接到正式 Blogger 言论博客的布局中。
<form method="POST" action="http://beta.blogger.com/add-widget"> <input type="hidden" name="widget.title" value="Blogger Buzz"/> <input type="hidden" name="widget.content" value="&lt;a href='http://buzz.blogger.com/'&gt;阅读最新 Blogger 新闻！&lt;/a&gt;"/> <input type="hidden" name="widget.template" value="&lt;data:content/&gt;" /> <input type="hidden" name="infoUrl" value="http://buzz.blogger.com"/> <input type="hidden" name="logoUrl" value="http://www.blogger.com/img/icon_logo32.gif"/> <input type="submit" name="go" value="添加 Blogger 言论窗口小部件"/> </form>
您将注意到，我们在此处使用了隐藏的输入字段，因为我们不希望用户更改任何信息，并且希望每个人都获得相同的窗口小部件。您可以轻松地使用其他种类的表单字段（例如，如果您希望用户自己为窗口小部件输入标题）。重要的是表单字段的 name 属性，而不是 type 属性。

表单的重要部分如下：

form action="http://beta.blogger.com/add-widget" - （必填）表单的信息提交必须到此网址，以便 Blogger 对其进行正确处理。我们建议您使用 POST 方法提交，但如果您的窗口小部件中没有太多数据，也可以使用 GET 方法。

widget.title -（可选）当用户编辑其布局时，您指定的标题将显示在用户的"页面元素"标签中。它还将显示为默认窗口小部件模板的一部分。标题最长可达 100 字符，并且可以包含格式正确的 HTML。

widget.content -（必填）这是窗口小部件的实际内容（将显示在用户的博客上）。它可以包含您要的几乎所有格式正确的代码（<html> 和 <body> 标记除外）。但是请注意，您需要忽略此代码，如以上示例所示（如 <a> becomes <a>）。

widget.template -（可选）应遵循 widget 标记指南。您还可以使用所有的全局可用的数据标记。如果未指定模板，它将默认使用 <data:title/> <data:content/>。

infoURL -（可选）可用来在您的站点上指定某个页面以描述您的窗口小部件或有关它的其他信息。当添加窗口小部件时，它将用作人们看到的设置页面上的"详细信息"链接。

logoURL -（可选）可以在此处添加图片链接，该图片将显示在"详细信息"链接旁边。图片大小应如缩略图（即，小于 100x100 像素）。

既然我们有了一个基本概念，下面让我们来看一看更有趣的示例。
<form method="post" action="http://beta.blogger.com/add-widget"> <input type="hidden" name="infoUrl" value="http://flickr.com"/> <input type="hidden" name="logoUrl" value="http://www.flickr.com/images/flickr_logo_gamma.gif"/> <input type="hidden" name="widget.title" value="Puppies!"/> <textarea name="widget.content" style="display:none;"> &lt;/a&gt;&lt;div id='flickr_badge_wrapper'&gt; &lt;script type='text/javascript' src='http://www.flickr.com/badge_code_v2.gne?show_name=1& count=3&display=latest&size=t&layout=x&source=all_tag& tag=puppy'&gt;&lt;/script&gt; &lt;span id='flickr_badge_source_txt'&gt;More &lt;a href='http://www.flickr.com/photos/tags/puppy/'&gt; Flickr photos tagged with puppy&lt;/a&gt;&lt;/span&gt; &lt;br clear='all' /&gt;&lt;/div&gt; </textarea> <input type="hidden" name="widget.template" value="&lt;data:content/&gt; /> <input type="submit" name="go" value="Add Puppy Photos"/> </form>
在这种情况下，我们转到 Flickr.com 以浏览标记为"小狗"的照片。然后我们制造了一个 Flickr 徽章，这样可以在博客收藏中显示一串最新照片。通常，我们只是提取徽章代码并把它放在自己博客的 HTML/Javascript 窗口小部件中，这样就可以了。但是，我们现在决定帮助可能要做这同一件事的人。因此，我们将该徽章代码放入此表单的 widget.content 部分，然后添加 Flickr 徽标和链接。现在，只要单击某个按钮，其他任何人都可以使用此表单轻松将小狗照片添加到他们的博客中。

这只是冰山一角。从现在开始，您可以设计任何您喜欢的其他东西。拿出您的创造力，享受其中的乐趣，看看您可以做出什么！

如何创建新窗口小部件以便其他用户添加到其布局中？

布局数据标记

2007-11-14T10:51:00.001-08:00

如用于布局的窗口小部件标记一文所述，您可以使用许多不同的标记将特定的数据段包含在模板中。它们的格式都可以定为 <data:name/> 或 <data:name1.name2/>，其中 name 是您想使用的特定数据段的名称。在 name1.name2 一例中，name2 是一个名为 name1 的一组数据内的特定项目，如 photo.url。

这是此类可用数据的主列表。由于不同的窗口小部件使用不同的数据，因此该列表被页面元素分成不同的部分。

全局数据

页面标题

博客帖子

博客归档

个人资料

文本/HTML/JavaScript

供稿

图片

标签

列表

链接列表

徽标

全局数据

此信息适用于整个页面，因此可在任何位置使用，与其他只能在特定窗口小部件中使用的数据不同。这类数据应作为整个"博客"数据的一部分来引用，如 <data:blog.title/> 等。

title：博客的标题。

pageType：当前页面的类型。应为"项目"、"存档"或"索引"其中之一。

url：当前页面的网址。

homepageUrl： 博客的主页。

pageTitle：当前页面的标题。通常是博客标题，但可以包含关于归档和帖子页面的其他信息。

encoding：博客所用的编码，如 UTF-8。

feedLinks：页面标题的自动查找供稿链接。

返回页首。

页面标题

这是一个简单的窗口小部件，只有两段数据。可以简单地引用为 <data:title/> 与 <data:description/>。

title：博客的标题。

description：博客说明。

返回页首。

博客帖子

这是所有博客的核心部分，也是最复杂的部分。重新编写博客帖子之前，强烈建议您考虑只就其中一个默认模板进行修改。不过，无论您如何做，以下都提供可在此窗口小部件中使用的全部数据。

feedLinks：此页面的供稿列表。在主页上，此标记包含主博客供稿；在项目页上，此标记还包含评论供稿。列表中的每个项目均包含下列标记：

url：供稿网址。

name：供稿名称（如"帖子"或"评论"）。

feedType： 供稿类型（Atom 或 RSS）。

mimeType：供稿的 MIME 类型。

olderPageUrl：如果有比当前页面上的帖子更早的帖子，此网址则为较早帖子的网址。与页面类型相关。（并不是所有页面均有此链接。）

olderPageTitle：较早期帖子页面的链接。

newerPageUrl：olderPageUrl 较新的对应网址。

newerPageTitle：olderPageTitle 较新的对应标题。

commentLabel：显示评论数的字词，如"评论"。

authorLabel：说明帖子作者的字词，如"作者为"。

timestampLabel：说明帖子撰写时间的字词，如"张贴日期"。

postLabelsLabel：介绍帖子标签列表的字词，如"此帖的标签"。

backlinksLabel：说明此博客反向链接的字词，如"链接到此博客"。

posts：此页所有帖子的列表。每个帖子可包含：

dateHeader：此帖的日期，只有在帖子为当天发布的帖子列表中第一帖时才会显示。

id：数字形式的帖子 ID。

title：帖子标题。

body：帖子内容。

author：帖子作者的显示名称。

url：此帖的ÓÀ3/4ÃÁ´1/2Ó¡£

timestamp：帖子的时间戳。与 dateHeader 不同，每个帖子都有此标记。

labels：帖子的标签列表。每个标签均可包含下列标记：

name：标签文字。

url：列出本博客中具有此标签的所有帖子的页面网址。

isLast：真或假。此标签是否为列表中的最后一个标签（添加逗号时非常有用）。

allowComments：如果此帖允许发表评论则为"真"。

numComments：此帖的评论数。

showBacklinks：是否显示此帖的反向链接。

numBacklinks：此帖的反向链接数。

addCommentUrl：此帖的"添加评论"表单网址。

emailPostUrl：此帖的"通过电子邮件发送此帖"表单网址。

editUrl：此帖的修改表单网址。

feedLinks：针对此帖的供稿列表。（与整体博客的 feedLinks 不同，因为它可能包含帖子评论的供稿。）每项均可包含下列标记：

url：供稿网址。

name：供稿名称（如"帖子"或"评论"）。

feedType：供稿类型（Atom 或 RSS）。

mimeType：供稿的 MIME 类型。

comments：此帖的所有评论列表（仅限项目页）。每项均可包含下列标记：

id：评论的数字形式 ID。

body：评论的正文。

timestamp：评论的创建日期。

author：评论作者的显示名称，或为"匿名"。

authorUrl：如果不是匿名评论，则为评论作者个人资料页的网址。

deleteUrl：删除此评论的网址。

isDeleted：此评论是否已删除。（已删除评论的文字部分将放置占位符。）

返回页首。

博客归档

此处提供的不同样式适用于"页面元素"标签上不同的默认选项。如果您要设计出新版本，最简单的方式就是选择"FLAT"作为样式，然后根据需要调整其他数据。

title：窗口小部件标题。

style："MENU"、"FLAT"或"HIERARCHY"中的其中一项。

data：所有归档单位的列表，每项可包含：

name：此归档时段的名称，如"2006 年 8 月"。

url：在此时段内包含帖子的页面链接。

post-count：此时段内的帖子总数。

返回页首。

个人资料窗口小部件

对于仅有一个作者的博客，个人资料窗口小部件可包含下列信息。请注意，要访问 photo 其他部分的数据，需要使用 <data:photo.url/> 符号。

title：窗口小部件标题。

userUrl：作者的个人资料网址。

location：作者个人资料的位置。

aboutme：个人资料中的"关于我"信息。

displayname：作者的显示名称。

photo：用户的个人资料照片，由下列标记组成：

url： 照片网址。

width：照片宽度，以像素为单位。

height：照片高度，以像素为单位。

alt：照片的替代文字。

在团队博客上，个人资料窗口小部件可含与较多作者相关的较少个人信息，如下所述。

title：窗口小部件标题。

authors：作者列表，每项可包含下列标记：

displayname：作者的显示名称。

userUrl：作者的个人资料网址。

如果您想设计自己的模板以便同时处理一位作者和多位作者的博客，可以使用 data:team 变量来区分这两种不同的情况。如 <b:if cond='data:team=="true"'>（显示多位作者）</b:if>

返回页首。

文本/HTML/JavaScript 窗口小部件

文本窗口小部件和 HTML/JavaScript 窗口小部件的工作原理相同，并且有两段相同的数据。

title：窗口小部件标题。

content：窗口小部件内容。

返回页首¡£

供稿窗口小部件

除本身所带的信息，供稿窗口小部件还包含名为 feedData 的列表，其中含供稿的所有项目。每个项目依次包含关于它们自己的不同信息。引用这类数据时，您需要循环执行列表中的每一项，所用的标记类似于 <b:loop var="i" values="feedData.items">。然后使用 <data:i.title/> 或 <data:i.alternate.href/> 等符号获取每个项目的信息。

title：窗口小部件的标题。

feedUrl：供稿网址。

feedData：供稿中包含的项目，每项均包含下列标记：

title：项目标题。

str_published：项目的发布时间（以博客所在时区正确显示）。

published：项目的发布时间（纪元以来的秒数）。

str_updated：项目的最近更新时间（以博客所在时区正确显示）。

updated：项目最近的更新时间（纪元以来的秒数）。

author：项目的作者。

summary：如果有，应为项目摘要。

alternate：此项目详细信息的位置，其中可包含：

href：此项目的ÓÀ3/4ÃÁ´1/2Ó。

type：此项目的内容类型。

返回页首¡£

图片窗口小部件

图片窗口小部件包含一幅图片，并提供关于该图片的所有相关数据。

title：窗口小部件标题。

sourceUrl：图片网址。

width：图片宽度，以像素为单位。

height：图片高度，以像素为单位。

caption：图片标题。

返回页首¡£

标签窗口小部件

标签窗口小部件包含博客中使用的所有标签列表。

title：窗口小部件标题。

labels：标签列表，每项可包含下列标记：

name：标签文字。

count：有此标签的帖子数。

url：显示有此标签的帖子的网页链接。

返回页首¡£

列表窗口小部件

列表的最简单形式。每项均为一段文字，其中的数据没有类型差别。

title：窗口小部件标题。

items：项目列表。

返回页首¡£

链接表窗口小部件

稍微复杂的列表，其中每项具有两个部分：文字和链接。

title：窗口小部件标题。

links：链接表，每项可包含：

name：链接的文字。

target：链接的网址。

返回页首¡£

徽标窗口小部件

没有比这更简单的了。此处只有一种数据。

fullButton：您选择的 Blogger 按钮网址。

返回页首¡£

布局数据标记

用于布局的页面元素标记

2007-11-14T10:29:00.001-08:00

用于布局的页面元素标记

布局模板的 <body> 部分主要由网页栏目和窗口小部件组成。栏目用于划分网页的各个区，例如侧边栏、页脚等。窗口小部件是各种页面元素，例如图片、blogroll 或其他您想从"页面元素"标签中添加的任何元素。您可以在模板的栏目周围加入任何所需的 HTML 代码。

模板中的每个栏目都有一个起始标记和一个结束标记，看起来像这样：

<b:section id='header' class='header' maxwidgets="1" showaddelement="no"> </b:section>

<b:section> 标记可包含下列属性：

id - （必需）独一无二的名称，只包含字母和数字。

class - （可选）公共类别名称为"navbar"、"页眉"、"主"、"侧边栏"和"页脚"。如果您在稍后切换模板，这些名称可帮助 Blogger 确定如何以最好的方式转移您的内容。不过，您也可根据需要使用其他名称。

maxwidgets - （可选）在此栏目内允许的窗口小部件的最大数量。如果未指定，表示没有限制。

showaddelement - （可选）可为"是"或"否"，"是"为默认选项。此属性可决定"页面元素"标签是否要在此栏目中显示"添加页面元素"链接。

growth - （可选）可为"水平"或"垂直"，"垂直"为默认选项。此属性可决定此栏目中的窗口小部件是并排还是堆叠。

栏目中只能包含窗口小部件，不可包含其他栏目或其他代码。如果您需要在栏目内的特定窗口小部件之间或周围插入其他代码，需要将该栏目拆分为两个或两个以上的新栏目。

在最简单的表单中，窗口小部件由单个标记表示，此标记只起到占位符的作用，指示应如何在"页面元素"标签中对其进行处理。所有给定窗口小部件的实际数据都存储在 Blogger 数据库中，只有需要显示该窗口小部件时才能访问。窗口小部件的部分示例如下（一个用于页面标题，另外一个用于列表）：

<b:widget id="header" type='HeaderView' locked="yes"/> <b:widget id="myList" type='ListView' locked="no" title="My Favorite Things"/>

窗口小部件可具有下列属性：

id - （必需）此属性只能包含字母和数字，且模板中的每个窗口小部件 ID 必须是独一无二的。窗口小部件并新建一个小部件，就无法更改窗口小部件 ID。

type - （必需）此属性指示窗口小部件的种类，且必须为下列有效类型之一。

locked - （可选）可为"是"或"否"，"否"为默认选项。无法从"页面元素"标签中移动或删除已锁定的窗口小部件。

title - （可选）窗口小部件的显示标题。如果未指定，则会使用"List1"之类的默认标题。

pageType - （可选）可为"全部"、"归档"、"主"或"项目"，其中"全部"为默认选项。窗口小部件只会在您博客的指定页面中显示。（无论其 pageType 为何，所有窗口小部件都会在"页面元素"标签中显示。）

您可指定的窗口小部件类型如下：

博客归档

博客

供稿

标题

HTML

单张图片

链接列表

列表

徽标

博客个人资料

Navbar

VideoBar

NewsBar

每个窗口小部件也可扩写为扩展的表单，详细描述窗口小部件的完整布局和内容。如果您从"修改 HTML"标签下载模板作为备份，这就是您会看到的内容示例。通常，您不需要在此模式中处理窗口小部件，因为直接从"页面元素"标签中进行修改会更加简单。不过，如果您想了解更多详情，可以参阅窗口小部件标记详述。

注意：在您已发布的博客中，所有 <b:section> 和 <b:widget> 标记都将由具有指定 ID 的 <div> 标记替换。因此，您可以尽量引用您的 CSS (例如 div.header 或 div.myList)。

用于布局的页面元素标记

我的痕迹: 大致知道模板是怎么回事了

2007-11-14T10:27:00.001-08:00

看了在线帮助，大致知道模板是怎么回事了。
我以前用的是经典模板，其实就是一个HTML文档，里面包含一些形如<$BlogItemAuthor$>的模板标记，发布时这些标记将被有真实内容替代。
如果从经典模板升级到新的模板，就可以添加很多小部件（widget），包括我昨天很向往的按标签分类功能，而且可以在一定程度上通过可视化的方法对博客页面进行排版。这些小部件的制作想必不会太容易，如果要定制的话，在编辑HTML时需要找开“扩展窗口小部件”选项。
在经典模板中添加/删除HTML代码很容易，编辑新模板的HTML代码时，就得小心了，那实际上是个的XML文档，如果不打开“扩展窗口小部件”选项的话，几乎看不到诸如<div>这样的HTML元素。
看起来完全定制博客的外观是可能的，只是我觉得那些免费的模板已经很好了，从布局到颜色方案，我对它做的大多数修改都显示多余，不管了，我感兴趣的只是它背后的东西。

我的痕迹: 大致知道模板是怎么回事了

我的痕迹: 认识 Blogger 的 XML 模板

2007-11-14T10:15:00.001-08:00

上午看了 Blogger 帮助中关于 XML 模板的讲解。

在这之前，我想象 Blogger 能提供一个完整的对象模型，可以通过 Javascript 访问，就像可以用 VBA 对 COM 服务器进行编程。我设想的的对象模型大致是这个样子：有一个类型为 Blogger 的根对象，它代表整个博客，有一堆属性，最重要的是 Posts 属性，这是一个 Post 类型的集合，Post 类描述了一个贴子的全部信息。

实际上我是把在桌面程序上的经验搬到这里来了，我不知道这个设想能不能实现，甚至不期望现今的博客服务能支持这个开发模型，反正就今天来看， Blogger 的 XML 模块中 Widget 的制作方法很有趣。

从经典模板的经验出发，我很好奇 XML 模板中那个标签组件是怎么做出来的，它能得到博客中的标签列表，并且统计各个标签的贴子数目，典型情况下，这需要循环语句啊！可如何用 XML 标记表达循环呢？看看用于布局的窗口小部件标记是怎么模仿编程语言中的控制流和变量引用的：

循环
b:loop 标记可让您多次重复一段内容。如果要输出指定页面帖子列表中的每个帖子、评论列表中的每条评论或标签列表中的每个标签等项目，这是最常用的标记。使用循环的一般格式为：
<b:loop var='identifier' values='set-of-data'>
[此处为重复的内容]
</b:loop>
这种用法非常类似于 C# 中的 foreach 语句，用以迭代一个集合。

条件
您可以使用 b:if 和 b:else 在某些位置显示特定内容，而在其他位置不显示。一般格式如下：
<b:if cond='condition'>
[条件为"真"时显示的内容]
<b:else/>
[条件为"假"时显示的内容]
</b:if>

变量的引用和传递
与此相关的标记有两个：b:includable 和 b:includable 。
includable 标记的角色相当于函数定义，它有个 var 属性，它是由字母和数字组成的标识符，用于引用此段内的数。
b:include 标记的角色相当于函数调用，它有个 data 属性，它表示要传递到 includable 段的表达式或数据片断。在 includable 段中，这也是 var 属性的值。

有了上面的技术，定义模板就很自由了，下面是标签小部件的代码：
    
<b:widget id='Label1' locked='false' title='标签' type='Label'>

    
<b:includable id='main'>

    
<b:if cond='data:title'>

    
<h2><data:title/></h2>

    
</b:if>

    


    
<div class='widget-content'>

    
<ul>

    
<b:loop values='data:labels' var='label'>

    
<li>

    
<b:if cond='data:blog.url == data:label.url'>

    
<data:label.name/>

    
<b:else/>

    
<a expr:href='data:label.url'>

    
<data:label.name/>

    
</a>

    
</b:if> (<data:label.count/>)

    
</li>

    
</b:loop>

    
</ul>

    
<b:include name='quickedit'/>

    
</div>

    
</b:includable>

    
</b:widget>

    
标签窗口小部件的布局数据标记：
    
title：窗口小部件标题。

    
labels：标签列表，每项可包含下列标记：

    
name：标签文字。

    
count：有此标签的帖子数。

    
url：显示有此标签的帖子的网页链接。
关于 XML 模板，最有参考价值的两篇文章应该是：

用于布局的窗口小部件标记:

http://help.blogger.com/bin/answer.py?answer=46995

布局数据标记:

http://help.blogger.com/bin/answer.py?answer=47270&hl=zh_CN#labels

需要注意的一件事是，经典模板中的数据标记使用很简单，把它插入任何需要的地方都可以——包括字符串中，这很重要，它意味着你何以在指定 HMTL 元素的属性时直接使用这种标记，但在 XML 模板中，需要使用 expr 对属性字符串求值，比如<a expr:id=data:post.id+"_header">。

我在 XML 模板中添了一些代码，期望达到折叠/展开贴子的效果，可碰到一点小问题：我的链接无论如何不调用 js 函数，换成按钮则行，折腾了好久（超过2个小时），我发现是一段外部 js 代码导致这个奇怪现象的，但那段代码是必须的，按钮又太丑，就因为这个我仍然没有升级到 XML 模块。

我的痕迹: 认识 Blogger 的 XML 模板

8个圈圈的Blogger: Blogger-Beta Hack之“导航菜单式的分类”

2007-11-14T10:09:00.001-08:00

8"O"又去偷师了，结果就是现在新的界面效果。将分类移到页面的上方，显示成浏览器标签页（导航菜单）的风格。有点儿意思吧？直接进入正题，看看怎样一步一步实现这个效果。
1. 选择导航菜单的样式
如果你选择8"O"-Beta上这种样式，可以跳过此步骤。也可以从下面的11种样式中挑选适合你blogger风格的导航菜单。

感谢exploding boy免费提供这些导航菜单。点击下载所有样式的导航菜单，
2. 添加Label这个页面元素（page element)
如果不是新注册的blogger-beta用户，应该已经在侧边栏上添加了Label。可以跳过此步骤。
没有Label的朋友，可以在可视化模板编辑中添加页面元素，选择Label。
3. 扩展Header
在模板HTML编辑中找到以下代码（友情提醒：更改模板前先备份）：
<b:section class="header" id="header" maxwidgets="1" showaddelement="no">
将其更改为：
<b:section class="header" id="header" maxwidgets="2" showaddelement="yes">
保存模板后回到可视化模板编辑，将Label从侧边栏拖放到原来的Header下

4. 添加CSS样式
如果你和8"O"一样选择F样式，那么复制下面的代码，粘贴到CSS样式表的最后（"]]>"标志前）
/*- Menu Tabs F By http://www.exploding-boy.com/2005/12/15/free-css-navigation-designs/------ */ #tabsF { float:left; width:100%; font-size:80%; line-height:normal; border-bottom:1px solid $bordercolor; /*Notice the use of $bordercolor to match with the Beta Blogger Settings*/ } #tabsF ul { margin:0; padding:10px 10px 0 50px; list-style:none; } #tabsF li { display:inline; margin:0; padding:0; } #tabsF a { float:left; background:url("http://www.anniyalogam.com/labeltabs/tableftF.gif") no-repeat left top; margin:0; padding:0 0 0 4px; text-decoration:none; } #tabsF a span { float:left; display:block; background:url(" http://www.anniyalogam.com/labeltabs/tabrightF.gif") no-repeat right top; padding:5px 15px 4px 6px; color:#666; } /* Commented Backslash Hack hides rule from IE5-Mac \*/ #tabsF a span {float:none;} /* End IE5-Mac hack */ #tabsF a:hover span { color:#FFF; } #tabsF a:hover { background-position:0% -42px; } #tabsF a:hover span { background-position:100% -42px; }
上述代码中的图片来自Ramani的网站，你也可以将图片放到自己的blogger上，然后更改图片位置。
如果你选择其他样式的导航菜单，则将相应的CSS代码复制到上述位置。
5. 最关键的一步（特别感谢Hoctro）
找到下面的代码：
<b:widget id='Label1' locked='false' title='your label title' type='Label'> <b:includable id='main'> <b:if cond='data:title'> <h2><data:title/></h2> </b:if> <div class='widget-content'> <br/> <select onchange='location=this.options[this.selectedIndex].value;'> <option>Select a Label</option> <b:loop values='data:labels' var='label'> <option expr:value='data:label.url'><data:label.name/> (<data:label.count/>) </option> </b:loop> </select> <b:include name='quickedit'/> </div> </b:includable> </b:widget>
将其替换成：
<b:widget id='Label1' locked='false' title='' type='Label'> <b:includable id='main'> <div id='tabsF'> <ul> <b:loop values='data:labels' var='label'> <li><a expr:href='data:label.url'><span><data:label.name/></span></a></li> </b:loop> </ul>  </div> </b:includable> </b:widget>
开香槟庆祝吧！

8个圈圈的Blogger: Blogger的导航菜单

2007-11-14T10:06:00.001-08:00

做完beta的导航菜单后很想给blogger也做一个。仔细研究了一下代码，发现在blogger上实现导航菜单，似乎比beta上更简单，更灵活（不搬家了）。大致的步骤和beta版的导航菜单是一样的：
1. 选择导航菜单的样式
如果你选择和8O一样的样式（tabsF），可以跳过此步骤。或者下载所有11种样式的导航菜单，从中挑选适合你blogger风格的导航菜单。
2. 添加CSS样式
下面的代码是8O选择的F样式，复制下面的代码，粘贴到CSS样式表的最后（</style>标志前）
/*- Menu Tabs F By http://www.exploding-boy.com/2005/12/15/free-css-navigation-designs/------ */ #tabsF { float:left; width:100%; font-size:80%; line-height:normal; border-bottom:1px solid $bordercolor; /*Notice the use of $bordercolor to match with the Beta Blogger Settings*/ } #tabsF ul { margin:0; padding:10px 10px 0 50px; list-style:none; } #tabsF li { display:inline; margin:0; padding:0; } #tabsF a { float:left; background:url(" http://www.anniyalogam.com/labeltabs/tableftF.gif") no-repeat left top; margin:0; padding:0 0 0 4px; text-decoration:none; } #tabsF a span { float:left; display:block; background:url(" http://www.anniyalogam.com/labeltabs/tabrightF.gif") no-repeat right top; padding:5px 15px 4px 6px; color:#666; } /* Commented Backslash Hack hides rule from IE5-Mac \*/ #tabsF a span {float:none;} /* End IE5-Mac hack */ #tabsF a:hover span { color:#FFF; } #tabsF a:hover { background-position:0% -42px; } #tabsF a:hover span { background-position:100% -42px; }
上述代码中的图片来自Ramani的网站，你也可以将图片放到自己的blogger上，然后更改图片位置。如果你选择其他样式的导航菜单，则将相应的CSS代码复制到上述位置。
3. 最关键的一步（特别感谢8O）
<div id="header"> <h1 id="blog-title"> <a href="<$BlogURL$>" style="font-weight:bold; color:#0A409A;"> <$BlogTitle$> </a> </h1> <p id="description"><$BlogDescription$></p> ………… </div>
用下列格式的代码替换“…………”
<div id='tabsF'> <li><a href="url1"><span>Tag1</span></a></li> <li><a href="url2"><span>Tag2</span></a></li> ………… </div>
OK!beta需要5步完成的工作，在blogger上只要三步就搞定，而且你可以随意调整每个Tag的顺序，更重要的是你可以在此放任一链接，使其显示在每页的顶部（不像beta只能显示分类名，且Tag顺序无法调整）。呼！上帝也休息的日子，8O也去放松一下！

8个圈圈的Blogger: Blogger的导航菜单

8个圈圈的Blogger: 怎样在文章末尾添加美味书签链接和回到页首�

2007-11-14T09:56:00.001-08:00

Hou Jay前几天来信问：如何在blogger文章末尾加个“收藏到美味书签”的连接？不好意思Jay，现在才答复你的邮件。
1. Blogger 3.0（Beta Blogger，新版Blogger）：
1-1. 定位代码
 <b:include data='post' name='postQuickEdit'/>
1-2. 在其后添加代码
<a expr:href='"http://del.icio.us/post?url=" + data:post.url + "&title=" + data:post.title' target='_blank' title='美味书签'>del.icio.us</a>
2. Blogger 2.0（Blogger Classic，旧版Blogger）：
2-1. 定位代码
<p class="post-footer">
2-2. 在其后添加代码
<em><$BlogItemAuthorNickname$> @ <a href="<$BlogItemPermalinkUrl$>" title="permanent link"><$BlogItemDateTime$></a> | <a title="收藏到del.icio.us" href="http://del.icio.us/post?url=<$BlogItemPermalinkURL$>&title=<$BlogItemTitle$>" target="_blank">del.icio.us</a> </em>
搞定（没搞定的留言）。
另外在奉送一个小技巧：怎样为每篇文章添加一个返回页首的链接（TOP，如图）？只要添加下面的代码就搞定：
<a href='javascript:scroll(0,0)' title='回到页首'>TOP</a>
就这么多了，希望对大家有帮助!

8个圈圈的Blogger: 怎样在文章末尾添加美味书签链接和回到页首�

8个圈圈的Blogger: 怎样回到本帖开头

2007-11-14T09:55:00.001-08:00

和回到页首相比复杂一些，以下是具体步骤：
1. 找到下列代码，添加粗体字部分（如果没有的话）。
<b:includable id='post' var='post'> <div class='post uncustomized-post-template' expr:id='"post-" + data:post.id' >
2. 找到帖子的底部（<p class="post-footer">）在其后添加下面的代码（可以根据自己需要修改粗体字部分）
<a expr:onclick='"javascript:document.getElementById(\"post-" + data:post.id + "\").scrollIntoView(true);"' href='javascript:void(0);' title='Scroll to top of post'>Top of Post</a>

8个圈圈的Blogger: 怎样回到本帖开头

Google | Blogger [八卦新闻]: 和你的帖子玩Peek-a-Boo——另一种全文|摘要显示方式

2007-11-14T09:19:00.001-08:00

首先，什么事Peek-a-Boo？这个游戏就是Peek-a-Boo的一个范例。怎么和Blogger帖子玩Peekaboo？看看这里的效果。
可能是觉得o以前介绍的全文|摘要显示方式（新版、旧版）太过呆板，很多朋友都想换一种更加新鲜的，也许Peekaboo能合你的心意。
1. 和以前一样：保存模板；
2. 在</head>标签前添加

<script type='text/javascript' src='http://www.anniyalogam.com/widgets/hackosphere.js' />

3. 定位以下代码
<b:includable id='post' var='post'>
.
.
.
.
.
.
<div style='clear: both;'/> 

用这些代码替换上述内容（可将粗体字部分改成你喜欢的文字）
<b:includable id='post' var='post'>
<div class='post'>
<a expr:name='data:post.id'/>
<b:if cond='data:post.title'>
<h3 class='post-title'>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</h3>
</b:if>
<div class='post-header-line-1'/>
<div class='post-body' expr:id='"post-" + data:post.id'>
<b:if cond='data:blog.pageType == "item"'>
<p><data:post.body/></p>
<b:else/>
<style>#fullpost {display:none;}</style>
<p><data:post.body/></p>
<span id='showlink'>
<p><a expr:onclick='"javascript:showFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>显示全文...</a></p>
</span>
<span id='hidelink' style='display:none'>
<p><a expr:onclick='"javascript:hideFull(\"post-" + data:post.id + "\");"' href='javascript:void(0);'>显示摘要...</a></p>
</span>
<script type='text/javascript'>checkFull("post-" + "<data:post.id/>")</script>
</b:if>
<div style='clear: both;'/> 

4. 最后一哆嗦：在帖子模板中添加
[摘要内容]
<span id="fullpost">
[后续内容]
</span>

怎么样？学会了没？

Google | Blogger [八卦新闻]: 和你的帖子玩Peek-a-Boo——另一种全文|摘要显示方式

Blogger: Blogger-Beta Hack之“折叠Beta——显示摘要”

2007-11-14T09:14:00.001-08:00

首页显示摘要是8"O"认为最有用的Hack之一，感谢Kax提供水瓶子的blogger中关于在Beta下如何显示摘要的方法。8"O"这里就借花献佛：
1.定位红色代码

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

2.替换为蓝色代码
<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>
<p><data:post.body/>
<br></br>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'>More......</a>
<b:else/>
<data:post.title/>
</b:if>
</p>
</b:if>

3.在帖子模板中添加
<span class="fullpost"></span>

收工！

Blogger: Blogger-Beta Hack之“折叠Beta——显示摘要”

8个圈圈的Blogger: 折叠Blogger

2007-11-14T09:11:00.001-08:00

将首页的帖子折叠起来，只显示帖子的摘要，这样可以让首页显得干净，加载起来也更快。就像8个圈圈这样，哈哈！
实现后的效果就是现在8个圈圈上的这个样子，首页只有文字，图片和视频都被折进去了。至于怎样折叠？点全文吧！
和当初想给8个圈圈分类一样，我尝试过n种方法，最终还是觉得Blogger自己提供的方案最合适（子曰：自己的孩子自己最了解）。我下面所说的都是Blogger帮助里有的，喜欢翻原版请看如何创建可扩展的帖子摘要？
原理这种东西太高深，我就不说了（一是不懂，二是说不明白），简单的说下怎样实现折叠的效果：
1.将下面的代码放到<style> 与</style>
<MainOrArchivePage>
span.fullpost {display:none;}
</MainOrArchivePage>
<ItemPage>
span.fullpost {display:inline;}
</ItemPage>
2.在<$BlogItemBody$>后添加下列代码
<MainOrArchivePage><br />
<a href="<$BlogItemPermalinkURL$>">Read more!</a>
</MainOrArchivePage>
可以对它进行一些个性化的更改，比如把“Read more!”改成“全文”
3.在帖子模板中添加
<span class="fullpost"></span>
如果不嫌累的话可以在每次编辑或者撰写帖子的时候手工添加。
发帖时把需要隐藏的文字（这些文字将不出现在帖子首页）放在<span class="fullpost">与</span>之间。搞定，这样你就可以随意折叠你的Blogger了。

8个圈圈的Blogger: 折叠Blogger

新版Blogger标签云

2007-11-14T09:08:00.001-08:00

在新版Blogger上实现类似del.icio.us的Tag Cloud效果并不难，只是有点繁琐，有兴趣的可以按照下面的步骤一步一步来，用不了5分钟就能搞定新版Blogger标签云：
1. 进入HTML模板编辑，备份你的Blogger模板，并选中扩展窗口小部件模板；
2. 在]]></b:skin>前添加以下CSS代码：

/* Label Cloud Styles
----------------------------------------------- */
#labelCloud {text-align:center;font-family:arial,sans-serif;}
#labelCloud .label-cloud li{display:inline;background-image:none !important;padding:0 5px;margin:0;vertical-align:baseline !important;border:0 !important;}
#labelCloud ul{list-style-type:none;margin:0 auto;padding:0;}
#labelCloud a img{border:0;display:inline;margin:0 0 0 3px;padding:0}
#labelCloud a{text-decoration:none}
#labelCloud a:hover{text-decoration:underline}
#labelCloud li a{}
#labelCloud .label-cloud {}
#labelCloud .label-count {padding-left:0.2em;font-size:9px;color:#000}
#labelCloud .label-cloud li:before{content:"" !important}

3. 定位下列代码：
<b:widget id='Label1' locked='false' title='Labels' type='Label'/>
......
</b:includable>
</b:widget>

4. 用以下代码替换：
<b:widget id='Label1' locked='false' title='Label Cloud' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<div id='labelCloud'/>
<script type='text/javascript'>
// Don't change anything past this point -----------------
// Cloud function s() ripped from del.icio.us
function s(a,b,i,x){
if(a>b){
var m=(a-b)/Math.log(x),v=a-Math.floor(Math.log(i)*m)
}
else{
var m=(b-a)/Math.log(x),v=Math.floor(Math.log(i)*m+a)
}
return v
}
var c=[];
var labelCount = new Array();
var ts = new Object;
<b:loop values='data:labels' var='label'>
var theName = "<data:label.name/>";
ts[theName] = <data:label.count/>;
</b:loop>
for (t in ts){
if (!labelCount[ts[t]]){
labelCount[ts[t]] = new Array(ts[t])
}
}
var ta=cloudMin-1;
tz = labelCount.length - cloudMin;
lc2 = document.getElementById('labelCloud');
ul = document.createElement('ul');
ul.className = 'label-cloud';
for(var t in ts){
if(ts[t] < cloudMin){
continue;
}
for (var i=0;3 > i;i++) {
c[i]=s(minColor[i],maxColor[i],ts[t]-ta,tz)
}
var fs = s(minFontSize,maxFontSize,ts[t]-ta,tz);
li = document.createElement('li');
li.style.fontSize = fs+'px';
li.style.lineHeight = '1';
a = document.createElement('a');
a.title = ts[t]+' Posts in '+t;
a.style.color = 'rgb('+c[0]+','+c[1]+','+c[2]+')';
a.href = lcBlogURL+'/search/label/'+encodeURIComponent(t);
if (lcShowCount){
span = document.createElement('span');
span.innerHTML = '('+ts[t]+') ';
span.className = 'label-count';
a.appendChild(document.createTextNode(t));
li.appendChild(a);
li.appendChild(span);
}
else {
a.appendChild(document.createTextNode(t));
li.appendChild(a);
}
ul.appendChild(li);
abnk = document.createTextNode(' ');
ul.appendChild(abnk);
}
lc2.appendChild(ul);
</script>
<noscript>
<ul>
<b:loop values='data:labels' var='label'>
<li>
<b:if cond='data:blog.url == data:label.url'>
<data:label.name/>
<b:else/>
<a expr:href='data:label.url'><data:label.name/></a>
</b:if>
(<data:label.count/>)
</li>
</b:loop>
</ul>
</noscript>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>

5. 回到]]></b:skin>，在其后（但在</head>标签前）添加以下代码：
<script type='text/javascript'>
// Label Cloud User Variables
var lcBlogURL = 'http://YOURBLOG.blogspot.com';
var cloudMin = 1;
var maxFontSize = 20;
var maxColor = [0,0,255];
var minFontSize = 10;
var minColor = [0,0,0];
var lcShowCount = false;
</script>

最重要的是将YOURBLOG替换成你的blogger id，其他粗体字部分可以根据自己的需要作相应的调整。

Google | Blogger [八卦新闻]: 新版Blogger标签云

Helled Heaven » Blogger中添加版权声明的方法

2007-11-14T08:54:00.001-08:00

版权问题是目前一个比较热门的话题。hhalloyy在他的Blog中提供了一个供Wordpress用户方便使用的添加版权声明的办法，很不错，虽然这样并不能很实际的解决抄袭成风的问题，但至少是一个态度的表明。代码如下：

作者: 1) { ?> 发表于
版权信息: 可以任意转载, 转载时请务必以超链接形式标明文章">原始出处和">作者信息及此声明

直接添加到帖子页或者其他你认为合适的页面就行了，无需改动什么，我这里想出一个专为Blogger的用户设计的代码，仅适用于Classic模式：

…
作者: <$BlogItemAuthorNickname$> 发表于<$BlogItemDateTime$>

版权信息: 可以任意转载, 转载时请务必以超链接形式标明文章">原始出处和">作者信息及此声明
…

将这段代码放在帖子页中你认为合适的地方即可。

Google后花园 | Google Garden: 让Blogger首页只显示帖子摘要的技巧

2007-11-14T08:46:00.001-08:00

在Blogger.com Beta改版之前，已经有人通过修改Blogger模板和设定文章模板的方式，实现了Blogger首页只显示帖子摘要的版面效果。在Blogger的帮助中，现在还能找到这个Blogger技巧的说明。请参阅：Blogger帮助:如何创建可扩展的帖子摘要？不过，如果你老老实实照Blogger的帮助说明进行修改的话，可能会发现你还是无法实现只显示帖子摘要的版面效果。本人一介菜鸟，为此整整浪费了几个小时的时间，最后在网络上四处搜索并参考了其他博客的做法，才成功的实现。
那为什么这个版面效果是相当有用的呢？
有些时候，你可能会在Blogger上面张贴一些很长的帖子，而Blogger首页只消放上几篇这样的帖子，页面打开的速度就会受到很大影响，而且将导致浏览者鼠标滚轮的寿命大大缩短，吓跑了访问者。这时，你可能会希望每个帖子仅显示摘要部分即可。这样一来，Blogger首页的帖子数可以列举更多，首页的信息量就可以加大，访问者可以更快的找到自己感兴趣的内容。如果读者希望阅读完整的文章，则可以单击打开一个新的页面。
遗憾的是，这个在Blogger当中并没有办法进行设定，所以大家只好自己动手解决这个问题了。我也总结归纳了一下自己的实践过程，和大家一起分享，希望能帮到一些需要的人。请注意：本文中所提到的技巧只适合Blogger Beta新版，对于使用传统模板的同志并不适用。同时，我强烈建议使用传统模板的同志升级自己的Blogger模板。升级操作很简单、很直观，向导式的，这里不再废话，省去…×××…字。>
步骤一：必须启用“帖子页”的功能。请到后台“设置”——“存档”页面，将“启用文章页？”修改为“是”。如果已经改好，则跳过这一步。我实在很不解Google的这种说法，不知道为什么要叫这么个容易让人迷糊名称。其实，说白了为每个帖子生成一个静态（html）页面，这样做的好处就是可以大大加快访问的速度，地球人都知道。
步骤二：修改Blogger的模板。请转到“修改 HTML”页面，我们必须直接修改模板，在“ 扩展窗口小部件模板”前面的小框记得打勾。这里必须提到一个概念：条件CSS。CSS中文称为样式表，其作用是控制页面显示的方式。同样的显示方式可以设计成一个类，需要用到的时候指定使用这个类就可以。维护的时候非常方便，只需要修改CSS，所有的相关网页的显示方式就会发生变化，而不用一个个网页调整。我们希望帖子在Blogger首页的时候只显示摘要，这里有一个限定条件：只在Blogger首页应用这个效果，所以这个叫条件CSS。注意看清楚代码添加的位置，错了可不行。
找到</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'> 阅读全文... </a>
</b:if>
步骤三：设定文章模板。请转到“设置”——“格式设定”页面，在“文章模板”框中加入如下内容，然后保存设置。
本文摘要部分.....<span class="fullpost">帖子的其余部分</span>
以后在发表新文章的时候，将帖子内容过长的部分用<span class="fullpost"></span>这一对标签包住就可以了，首页上就不会显示被包住的部分了。

Google后花园 | Google Garden: 让Blogger首页只显示帖子摘要的技巧

Google后花园 | Google Garden: 在Blogger帖子内容中显示网页代码的技巧

2007-11-14T08:42:00.001-08:00

为了能够在Blogger帖子内容当中显示HTML代码，本菜鸟参考了很多其他Blogger的文章，经过一番艰难的摸索，最后终于彻底搞定，顺便还做了简单的修改，让显示效果看上去更清爽，心中很有一点成就感，也算当了一回Blogger Hack。为了让其他的Blogger入门者可以少走一些弯路，本菜鸟也简单地将整个实现的过程做个介绍，当一回老师，先请大家别拿砖头砸我，等我唧唧歪歪结束之后再砸不迟。
步骤一：在模板中添加CSS
CODE { display: block; /* fixes a strange ie margin bug */ font-family: Courier New; font-size: 8pt; overflow:auto; background: #f0f0f0 url(http://fujianwzh.googlepages.com/Code_BG.gif) left top repeat-y; border: 1px solid #ccc; padding: 10px 10px 10px 21px; line-height: 1.2em; }
步骤二：在帖子中将HTML代码加在<code></code>当中即可，例如：
<code> <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></code>
效果：
<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>
注意：代码部分必须用“<”代替“<”，用“>”代替“>”，否则帖子在发布之后还是无法显示出HTML代码的，切记。如果“<”和“>”的数量不多，手动输入即可；如果是一大段的代码，建议使用Dreamweaver或其他的网页编辑工具进行转换。如果你使用了Windows Live Writer之类的Blog离线编辑工具，这个编辑的工作就轻松多了。
大家可能没想到实现这个编辑居然会如此烦琐，本菜鸟也同样很难理解。为什么Blogger的“所见即所得”的编辑器会做的如此糟糕？这个改进对Blogger来说应该不是什么难事，建议大家一起向Blogger砸砖头，直到Blogger.com做出改进。

Google后花园 | Google Garden: 在Blogger帖子内容中显示网页代码的技巧

知者无忧@Blog: 让你的blogger首页只显示帖子摘要

2007-11-14T08:35:00.001-08:00

让你的blogger首页只显示帖子摘要

有时候一篇blog太长了，首页只显示帖子摘要就变得很重要了。读者只需要再点击“查看全文”即可进入显示全文的帖子页。方法如下：
1. 要实现此功能，需要先启用帖子页。首先请转到设置存档，然后，将启用帖子页设置为是。单击该页底部的保存更改，然后重新发布您的 Blog。重新发布后，您会看到已创建的帖子页列表。
2. 在样式表中添加以下代码：

<mainorarchivepage>
span.fullpost {display:none;}
</mainorarchivepage>
<itempage>
span.fullpost {display:inline;}
</itempage>

注：（样式表通常接近模板顶部，在 <style> 与 </style> 标记之间。）
3. 在模板中 <$BlogItemBody$> 标记后的某个位置添加以下代码：

<mainorarchivepage><br />
<a href="<$BlogItemPermalinkURL$>">查看全文!</a>
</mainorarchivepage>

帖子修改。如果你要对某个帖子实现显示摘要的功能，那么你写帖子的时候就要这么写了：

这是帖子的开头部分，其实就是摘要。．<span class="fullpost">这是其余部分，就是所谓的全文了。</span>

如果您不希望为每个帖子键入此代码，可以将它放入帖子模板中。

知者无忧@Blog: 让你的blogger首页只显示帖子摘要

色彩斑斓: Blogger简单代码修改

2007-11-14T08:28:00.001-08:00

在不同的浏览器中显示可能会不一致
1.为标题设置固定链接
有些模板并未提供此功能，这给引用日志带来了不便，通过添加简单代码即可实现。
找到如下代码（使用时请将《》改为<>）：
《!-- Begin .post --》
《div class="post"》《a name="《$BlogItemNumber$》"》《/a》
《BlogItemTitle》
《h3 class="post-title"》
《BlogItemUrl》《a href="<$BlogItemUrl$>" title="external link"》
《/BlogItemUrl》
《a href="<$BlogItemPermalinkUrl$>"》《$BlogItemTitle$》《/a》
最后一行即为要使用的代码。
2.文字汉化
个人资料无法汉化。唯一的做法就是自己用语句引用图片和链接
在代码中找到相应的英文字符，直接替换成中文即可。以我的模板为例，代码如下
（不同模板代码不一定完全相同，另外我添加了一个"固定链接"并更改了顺序，请注意）：
《!-- Begin .post --》
《div class="post"》《a name="《$BlogItemNumber$》"》《/a》
《BlogItemTitle》
《h3 class="post-title"》
《BlogItemUrl》《a href="《$BlogItemUrl$》" title="external
link"》《/BlogItemUrl》
《a
href="《$BlogItemPermalinkUrl$》"》《$BlogItemTitle$》《/a》
《BlogItemUrl》《/a》《/BlogItemUrl》
《/h3》
《/BlogItemTitle》
《div class="post-body"》
《div》
《$BlogItemBody$》
《/div》
《/div》
《p class="post-footer"》
《em》《$BlogItemAuthorNickname$》于《$BlogItemDateTime$》
发布《/em》
《MainOrArchivePage》《BlogItemCommentsEnabled》
《font size=2》《a class="comment-link"
href="《$BlogItemPermalinkUrl$》"
title="固定链接"》固定链接《/a》《a class="comment-link"
href="《$BlogItemCommentCreate$》"《$BlogItemCommentFormOnclick$》》《$BlogItemCommentCount$》
评论《/a》《/font》
《/BlogItemCommentsEnabled》《BlogItemBacklinksEnabled》
《font size=2》《a class="comment-link"
href="《$BlogItemPermalinkUrl$》#links"》引用通告《/a》《/font》
《/BlogItemBacklinksEnabled》
《/MainOrArchivePage》《$BlogItemControl$》
《/p》
《/div》
《!-- End .post --》
《!-- Begin #comments --》
《ItemPage》
《div id="comments"》
《BlogItemCommentsEnabled》《a name="comments"》《/a》
《h4》《$BlogItemCommentCount$》评论:《/h4》
《ul》
《BlogItemComments》
《li id="c《$BlogCommentNumber$》"》《a
name="c《$BlogCommentNumber$》"》《/a》
《p class="comment-data"》At 《a href="#c《$BlogCommentNumber$》"
title="comment permalink"》《$BlogCommentDateTime$》《/a》,
《$BlogCommentAuthor$》 said…《/p》
《div class="comment-body"》
《p》《$BlogCommentBody$》《/p》
《$BlogCommentDeleteIcon$》
《/div》
《/li》
《/BlogItemComments》
《/ul》
《p class="comment-data"》
《$BlogItemCreate$》
《/p》
《/BlogItemCommentsEnabled》
《BlogItemBacklinksEnabled》
《a name="links"》《/a》《h4》引用通告:《/h4》
《dl id="comments-block"》
3.链接下划线、背景色的修改
因为Blog里链接较多，带上下划线会显得杂乱，尤其是sidebar看起来相当不爽。通过CSS全局设置即可去除下划线以及添加鼠标经过时的背景色。此代码要跟在《style
type="text/css"》之后，代码如下：
去除下划线：a{TEXT-DECORATION:none}
添加背景：a:hover {
text-decoration:none;
background-color: #70e1ff;
}
红色字体为相应颜色值，在此附上一组比较漂亮的颜色代码
4.Flickr
Sidebar上的Flickr徽章的代码也经过了修改，去掉了广告性质的两个链接，看起来舒服多了，不妨自己试一试。

色彩斑斓: Blogger简单代码修改

挑博立间: Blogger第四讲：图片示例Blogger beta模板代码结构

2007-11-14T07:16:00.001-08:00

其实Blogger模板的代码结构非常的简洁何明朗，模块段的分割非常清晰，功能结构也非常清晰。因此，对于初学者来说修改模板也不是难事，要能得心应手的修改并形成自己的模板，首先我们要深刻了解模板的基本结构，然后我们需要一些初步的CSS和HTML的基本知识：
1.所有"CSS="的部分都是位于Style标记之间的CSS样式表代码，"HTML="的部分是位于Body标记之间的Html代码。
2.并不是所有的模板都完全一样，但大体类似，这些基本结构不会变。
3.参考一些好的CSS和HTML讲解站点，享受自己的Hack的乐趣吧^-^

A)头部（Header）。此部分位于页首部，包含标题和网站描述，概括了整个页首部分。

CSS=
#header {
width:660px;
margin:0 auto 10px;
border:1px solid #ccc;
}
HTML=
<div id="header">
<h1 id="blog-title">
<ItemPage><a href="<$BlogURL$>"></ItemPage>
<$BlogTitle$>
<ItemPage>
</h1>
<p id="description"><$BlogDescription$>
</div>
B）导航栏（Navigation Bar）。此部分代码默认在代码中是不显示的。如果你要去掉NavBar只要在CSS中添加以下代码即可：
CSS=
#b-navbar { height:0px; visibility:hidden; display:none
}
C) Blog标题（Blog title）
CSS=
#blog-title {
margin:5px 5px 0;
padding:20px 20px .25em;
border:1px solid #eee;
border-width:1px 1px 0;
font-size:200%;
line-height:1.2em;
font-weight:normal;
color:#666;
text-transform:uppercase;
letter-spacing:.2em;
}
HTML=
<$BlogTitle$>
D)Blog 描述（Blog Description）。
CSS=
#blog-description {
margin:0 5px 5px;
padding:0 20px 20px;
border:1px solid #eee;
border-width:0 1px 1px;
max-width:700px;
font:78%/1.4em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif;
text-transform:uppercase;
letter-spacing:.2em;
color:#999;
}
HTML=
<$BlogDescription$>
E)Blog日期首（Blog Date Header）。贴子发布时自动生成日期。
CSS=
h2 {
margin:1.5em 0 .75em;
font:78%/1.4em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif;
text-transform:uppercase;
letter-spacing:.2em;
color:#999;
.date-header {
margin:1.5em 0 .5em;
}
HTML=
<BlogDateHeader>
<h2 class="date-header"><$BlogDateHeaderDate$></h2>
</BlogDateHeader>
F)文章标题（Blog Item Title）
CSS=
.post-title {
margin:.25em 0 0;
padding:0 0 4px;
font-size:140%;
font-weight:normal;
line-height:1.4em;
color:#c60;
HTML=
<BlogItemTitle>
<h3 class="post-title">
<BlogItemUrl><a href="<$BlogItemUrl$>" title="external link"></BlogItemUrl>
<$BlogItemTitle$>
<BlogItemUrl></a></BlogItemUrl>
</h3>
</BlogItemTitle>
G)文章区域（Post Division）。此部分包含了Blog Date header, Blog Item Title, Blog Item Body 和 Blog Item Footer。
CSS=
.post {
margin:.5em 0 1.5em;
border-bottom:1px dotted #ccc;
padding-bottom:1.5em;
.post div {
margin:0 0 .75em;
line-height:1.6em;
HTML=
<div class="post">
</div>
H)文章援引区域（Post Block Quote）
CSS=
.post blockquote {
margin:1em 20px;
}
.post blockquote p {
margin:.75em 0;
}
HTML=
<blockquote>
I)文章文字区域（Blog Item Body）
CSS= .post div {
margin:0 0 .75em;
line-height:1.6em;
}
HTML=
<$BlogItemBody$>
J)个人资料部分（Blog Member Profile Division）
CSS=
#profile-container {
margin:0 0 1.5em;
border-bottom:1px dotted #ccc;
padding-bottom:1.5em;
}
.profile-datablock {
margin:.5em 0 .5em;
}
.profile-img {
display:inline;
}
.profile-img img {
float:left;
padding:4px;
border:1px solid #ddd;
margin:0 8px 3px 0;
}
.profile-data {
margin:0;
font:bold 78%/1.6em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif;
text-transform:uppercase;
letter-spacing:.1em;
}
.profile-data strong {
display:none;
}
.profile-textblock {
margin:0 0 .5em;
}
.profile-link {
margin:0;
font:78%/1.4em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif;
text-transform:uppercase;
letter-spacing:.1em;
}
HTML=
<$BlogMemberProfile$>
K)文章底部（Post Footer）这部分包含了Authors Nickname, Item Date Time, Item Comment Count, Comments and blog item control variables等
CSS=
p.post-footer {
margin:-.25em 0 0;
color:#ccc;
}
.post-footer em, .comment-link {
font:78%/1.4em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif;
text-transform:uppercase;
letter-spacing:.1em;
}
.post-footer em {
font-style:normal;
color:#999;
margin-right:.6em;
}
HTML=
<p class="post-footer">
<em>posted by <$BlogItemAuthorNickname$> at <a href="<$BlogItemPermalinkUrl$>" title="permanent link"><$BlogItemDateTime$></a></em>
<MainOrArchivePage><BlogItemCommentsEnabled>
<a class="comment-link" href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnclick$>><$BlogItemCommentCount$> comments</a>
</BlogItemCommentsEnabled><BlogItemBacklinksEnabled>
<a class="comment-link" href="<$BlogItemPermalinkUrl$>#links">links to this post</a>
</BlogItemBacklinksEnabled>
</MainOrArchivePage> <$BlogItemControl$>
</p>
L)链接（Links）
CSS=
a:link {
color:#58a;
text-decoration:none;
}
a:visited {
color:#969;
text-decoration:none;
}
a:hover {
color:#c60;
text-decoration:underline;
}
a img {
border-width:0;
}
#sidebar ul {
margin:0 0 1.5em;
padding:0 0 1.5em;
border-bottom:1px dotted #ccc;
list-style:none;
}
HTML=
<h2 class="sidebar-title">Links</h2>
<ul>
<li><a href="http://news.google.com/">Google News</a></li>
<li><a href="http://help.blogger.com/bin/answer.py?answer=110">Edit-Me</a></li>
<li><a href="http://help.blogger.com/bin/answer.py?answer=110">Edit-Me</a></li>
</ul>
M)之前文章（Previous Posts）
CSS=
#sidebar ul {
margin:0 0 1.5em;
padding:0 0 1.5em;
border-bottom:1px dotted #ccc;
list-style:none;
}
h2 {
margin:1.5em 0 .75em;
font:78%/1.4em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif;
text-transform:uppercase;
letter-spacing:.2em;
color:#999;
}
HTML=
<h2 class="sidebar-title">Previous Posts</h2>
<ul id="recently">
<BloggerPreviousItems>
<li><a href="<$BlogItemPermalinkURL$>"><$BlogPreviousItemTitle$></a></li>
</BloggerPreviousItems>
</ul>
N)存档（Archives ）
CSS=
#sidebar ul {
margin:0 0 1.5em;
padding:0 0 1.5em;
border-bottom:1px dotted #ccc;
list-style:none;
}
h2 {
margin:1.5em 0 .75em;
font:78%/1.4em "Trebuchet MS",Trebuchet,Arial,Verdana,Sans-serif;
text-transform:uppercase;
letter-spacing:.2em;
color:#999;
}
HTML=
<h2 class="sidebar-title">Archives</h2>
<ul class="archive-list">
<BloggerArchives>
<li><a href="<$BlogArchiveURL$>"><$BlogArchiveName$></a></li>
</BloggerArchives>
</ul>
O)侧边栏区域。此部分包含了Member Profile, Links, Resent Posts and Archives等
CSS=
#sidebar {
width:220px;
float:right;
}
#sidebar ul {
margin:0 0 1.5em;
padding:0 0 1.5em;
border-bottom:1px dotted #ccc;
list-style:none;
}
#sidebar li {
margin:0;
padding:0 0 .25em 15px;
text-indent:-15px;
line-height:1.5em;
}
#sidebar p {
color:#666;
line-height:1.5em;
HTML=
<div id="sidebar"><div id="sidebar2">
</div>
P)页脚部分
CSS=
#footer {
width:660px;
clear:both;
margin:0 auto;
}
#footer hr {
display:none;
}
#footer p {
margin:0;
padding-top:15px;
font:78%/1.6em "Trebuchet MS",Trebuchet,Verdana,Sans-serif;
text-transform:uppercase;
letter-spacing:.1em;
}
#sidebar p {
color:#666;
line-height:1.5em;
HTML=
<div id="footer"><hr />
<p> </p>
</div>

挑博立间: Blogger第四讲：图片示例Blogger beta模板代码结构

如何利用HiNet FTP空間備份Blogger的文章 - 抓虾

2007-11-14T06:08:00.001-08:00

要備份Blogger的文章，其實不用一篇一篇剪下貼上，Blogger本身有提供FTP發佈的方法，所以可以用FTP來進行備份，前提是必須有Ftp的空間或是Ftp伺服器；如果你的ADSL是使用HiNet，HiNet本身就有提供一個Ftp的空間給用戶，如果沒有Ftp空間，也可以自行架設一個Ftp伺服器，架設Ftp伺服器首推「Serv U」，架設的方法改天再寫一篇專文，現在先介紹如何利用HiNet的Ftp空間來備份Blogger的文章，因為根據Google Analytics的分析，有將近五成訪客是使用HiNet。

想要利用Ftp進行備份，首先必須將Blog的訪問權限設定為“任何人”，你可以在「控制主頁–設定–權限」進行變更。

接著還需要將範本恢復成傳統範本，也就是恢復成舊的Blogger格式，所以在進行這一步時，最好將範本備份，而恢復成傳統範本的選項可以在「控制主頁–範本–修改HTML」頁面中最下方找到。

當完成上述的設定時，就可以在「控制主頁–設定–發佈」的頁面中，看到Ftp發佈的選項，連線方式有二種：Ftp和sFtp，目前HiNet似乎無法使用sFtp進行連線，建議選擇Ftp即可。

接下來要進行連線的設定，如下圖：
這裡是以HiNet做示範，所以在“FTP伺服器”請填入“upload.myweb.hinet.net“
Blog URL填入欲進行備份的Blog網址（包含“Http://”）
Ftp路徑則填入Ftp伺服器要放置備份檔案的資料夾名稱，也可不填
在頁面下方輸入會員帳號和密碼
儲存設定後會在頁面上出現“立即重新發佈”，點擊它進行備份

完成備份後，接著就是要Blog恢復成之前的格式，首先就是在「控制主頁–設定–發佈」中將發佈模式換回blogspot.com，接著到「控制主頁–範本–自定設計」進行升級，升級完後再將之前所備份的範本上傳，完成上述動作，你的Blog就會恢復成原本的模式，而且所有的文章也完成了備份。
至於沒有HiNet Ftp空間的朋友，請耐心等候，過幾天再來介紹如何自行架設一個FTP伺服器來進行備份。

如何利用HiNet FTP空間備份Blogger的文章 - 抓虾

为Blogger 添加Ajax自定义搜索引擎 - 抓虾

2007-11-14T06:03:00.001-08:00

Google Blogger 还有个特别版，叫Blogger in draft ，在Blogger 的一些功能上线之前，都会在这个特别版里进行测试。比如最新测试的投票插件已经正式发布到了Blogger 中。
就在昨天，Blogger in draft又开始了一项新功能的测试，即Ajax自定义搜索引擎（CSE）插件。关于Google 自定义搜索引擎及其创建方法，散人在之前已经有过很多介绍，总的来说就是：功能强大，定制过程繁琐。而如果你使用Blogger in draft 的这个CSE 插件，将可以为你为你省却不少麻烦。

登录到Blogger in draft 的控制台，进入到“模板（布局）”栏目，在“页面元素”编辑页面，选择“添加页面元素”，在打开的新窗口中，即可看到CSE 插件，添加即可。如果想进一步设置的话，可以选择在当前blog、链接出去的网站或整个互联网上进行搜索。
版权所有，转载时必须以链接的形式注明以下声明：

为Blogger 添加Ajax自定义搜索引擎 - 抓虾

一个Blogger应该知道的博客定律 - 抓虾

2007-11-14T05:59:00.001-08:00

本文是我在浏览前～博客时看到的他的推荐中的一篇文章，我认为是非常经典的作品，我把他转过来，和各位博友一起分享，希望大家也能从中学到一点东西，谢谢支持…也感谢前～博客的推荐。

1.250定律

拉德认为：每一位顾客身后，大体有250名亲朋好友。如果您赢得了一位顾客的好感，就意味着赢得了250个人的好感；反之，如果你得罪了一名顾客，也就意味着得罪了250名顾客。在你的网站访客中，一个访客可能可以带来一群访客，任何网站都有起步和发展的过程，这个过程中此定律尤其重要。
2.达维多定律

达维多认为，一个企业要想在市场上总是占据主导地位，那么就要做到第一个开发出新产品，又第一个淘汰自己的老产品。国内网站跟风太严重，比如前段时间的格子网，乞讨网，博客网，一个成功了，大家一拥而上。但实际效果是，第一个出名的往往最成功，所以在网站的定位上，要动自己的脑筋，不是去捡人家剩下的客户。同理，买人家出售的数据来建站效果是很糟糕的。

3.木桶定律

水桶定律是指，一只水桶能装多少水，完全取决于它最短的那块木板。这就是说任何一个组织都可能面临的一个共同问题，即构成组织的各个部分往往决定了整个组织的水平。注意审视自己的网站，是速度最糟糕？美工最糟糕？宣传最糟糕？你首先要做的，不是改进你最强的，而应该是你最薄弱的。

4.马太效应

《新约》中有这样一个故事，一个国王远行前，交给三个仆人每人一锭银子，吩咐他们：“你们去做生意，等我回来时，再来见我。”国王回来时，第一个仆人说：“主人，你交给我们的一锭银子，我已赚了10锭。”于是国王奖励他10座城邑。第二个仆人报告说：“主人，你给我的一锭银子，我已赚了5锭。”于是国王例奖励了他5座城邑。第三个仆人报告说：“主人，你给我的一锭银子，我一直包在手巾里存着，我怕丢失，一直没有拿出来。”于是国王命令将第三个仆人的一锭银子也赏给第一个仆人，并且说：“凡是少的，就连他所有的也要夺过来。凡是多的，还要给他，叫他多多益善。”这就是马太效应。在同类网站中，马太效应是很明显的。一个出名的社区，比一个新建的社区，更容易吸引到新客户。启示是，如果你无法把网站做大，那么你要做专。作专之后再做大就更容易。

5.手表定理

手表定理是指一个人有一只表时，可以知道现在是几点钟，而当他同时拥有两只表时却无法确定。
一个网站，你只需要关注你特定的用户群需求。不要在意不相干人的看法。

6.不值得定律

不值得定律：不值得做的事情，就不值得做好不要过度seo，如果你不是想只做垃圾站。不要把时间浪费在美化再美化页面，优化再优化程序，在你网站能盈利后，这些事情可以交给技术人员完成。

7.彼得原理

劳伦斯.彼得认为：在各种组织中，由于习惯于对在某个等级上称职的人员进行晋升提拔，因而雇员总是趋向于晋升到其不称职的地位。
不要轻易改变自己网站的定位。如博客网想变门户，盛大想做娱乐，大家拭目以待吧。

8.零和游戏原理

当你看到两位对弈者时，你就可以说他们正在玩“零和游戏”。因为在大多数情况下，总会有一个赢，一个输，如果我们把获胜计算为得1分，而输棋为-1分，那么，这两人得分之和就是：1+（-1）=0 不要把目光一直盯在你的竞争网站上，不要花太多时间抢它的访客。我们把这些时间用来寻找互补的合作网站，挖掘新访客。

9.华盛顿合作规律

华盛顿合作规律说的是：一个人敷衍了事，两个人互相推诿，三个人则永无成事之日。如果你看准一个方向，你自己干，缺人手就招。不要轻易找同伴一起搞网站，否则你会发现，日子似乎越过越快了，事情越做越慢了。

10.邦尼人力定律

一个人一分钟可以挖一个洞，六十个人一秒种却挖不了一个洞。合作是一个问题，如何合作也是一个问题。你需要有计划。

11.牛蛙效应

把一只牛蛙放在开水锅里，牛蛙会很快跳出来；但当你把它放在冷水里，它不会跳出来，然后慢慢加热，起初牛蛙出于懒惰，不会有什么动作，当水温高到它无法忍受的时候，想出来，但已经没有了力气。如果你是soho，注意关注你的财务。不要等到没钱了再想怎么挣，你会发现那时候挣钱更难。

12.蘑菇管理

蘑菇管理是许多组织对待初出茅庐者的一种管理方法，初学者被置于阴暗的角落（不受重视的部门，或打杂跑腿的工作），浇上一头大粪（无端的批评、指责、代人受过），任其自生自灭（得不到必要的指导和提携）。
做网站毕竟要遭遇这样的阶段，搜索引擎不理你，友情链接找不到，访客不上门。这是磨练。

13.奥卡姆剃刀定律

如无必要，勿增实体。
把网站做得简单，再简单，简单到非常实用，而不是花俏。google的首页为什么比雅虎好？

14.巴莱多定律(Paredo也叫二八定律)

你所完成的工作里80%的成果，来自于你20%的付出；而80%的付出，只换来20%的成果。
随时衡量你所做的工作，哪些是最有效果的。

1.马蝇效应
林肯少年时和他的兄弟在肯塔基老家的一个农场里犁玉米地，林肯吆马，他兄弟扶犁，而那匹马很懒，慢慢腾腾，走走停停。可是有一段时间马走得飞快。林肯感到奇怪，到了地头，他发现有一只很大的马蝇叮在马身上，他就把马蝇打落了。看到马蝇被打落了，他兄弟就抱怨说：”哎呀，你为什么要打掉它，正是那家伙使马跑起来的嘛！” 在你心满意足的时候，去寻找你的马蝇。没有firefox，不会有ie7，firefox就是微软的马蝇之一。马蝇不可怕，怕的是会一口吃掉你的东西，像ie当初对网景干的那样。
2.最高气温效应
每天最热总是下午2时左右，我们总认为这个时候太阳最厉害，其实这时的太阳早已偏西，不再是供给最大热量的时候了。此时气温之所以最高，不过是源于此前的热量积累。
你今天的网站流量，是你一个星期或更长时间前所做的事带来的。
3.超限效应(溢出效应)
刺激过多、过强和作用时间过久而引起心理极不耐烦或反抗的心理现象，称之为“超限效应”。别到别人论坛里发太多广告。别在自己网站上放太多广告。别在自己的论坛里太多地太明显地诱导话题。
4.懒蚂蚁效应
生物学家研究发现，成群的蚂蚁中，大部分蚂蚁很勤劳，寻找、搬运食物争先恐后，少数蚂蚁却东张西望不干活。当食物来源断绝或蚁窝被破坏时，那些勤快的蚂蚁一筹莫展。“懒蚂蚁”则“挺身而出”，带领众伙伴向它早已侦察到的新的食物源转移。不要把注意力仅仅放在一个网站上，即使这个网站现在为你带来一切。你要给自己一些时间寻找新的可行的方向，以备万一。
5.长尾理论
ChrisAnderson认为，只要存储和流通的渠道足够大，需求不旺或销量不佳的产品共同占据的市场份额就可以和那些数量不多的热卖品所占据的市场份额相匹敌甚至更大。对于搜索引擎，未必你需要一个热门词排在第一位，如果有一千个冷门词排在第一位，效果不但一样，还会更稳定更长远。
6.破窗理论
栋建筑上的一块玻璃，又没有及时修好，别人就可能受到某些暗示性的纵容，去打碎更多的玻璃。管理论坛时，如果你发现第一个垃圾贴，赶紧删掉他吧。想想：落伍现在为什么那么多××贴？现在控制比最初控制难多了。
7.“羊群效应”，又称复制原则(Copy Strategy)
一个羊群(集体)是一个很散乱的组织，平时大家在一起盲目地左冲右撞。如果一头羊发现了一片肥沃的绿草地，并在那里吃到了新鲜的青草，后来的羊群就会一哄而上，争抢那里的青草，全然不顾旁边虎视眈眈的狼，或者看不到其它地方还有更好的青草。
不要轻易跟风，保持自己思考的能力。
8.墨菲定律
如果坏事情有可能发生，不管这种可能性多么小，它总会发生，并引起最大可能的损失。
除非垃圾站，否则不要作弊，对搜索引擎不要，对广告也不要。
9.光环效应
人们对人的某种品质或特点有清晰的知觉，印象比较深刻、突出，这种强烈的知觉，就像月晕形式的光环一样，向周围弥漫、扩散，掩盖了对这个人的其他品质或特点的认识。
不要轻易崇拜一个人或者公司、一个概念、一种做法。
10.蝴蝶效应
一只亚马逊河流域热带雨林中的蝴蝶，偶尔扇动几下翅膀，两周后，可能在美国德克萨斯州引起一场龙卷风。
不管你做什么，网站或者其他，你都应该关注新闻。机遇或者灾难可能就在那。
11.阿尔巴德定理
一个企业经营成功与否，全靠对顾客的要求了解到什么程度。我赞同别人的点评：看到了别人的需要，你就成功了一半；满足了别人的需求，你就成功了全部。尤其是做网站。
12.史密斯原则
如果你不能战胜他们，你就加入到他们之中去。
不要试图做孤胆英雄。如果潮流挡不住，至少，你要去思考为什么。

一个Blogger应该知道的博客定律 - 抓虾

[Blog] Blogger文章回應產生的方法 - 抓虾

2007-11-14T05:58:00.001-08:00

之前在弄如何讓Blogger旁邊也能像無名這些其他人家已經寫好的部落格空間一樣有「最新回應」這項功能，就讓我搜尋到堯@部落格這位大大寫的產生器，於是乎，很感激他的分享，我也有了能夠看到最新文章留言的小功能。
但沒想到卻發生我的產生器功能壞掉的問題，發現其他部落客都有使用堯的方法，但似乎沒有問題產生（？）於是我只好另尋他法，也讓我找到Jnana Life分享的另外一種方法，更加方便，原來Blogger自己就可以產生最新文章回應器了，而且非常簡單！此外還有「最新文章」的顯示功能，但我覺得這個功能跟Article Archive不是重複了嗎？但如果你想要用力把自己的部落格塞滿的話，要放這個功能也是可以的＠＠
堯@部落格分響的產生器優點是可以顯示最新幾筆的回應是由自己決定，使用者還可以選擇是否要顯示留言的全文，有full和short兩種可以選擇；相較來說，Jnana Life分享的方式因為是Blogger內建的「資訊提供」的小套件，因此最多也只能顯示5筆，況且是顯示完整內容，要是人氣較旺的部落格，光是一篇一篇回覆之後，恐怕「最新」馬上就被淘汰掉啦＠＠只能說它只接受「最新5筆」啊！當然相對來說語法是比較簡短而明瞭囉，不過複製貼上的動作同樣都是花那幾秒鐘啦！因此，大家就自己斟酌吧！

[Blog] Blogger文章回應產生的方法 - 抓虾

blogger的相互依赖性 - 抓虾

2007-11-14T05:57:00.001-08:00

如题目所示，你注意到这个依赖性了么？
    blogger A 更新博客，blogger B 跟进，然后blogger C响应，blogger D开始发表不同意见。不知道什么时候，你就慢慢养成了或者被养成这样的习惯。应该说，这个习惯起始于你的阅读习惯。
    而这种习惯已经潜意识的让你把
         blogger A当作了一个意见领袖；
         blogger B，C，D 则是团结在blogger A 周围的圈子。这个圈子越大，那么blogger A的影响力也就越大。
    是的blogger A是B，C，D的领袖，当他发现B，C，D的观点很有价值，那么他又会推荐B，C，D的blog，让读者从其他的视角去看同样的问题。
    当我们看这样一个依赖关系图的时候，我们愕然发现：
blogger A 的上网时间最多，阅读量最大；
         blogger B，C，D的时间可能会少一些。
    总的来看，也就是说blogger A是一个思想者，而B，C，D是推动着。那么如何真正的去辨别真思想者与伪思想者呢，看评论；评论能否反映出一篇blog的价值，而看一个blogger的所有博客，你发现评论都有，而且都有深度，那么他算得上一个意见领袖；但他只是一个圈子的领袖，如果是一个产品的领袖，那么要看新闻搜索了，如果他经常出现，那么一定是他了。
    今天我不会去分析意见领袖与非意见领袖如何区分，而是仅仅点出一点，blogger 相互之间的依赖性是一条暗线，我们对其重视的非常非常地有限，它的价值也被我们低估了。
类别： 互联网综合点评查看评论

blogger的相互依赖性 - 抓虾

Blogger技巧收集

茶宫人体姐妹篇 [10P]

茶宫人体姐妹篇 [10P]

2008年网络名言

是谁害死了小布托？

是谁害死了小布托？

如何看待巴基斯坦这个国家？

中共能跳出七十年兴亡周期圈吗

jQuery中文入门教程_译自Getting Started with jQuery

jQuery中文入门指南，翻译加实例，jQuery的起点教程

中文版译者：Keel

以下部分为原文翻译:

jQuery入门指南教程

内容提要

安装

本章的相关链接:

Hello jQuery

本章的相关链接:

Find me:使用选择器和事件

本章的相关链接:

Rate me:使用AJAX

本章的相关链接:

Animate me(让我生动起来):使用FX

本章的相关链接:

Sort me(将我有序化):使用tablesorter插件(表格排序)

本章的相关链接:

Plug me:制作自己的插件

Next steps(下一步)

还有什么...

© 2006, Jörn Zaefferer - last update: 2006-09-12

中文版翻译:Keel - 最后更新: 2006-12-13

Google Web APIs 参考中文版

测试图片

Blog选址,可实现通过xml-rpc标准进行远程离线发布的Blog服务商(BSP)测评 - 文化消费者 - 博客园

EditPlus v2.12 使用技巧集萃

Chinese Blogger 禾草唐楷: 博客技巧

Chinese Blogger 禾草唐楷: 解答“亚一”关于blogger模版修改的问题

blogger:在Blogger Beta的独立文章页中增加所在位置导航

Blogger: 怎样实现三栏的Blogger Beta模板

色彩斑斓: Blogger beta技巧：添加导航栏

色彩斑斓: Blogger beta:把模板修改为三栏

色彩斑斓: Blogger beta:技巧：随机显示页首图片（Banner）

色彩斑斓: Blogger beta：头信息优化

色彩斑斓: Blogger:自动隐藏搜索栏（Navbar）

GG派: blogger:如何隐藏Blogger Beta的导航条Navbar

色彩斑斓: Blogger beta：一分钟修改页首图片

色彩斑斓: 关注博客的反向链接

色彩斑斓: Blogger beta：图片解剖Blogger beta模板代码

HTML=

色彩斑斓: Blogger简单代码修改

GG派: blogger beta:beta的基础知识图解

2006年12月18日 星期一

Blogger Hacks总集

如何在Blogger首页显示文章的摘要

如何将作者姓名链接到我的团队 Blog 中的个人资料？

如何将作者姓名链接到我的团队 Blog 中的个人资料？

我还可以利用 CSS 的哪些其他功能？

用于布局的字体和颜色标记

用于布局的窗口小部件标记

包含

数据

循环

条件循环

如何创建新窗口小部件以便其他用户添加到其布局中？

布局数据标记

全局数据

页面标题

博客帖子

博客归档

个人资料窗口小部件

文本/HTML/JavaScript 窗口小部件

供稿窗口小部件

图片窗口小部件

标签窗口小部件

列表窗口小部件

链接表窗口小部件

徽标窗口小部件

用于布局的页面元素标记

用于布局的页面元素标记

我的痕迹: 大致知道模板是怎么回事了

2006年12月18日星期一

挑博立间: Blogger第四讲：图片示例Blogger beta模板代码结构