Apple Flavour.: blogger。教程

显示标签为“blogger。教程”的博文。显示所有博文

工具 | 鼠标点击时的烟花效果

效果图 ↓

这个工具就是我现在用着的，当鼠标点击时会有烟花效果

1. 布局》添加小工具》 HTML/Javascript

2. paste 以下代码进去:

<script type="text/javascript">
// <![CDATA[
var sparks=75; // how many sparks per clicksplosion
var speed=33; // how fast - smaller is faster
var bangs=5; // how many can be launched simultaneously (note that using too many can slow the script down)
var colours=new Array('#fde4d3', '#fde4d3', '#fde4d3', '#fde4d3', '#fde4d3', '#fde4d3', '#fde4d3'); 
//           

/****************************
*   Clicksplosion Effect    *
* (c) 2012 mf2fm web-design *
*  http://www.mf2fm.com/rv  *
* DON'T EDIT BELOW THIS BOX *
****************************/
var intensity=new Array();
var Xpos=new Array();
var Ypos=new Array();
var dX=new Array();
var dY=new Array();
var stars=new Array();
var decay=new Array();
var timers=new Array();
var swide=800;
var shigh=600;
var sleft=sdown=0;
var count=0;

function addLoadEvent(funky) {
  var oldonload=window.onload;
  if (typeof(oldonload)!='function') window.onload=funky;
  else window.onload=function() {
    if (oldonload) oldonload();
    funky();
  }
}

addLoadEvent(clicksplode);

function clicksplode() { if (document.getElementById) {
  var i, j;
  window.onscroll=set_scroll;
  window.onresize=set_width;
  document.onclick=eksplode;
  set_width();
  set_scroll();
  for (i=0; i<bangs; i++) for (j=sparks*i; j<sparks+sparks*i; j++) {
    stars[j]=createDiv('*', 13);
    document.body.appendChild(stars[j]);
  }
}}

function createDiv(char, size) {
  var div, sty;
  div=document.createElement('div');
  sty=div.style;
  sty.font=size+'px monospace';
  sty.position='absolute';
  sty.backgroundColor='transparent';
  sty.visibility='hidden';
  sty.zIndex='101';
  div.appendChild(document.createTextNode(char));
  return (div);
}

function bang(N) {
  var i, Z, A=0;
  for (i=sparks*N; i<sparks*(N+1); i++) { 
    if (decay[i]) {
      Z=stars[i].style;
      Xpos[i]+=dX[i];
      Ypos[i]+=(dY[i]+=1.25/intensity[N]);
      if (Xpos[i]>=swide || Xpos[i]<0 || Ypos[i]>=shigh+sdown || Ypos[i]<0) decay[i]=1;
      else {
        Z.left=Xpos[i]+'px';
        Z.top=Ypos[i]+'px';
   }
      if (decay[i]==15) Z.fontSize='7px';
      else if (decay[i]==7) Z.fontSize='2px';
      else if (decay[i]==1) Z.visibility='hidden';
   decay[i]--;
 }
 else A++;
  }
  if (A!=sparks) timers[N]=setTimeout('bang('+N+')', speed);
}

function eksplode(e) { 
  var x, y, i, M, Z, N;
  set_scroll();
  y=(e)?e.pageY:event.y+sdown;
  x=(e)?e.pageX:event.x+sleft;
  N=++count%bangs;
  M=Math.floor(Math.random()*3*colours.length);
  intensity[N]=5+Math.random()*4;
  for (i=N*sparks; i<(N+1)*sparks; i++) {
    Xpos[i]=x;
    Ypos[i]=y-5;
    dY[i]=(Math.random()-0.5)*intensity[N];
    dX[i]=(Math.random()-0.5)*(intensity[N]-Math.abs(dY[i]))*1.25;
    decay[i]=16+Math.floor(Math.random()*16);
    Z=stars[i].style;
    if (M<colours.length) Z.color=colours[i%2?count%colours.length:M];
    else if (M<2*colours.length) Z.color=colours[count%colours.length];
    else Z.color=colours[i%colours.length];
    Z.fontSize='13px';
    Z.visibility='visible';
  }
  clearTimeout(timers[N]);
  bang(N);
} 

function set_width() {
  var sw_min=999999;
  var sh_min=999999;
  if (document.documentElement && document.documentElement.clientWidth) {
    if (document.documentElement.clientWidth>0) sw_min=document.documentElement.clientWidth;
    if (document.documentElement.clientHeight>0) sh_min=document.documentElement.clientHeight;
  }
  if (typeof(self.innerWidth)=='number' && self.innerWidth) {
    if (self.innerWidth>0 && self.innerWidth<sw_min) sw_min=self.innerWidth;
    if (self.innerHeight>0 && self.innerHeight<sh_min) sh_min=self.innerHeight;
  }
  if (document.body.clientWidth) {
    if (document.body.clientWidth>0 && document.body.clientWidth<sw_min) sw_min=document.body.clientWidth;
    if (document.body.clientHeight>0 && document.body.clientHeight<sh_min) sh_min=document.body.clientHeight;
  }
  if (sw_min==999999 || sh_min==999999) {
    sw_min=800;
    sh_min=600;
  }
  swide=sw_min-7;
  shigh=sh_min-7;
}

function set_scroll() {
  if (typeof(self.pageYOffset)=='number') {
    sdown=self.pageYOffset;
    sleft=self.pageXOffset;
  }
  else if (document.body && (document.body.scrollTop || document.body.scrollLeft)) {
    sdown=document.body.scrollTop;
    sleft=document.body.scrollLeft;
  }
  else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
    sleft=document.documentElement.scrollLeft;
    sdown=document.documentElement.scrollTop;
  }
  else {
    sdown=0;
    sleft=0;
  }
}
// ]]>
</script>

代码里面有七个 #fde4d3 的是浅粉红色的颜色代码，
可以任意更改成其他颜色。更多颜色代码请看 > 这里 <

Blogger更新了模板代码？

点图放大

呃...有没有人发现 blogger模板 > 修改HTML 那边变了？

展示代码的方式很明显的改变了，也有博友说HTML代码也有变化。

不过仔细看看，其实部分找不到的代码只是被收起来而已 :)

例如第16行的 <b:skin>...</b:skin> ，点击中间的 ‘...’ ，被收起的代码就会展示出来了~

♥

http://24.media.tumblr.com/7aac73e202bdb13357f15b1d4e56bf49/tumblr_ml7eegeC6x1qhqemyo1_400.png

http://25.media.tumblr.com/8cccb20431cc98723848afe30b7de3e0/tumblr_ml73omGSlD1qhy8f9o1_r1_500.gif

PSY的新单曲《Gentleman》，你看了吗？ ^_^

工具 | 把Instagram照片链接到部落格

Annyeonghaseyeo

这篇要分享2款Instagram的小工具。相信大部分智能手机控都有玩Instagram吧~
如何把Instagram里的照片展示在部落格里呢？

BadgePlz

这款就是我现在用着的 ↓↓ (下面这张是图片)

首先，先去 http://badgeplz.com/ 。
Generate your personalized Instagram widget 下面会看到这个 ↓ （下面这张是图片）

最重要的是Instagram Username 那边一定要填写你的用户名。
Photo Layout 3x2 是横有3张照片直有2张照片。可以随意更改
Include User Info 是要不要显示你的用户名，几张照片和几个关注者。
其余的不用更改也没关系。

填好了就按 Generate , 在下面的 Badge Code 里面的代码copy起来，
去设计》布局》添加小工具》 HTML/Javascript ，然后paste代码进去就行了 :)

SnapWidget

这款比上面那款的少人用。

先到 http://snapwidget.com/ 。按 Get Your Free Widget ，它会自动跳到下面去。

（以下的是图片）

这个工具比较有趣，它可以选择放 你Instagram的户口所上传过的照片 或者 某个Tag的照片。

就是说，如果我只想放关于埃菲尔铁塔的照片在部落格，就在 Hashtag 那边填 eiffel ,然后把 username 那边空着。

那么小工具的图片就会全部都是埃菲尔铁塔。就像这样 ↓

Widget Type 那边可以选 3种展示照片的方法 : Grid, Slideshow 和 Map.

可是不懂为什么Slideshow和Map我都看不到。

上面的是用Grid的。

其它的你们可以随意更改。完成后按 Get Widget , 把代码copy起来，去设计》布局》添加小工具》 HTML/Javascript ，然后paste代码进去就行了。

祝使用愉快 ^_^

教程 | Blogger Navbar放背景

正如我现在用着的blogger navbar是有碎花背景图的。

新旧模板都可以使用 blogger-emoticon.blogspot.com

首先，先去布局》Navbar的格子那边按修改，确保使用的Navbar是浅透明色。

然后去模板》修改HTML，按Ctrl+F 找 :

</b:skin>

在它上面paste 这个 :

#navbar-iframe {
background-image: url(背景图url) ;

记得把背景图url换成真的url blogger-emoticon.blogspot.com

完成啦~

工具 | 鼠标装饰效果(粉红星星)

部落格好像变得很冷清。因为我太久没更新 T^T
没关系，我会很努力把它回复原来的气氛！

Tumblr_mfxuxmz4vg1rj5pqro1_400_large

暂时先分享这款 ↓

鼠标会落下这种粉红色的星星。

1. 去布局》添加小工具》 HTML/Javascript

2. paste以下的代码进去 :

<script type="text/javascript" src="http://bpmaker.giffy.me/userdata/user/12/12738/37/parts.js"></script>

3. 完成啦 !!! :)

（麻烦各位大大帮我按广告，谢谢）

工具 | 自己添加Navbar

好久没更新了

都不知道要发什么教程了，哈哈

箭头直指的那条navbar。可以自己设定字体，颜色等等。

比原本blogger的美多多声对吧？

*

要加这个之前先把blogger的navbar删掉 >按这里<

*

1. 布局》添加小工具》 HTML/Javascript

2. paste 以下代码进去:

<div style="position: absolute; top:0px; right: 0px; width:100%; border-radius:2px; position:fixed; padding:3px; background:#FAAFBE; color:#000000; font-size:11px;">
<div style="text-align: center;">
<b style="color: white;">Welcome To</b> <b style="color: white;">My Blog</b> { <a href="http://www.blogger.com/follow-blog.g?blogID=1301744740769521459" style="color: white;">Follow</a> | <a href="http://www.blogger.com/home" style="color: white;">Dashboard</a> }</div>
</div>

红色的是blog ID ，去布局时看上面的网址栏里面就会有自己的ID号码，
copy那个ID号码放进去就行了 :)

字体那些可以自己改代码喔

# Any request for tutorial ?

教程 | outer-wrapper会发光

此教程不支持新模板。

>>点我<< 看如何加白色的outer wrapper :)

↑ 就像图片里的白色outer wrapper ，但是边缘那边会发光 :D

就在之前放白色outer wrapper那边, (先在修改html那边)

按 Ctrl+F 找

#outer-wrapper {

在它下面paste

-moz-box-shadow: 0 0 10px #FFFFFF ;-webkit-box-shadow: 0 0 30px #FFFFFF;

保存起来即可 ^______^

#记得要做了之前那个加outer wrapper的教程先才会看到效果喔 :)

--------------------------------------------------------------------------------------------------✄

最近部落格在进行装修，如何有任何不便请多多体谅啊 OvO

话说，我的nuffnang已经满RM50了，刚刚看到真的非常兴奋~

希望大家继续帮我按广告让我可以收到第二次的支票啊，谢谢（亲

教程 | 在博客归档加Scroll

才发现blogger帖子编辑器又变了 ><

通常常发帖的博友会觉得自己的博客归档很长，
如果不喜欢这样长，可以放个scroll。像我的这样 ^^

趁得空来碰碰代码。这个教程有点复杂喔 ><

1. 去设计》修改HTML，先打勾 扩展窗口小部件模板

按 Ctrl + F 找

<div id='ArchiveList'>

2. 在它上面paste这个

<div style='overflow:auto; width:ancho; height:100px;'>

后面还要加 </div> 才可以哦~ (height可以自己改)

Sample样本：

<div style=’overflow:auto; width:ancho; height:100px;’>
<div id=’ArchiveList’>
<div expr:id=’data:widget.instanceId + "_ArchiveList"’>
<b:if cond=’data:style == "HIERARCHY"’>
<b:include data=’data’ name=’interval’/>
</b:if>
<b:if cond=’data:style == "FLAT"’>
<b:include data=’data’ name=’flat’/>
</b:if>
<b:if cond=’data:style == "MENU"’>
<b:include data=’data’ name=’menu’/>
</b:if>
</div>
</div> </div>
<b:include name=’quickedit’/>

保存起来即可 :)

#帮我按nuffnang广告啦喂，O(∩_∩)O谢谢

工具 | 添加社交网络按钮

不发教程 我的部落格就 死气沉沉。

趁得空快快发，今年SPM没啥时间发了 T^T

1. 去设计》页面元素》添加小工具》HTML/JAVASCRIPT....

把这些代码 paste 进去~

<center><a href="你的面子书profile网址"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBx3JMNLWoEW7Ia-RhUdXj9JEC5kSp9N8obguBX4Mee3K2Fh_zuJjsPeT3_heaPXqrj4PuWqVSlauKjpUF5E0dRYr1-0k94ByBR7rJzn8k5Cu_JGnOH9xJr5rlpR6EiRXzDzhaXQcjWaiJ/s1600/c20_006.png" /></a> <a href="你的twitter profile网址"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj48dAcg5u5Ptw7X5QlCYZaOP7DLCHMH-qq-a5Mj5LyfqfdzTI9x43Vl_un0JwA2mW-rEVyEa2dRIFhnqXAH9_AjFH2qucAtNNDnS75TInSZ1rOg9YKciKyopbgFuTRNStLYj3LN21ZPOQr/s1600/c20_017.png" /></a> <a href="你的微博 profile网址"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgv64ALo6TaFUxRtB0cRpeli0KmP9kcpSJiR0L1F1_4dKoGcfqc141gDD1sMh9oXnC7M_DJZtc2h-XZCWvd_7yObc9-IZEuGCLumzmKhkAoi4U44DDweg9wJJSwnGmZLiYq6fS5wGquRfK/s1600/c20_018.png" /></a></center>

（代码中的按钮图片跟我的一样，如果不喜欢可以自己换掉 :) ）

如果你没有微博和Twitter可以把它们代码删掉。
或者
如果你要添加其他社交网络的按钮可以添加以下代码

<a href="社交网络profile网址"><img border="0" src="图片按钮网址" /></a>

我用着的图片都很大方的提供了，帮我按广告吧。

哈哈

教程 | 调整帖子和小工具栏空间的宽度

很多刚换成旧模板的朋友一直问我，到底怎样把帖子和小工具栏的空间调宽。
因为原本模板设定的宽度很窄。

[旧模板]

1. 去设计》修改HTML，找

/* Outer-Wrapper

2. 它下面会有 #outer-wrapper { ， #main-wrapper { 和 #sidebar-wrapper { 三段代码。

3. 先看 #outer-wrapper { 的代码，它下面会有 width: 多少px 的。
    把它改成 width: 70%;
    (巴仙率越大，部落格旁边白色的地方就越少)

4. 把 #main-wrapper { 下面的 width 改成 width: 62%;
    (巴仙率越大，帖子空间的宽度越大，不过太大的话小工具栏会掉去下面喔~)

5. 再把 #sidebar-wrapper { 下面的width 改成 width: 30%;
    (巴仙率越小，小工具栏的空间越窄，不过最宽只能30%罢了，不然小工具栏会掉去下面)

大家可以先预览先再保存以避免发生任何差错。 :)

[新模板]

新模板的简单得多~这就是模板设计器的好处 :D

1. 去模板》按橙色按钮 自定义，调整宽度。

根据自己的喜好来调整就行了，下面可以浏览效果。

现在部落格是不是好看多了?
(^________^#)

工具 | 多款圣诞节特效

之前说好要发的，结果因为网速问题泡汤了。
今天来发吧^_________^

1. 去设计》页面元素》添加小工具》HTML/Java Script

2. 把这些代码paste进去（选择你喜欢的特效）

圣诞老人滑过特效

<script type="text/javascript" src="http://blogparts.giffy.me/0017/parts.js"></script>

圣诞小物向下落特效

<script type="text/javascript" src="http://blogparts.giffy.me/0002/parts.js"></script>

圣诞小物向上爆开特效

<script type="text/javascript" src="http://blogparts.giffy.me/0001/parts.js">

圣诞老人派礼物特效

<script type="text/javascript" src="http://blogparts.giffy.me/0003/parts.js">

如果不知道效果是怎样的可以用看。 ^_________^
个人是比较喜欢第一个和圣诞老人派礼物的~

欢迎使用，记得帮我点击Nuffnang 广告喔 :D

工具 | 下雪の效果2

去年圣诞节前夕分享过了下雪の效果，由于雪是白色又很小，所以今天分享过另外一种。
这么巧今年分享是也是圣诞节前夕。

1. 去设计》页面元素》添加小工具》HTML/Java Script

2. 把这些代码paste进去：

<script>

//Here you can add your own picture for snow. Just change the url
var snowsrc="http://i13.servimg.com/u/f13/11/52/70/02/snowba10.png"
//how many snowflakes there will be (currently 12)
var no =40;
//How fast will the snow disappear (0 is never)
var hidesnowtime = 0;
//The height the snow will reach before it disappears ("windowheight" or "pageheight")
var snowdistance = "pageheight";
///////////////////////////////End of Settings///////////////////////////////////
var ie4up = (document.all) ? 1 : 0;
var ns6up = (document.getElementById&&!document.all) ? 1 : 0;

function iecompattest()
{
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}

var dx, xp, yp;
var am, stx, sty;
var i, doc_width = 800, doc_height = 600;

if (ns6up)
{
doc_width = self.innerWidth;
doc_height = self.innerHeight;
}
else
if (ie4up)
{
doc_width = document.body.clientWidth;
doc_height = document.body.clientHeight;
}

dx = new Array();
xp = new Array();
yp = new Array();
am = new Array();
stx = new Array();
sty = new Array();

for (i = 0; i < no; ++ i)
{
dx[i] = 0;
xp[i] = Math.random()*(doc_width-50);
yp[i] = Math.random()*doc_height;
am[i] = Math.random()*20;
stx[i] = 0.02 + Math.random()/10;
sty[i] = 0.7 + Math.random();
if (ie4up||ns6up)
{
if (i == 0)
{
document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><a href=\"http://rftactical.darkbb.com/index.htm\"><img src='"+snowsrc+"' border=\"0\"><\/a><\/div>");
}
else
{
document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><img src='"+snowsrc+"' border=\"0\"><\/div>");
}
}
}

function snowIE_NS6()
{
doc_width = ns6up?window.innerWidth-10 : iecompattest().clientWidth-10;
doc_height=(window.innerHeight && snowdistance=="windowheight")? window.innerHeight : (ie4up && snowdistance=="windowheight")? iecompattest().clientHeight : (ie4up && !window.opera && snowdistance=="pageheight")? iecompattest().scrollHeight : iecompattest().offsetHeight;
for (i = 0; i < no; ++ i)
{
yp[i] += sty[i];
if (yp[i] > doc_height-50)
{
xp[i] = Math.random()*(doc_width-am[i]-30);
yp[i] = 0;
stx[i] = 0.02 + Math.random()/10;
sty[i] = 0.7 + Math.random();
}
dx[i] += stx[i];
document.getElementById("dot"+i).style.top=yp[i]+"px";
document.getElementById("dot"+i).style.left=xp[i] + am[i]*Math.sin(dx[i])+"px";
}
snowtimer=setTimeout("snowIE_NS6()", 10);
}

function hidesnow()
{
if (window.snowtimer) clearTimeout(snowtimer)
for (i=0; i<no; i++) document.getElementById("dot"+i).style.visibility="hidden"
}

if (ie4up||ns6up)
{
snowIE_NS6();
if (hidesnowtime>0)
setTimeout("hidesnow()", hidesnowtime*1000)
}
</script>

↑ 上面是白色的雪球

下面还有其他雪球颜色可以选。要换颜色的话把上面紫色underline 的url 换成下面你要的颜色的url 就好了 ^^

黑色

http://i905.photobucket.com/albums/ac251/bigadira95/snowhitam.png

粉红色

http://i905.photobucket.com/albums/ac251/bigadira95/snowmerah.png

蓝色

http://i905.photobucket.com/albums/ac251/bigadira95/snowbiru.png

紫色

http://i608.photobucket.com/albums/tt163/pwincess9214/snow.png

完。

工具 | 放youtube player 进帖子

由于很多人一直问我这个干脆就发个教程好了 ><”

首先大家有必要来看这教程先 >> 工具 | 小小的youtube player

去 copy 好那边的代码，然后去信息中心>新建帖子
你会看到2个模式：修改HTML 和撰写

>>> 按 修改HTML

如图：

把代码 paste 在修改HTML那边就好了 :))

然后你可以继续在撰写模式完成你的帖子，只要没有改到代码呢，
它还是一样有效的，就是这么简单。

任何问题留言给我吧，谢谢 ^^

工具 | 链接开在新窗口

就像我现在用着的，当你按一个链接时，页面会显示在新窗口。

[此教程支持新旧模板]

1. 去设计》页面元素》添加小工具》HTML/JAVASCRIPT....

把以下代码 paste 进去 ↓

<script type="text/javascript" language="javascript">
       var arr = document.getElementsByTagName("a"); //get all links in the page
       for(var i = 0; i < arr.length; i++)
       {
          if(arr[i].href.indexOf("Your URL") < 0 //not links that are 'inside' blog
             && arr[i].href.indexOf("javascript:") < 0) //not javascript links
             arr[i].target = "_blank";
       }
    </script>

保存起来即可 :D

很简单吧？

工具 | 花瓣掉落

希望你们会喜欢 :)

[此教程支持新旧模板]

1. 去设计》页面元素》添加小工具》HTML/JAVASCRIPT....

把这些代码 paste 进去~

<script>if(typeof jQuery=='undefined'){document.write('<'+'script');document.write(' language="javascript"');document.write(' type="text/javascript"');document.write(' src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">');document.write('</'+'script'+'>')}</script><script>if(!image_urls){var image_urls=Array()}if(!flash_urls){var flash_urls=Array()}image_urls['rain1']="http://2.bp.blogspot.com/-IQXNv-_CBLE/TpWcK7LL4VI/AAAAAAAAG0I/bcxYcqc_uI0/pinkpetal1.png";image_urls['rain2']="http://4.bp.blogspot.com/-teXCIicWPF4/TpWcLLg0A2I/AAAAAAAAG0U/IPPCr1gponc/pinkpetal2.png";image_urls['rain3']="http://3.bp.blogspot.com/-3JG9HLECCRU/TpWcLZGSYtI/AAAAAAAAG0g/zIJINua93TE/redpetal1.png";image_urls['rain4']="http://2.bp.blogspot.com/-BByhQEK5E24/TpWcLux4xRI/AAAAAAAAG0s/x2hIr1AV_Ac/redpetal2.png";$(document).ready(function(){var c=$(window).width();var d=$(window).height();var e=function(a,b){return Math.round(a+(Math.random()*(b-a)))};var f=function(a){setTimeout(function(){a.css({left:e(0,c)+'px',top:'-30px',display:'block',opacity:'0.'+e(10,100)}).animate({top:(d-10)+'px'},e(7500,8000),function(){$(this).fadeOut('slow',function(){f(a)})})},e(1,8000))};$('<div></div>').attr('id','rainDiv')
.css({position:'fixed',width:(c-20)+'px',height:'1px',left:'0px',top:'-5px',display:'block'}).appendTo('body');for(var i=1;i<=20;i++){var g=$('<img/>').attr('src',image_urls['rain'+e(1,4)])
.css({position:'absolute',left:e(0,c)+'px',top:'-30px',display:'block',opacity:'0.'+e(10,100),'margin-left':0}).addClass('rainDrop').appendTo('#rainDiv');f(g);g=null};var h=0;var j=0;$(window).resize(function(){c=$(window).width();d=$(window).height()})});</script>
<script>if(typeof jQuery=='undefined'){document.write('<'+'script');document.write(' language="javascript"');document.write(' type="text/javascript"');document.write(' src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">');document.write('</'+'script'+'>')}</script><script>$(document).ready(function(){var a=$('<img>').attr({'src':'http://2.bp.blogspot.com/-IQXNv-_CBLE/TpWcK7LL4VI/AAAAAAAAG0I/bcxYcqc_uI0/pinkpetal1.png','border':0});$('<a></a>').css({position:'absolute',right:'0px',top:'22px','z-index':'90'}).attr({'href':'http://yes-apple.blogspot.com/'}).append(a).appendTo('body')});</script>

保存起来就好了 ^^

工具 | 浮在空中的欢迎字条

[此教程不支持新模板]

很抱歉的说，大部分新模板用户做了这个教程都不不能浮在上面，所以就不适合新模板用户了><

黑框里的这个:

[注意] 此小工具在新模板的位置会乱掉。所以不支持新模板。

1. 去设计》页面元素》添加小工具》HTML/JAVASCRIPT....

把这些代码 paste 进去~

<div style=" position:absolute; top:0px; left:200px;"><img src="图片网址"/></div><div style=" position:absolute; top:26px; left:215px;"><center>欢迎光临</center></div>

蓝色和红色的是图片浮着的位置。如果不喜欢可以自己更改。

这里提供一些图片 (转载)

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEib8B4glzqZp-olL7svTKTZS7jKJCyynqYZZpNragTBL2_YW-K08qtM4Gd8wX2J5GEObyOq8DwlGaTGH4Ik_szG1Fh094977QOIbPhIEz5nGKg0ELECN-kpblNGpByBct7FDjbb1oJT0sch/s1600/1.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIhNNBoJdS2LyTvLnsO8eXNE9KG9G9cIxBMEgr2evSE1g3ewumSEzdi_pLBTnd22uDGYetM-3PI1S-HCPFeoOWtn2uavZ2-x-j9ySiTMIZIxvhyphenhyphenQ7mvQ5zrPKmxXmRE16FwUY8lJthlnVh/s1600/2.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdXE2KiUsI87K6cexthDtdEcp8cqnJMUreIAy_qVGRJ4n6_JzWS126PWfHJcCT-4QcmggfjONE_Leds9aym6ytMypaPao8Rx9l6FVKvguizFSgOZJRYLqJC74k4PFnUb5ufCn-hDzQznLw/s1600/3.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgGFWJOGJgOhL2wBAmDG6_-TeW73lwKeEWR_IkpbbzLZinv9oRUkqijmLHJwfes4LQ6K6Ife4PLxHZJZSxacBXZULrrygh6kKNPZYegU8JpvF_BhPfShT2oI3QTB-fnVJxnlabzXNJ9TjU/s320/blueupdates.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhaInj-0Fg4lvV7Ds6Ccx0ou_tpq8J2OOqBT4N3cAklZPGSFSDLAW2cSM0hqcjILvRKkdrSDPWxEZ65LCm-2obRUiUCyo0mrcMpF7K-Qb1Wmq5AVO4ZoxpFic1uA_35lZa0cZgreIUYBGg/s320/pinkupdates.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjKQwaPkKm1aTbIPJKGF4HxcnUz2XJOCvAZKeFYqejLIYcu7Anm2YPOhaOi8FxT6yEzYrjUmNPNFB3kviL1gmVHdkV7P0U445p8_nIPrDOouN7s-KSB535w9UJWbjdM4QbFFpZYlhG1P1I/s320/purpleupdates.png

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjK8gdhinlPqUl42wMkVAdt-jhcqSov4jZCRYwE5DFwthTXjMO6pvRiyn2TSy6DSlu4a7CA3J1GZvQs0agCqoZRucTeV4kbONfmlSw51tlbznv7Dabgqtg0XFeJ3NXLkFzLiw4Q8D5T8yE/s320/greyupdates.png

-完-