加好友 发纸条
写留言 加关注
打竹板,响叮当, 新浪博客不一般。 推出了全新育儿博客实在妙, 亲们用了都夸好。
要说那宝宝成长进度条, 用着方便确实想得很周到。 只不过成长条的模板有点儿少, 咱还得把新意思多搞搞。
新意思,怎么搞? 您问乐乐那是问着了。 看乐乐偶再来支一招, 您看看它是高呀还是不高。
今儿接到新浪的通知: 新浪为育儿博主推出了全新的育儿博客,新功能包括:四套育儿模板、宝宝资料组件、育儿要闻组件、实用工具组件、育儿话题和插入宝宝成长进度条。
乐乐偶心中甚是欢喜,赶紧试用一下,发现还是很不错的。
尤其是这宝宝成长进度条,以往亲们都是要去别的育儿类网站注册、建立成长条,然后再复制到博客里来用。如今,新浪有了自己的宝宝成长条,就更加方便啦。可以在发布每一篇博文的时候,都插入一个,一目了然哈。
不过乐乐偶觉得成长条只有四套模板,少了点儿选择。而且不能像其他网站那样能上传一张宝宝的头像。而且乐乐偶还有更大胆的想法:成长条能不能最大程度地个性化呢?
答案是:Yes!且听乐乐偶慢慢道来。
第一步
进入发博文页面,点击编辑框右侧“常用功能>宝宝生日”,会弹出小窗口,显示4个成长条模板,选择一个(以第4个为例),点击“插入成长进度条”后,您会发现成长条已经在编辑框中显示出来了。
http://s4/middle/63f73fa8t74c3e28b3593&690
http://s11/middle/63f73fa8t74c3e26fa07a&690
勾选编辑框底部左侧的“显示源代码”,您能看到编辑框里显示出了一段代码,如下: <IMG height=87 src=http://simg.sinajs.cn/blog7style/images/common/baby/banner4.png width=502 type="face"
imgType="yuer" yuermsg="listCfg=textType=type4;name=乐乐_檬小
帅;y=0;m=8;d=0;bgURL=http://simg.sinajs.cn/blog7style/images/bring/baby_flashResource/babyBar/bg4.png;cursor
URL=http://simg.sinajs.cn/blog7style/images/bring/baby_flashResource/babyBar/cursor4.png;cursorX=152;cursorY=
58;dltX=30;tX=155;tY=18;tOffsetY=-6;font=幼圆;color=0xCD00AB;size=16;"> <P> </P>
http://s7/middle/63f73fa8t74c3e272aee6&690
看着好像是天书似的哈,没关系,咱们找到里面有用的信息就行。代码里有三个png图片地址,分别是:
第一个:http://simg.sinajs.cn/blog7style/images/common/baby/banner4.png 就在第一行。您在新窗口里打开这个图片地址,可以看倒上面带有“宝宝昵称已经2岁2月28天了”的字样。这只是模板的示意图。
http://s14/middle/63f73fa8t74c3e278ca2d&690
第二个:http://simg.sinajs.cn/blog7style/images/bring/baby_flashResource/babyBar/bg4.png 宝宝昵称后面那个就是。这个图片是成长条的背景图,您在新窗口里打开这个图片地址,就可以看出来不带任何文字的背景图。
http://s11/middle/63f73fa8t74c3e2744b5a&690
第三个:http://simg.sinajs.cn/blog7style/images/bring/baby_flashResource/babyBar/cursor4.png 这个是一个小图标,您也可以在新窗口里打开查看。它是随着月份进度而移动滴,有点像时针。
http://s8/middle/63f73fa8t74c3e275c4e7&690
其中第一、三个png图,咱们都可以不管它。偶们的重点是第二个png图,就是成长条的背景图。
在新窗口打开第二个png图后,点击鼠标右键“图片另存为”会发现无法保存到本机。别急,您可以用迅雷来下载。
第二步
然后我们在photoshop里打开这个png图片,就可以按照自己的想法进行个性化的设计了。
打开后如下图所示:
http://s13/middle/63f73fa8t74c3e27ee9bc&690
由于月份刻度的图标是会动滴,所以偶们在修改这个背景图模板的时候,需要保留月份刻度。其他的则可以保留,额外增加需要的东西,比如宝宝的头像、文字等等;也可以不保留,重新设计。
不管怎样,记住图片尺寸不用去修改。
下面这个就是偶的新设计的成长条,保留了原来的底色块和月份刻度,将左边原来的图案变成了偶的头像,还加了一个戴墨镜的柠檬。
http://s9/middle/63f73fa8t74c3e2850ea8&690
在photoshop里设计完了后,选择“文件>存储为Web所用格式”,保存为png24格式,文件名可以不改。
第三步
接下来,咱们在发布博文的编辑框里上传这个png图片,待图片插入显示后,点击编辑框底部左侧的“查看源代码”,找到这张图片的地址: <A href="http://s11/orignal/63f73fa8t8fa6c148d44a" target=_blank><IMG
src="http://s11/middle/63f73fa8t8fa6c148d44a&690"></A><BR><BR>
就是第一行的:http://s11/orignal/63f73fa8t8fa6c148d44a 复制这个地址,然后编辑框里的这张图片就可以删掉了,不用保存。
http://s12/middle/63f73fa8t74c3e280733b&690
偶不知道新浪会不会永久保存这张上传了但是没有在博文里发布的图片,如果亲不放心,可以在相册里上传这张背景图,保存在相册里,然后获取图片的地址。
最后,我们只要在“源代码”里用这个图片地址去替换成长条原来的那第二个png背景图的地址就ok了。
发布这篇博文,您看,最终的效果就出来啦!
http://s8/middle/63f73fa8t74c3e2820b07&690
大功告成咯!亲,您会了吗?
如果您以后发别的博文还要用,就可以从这篇博文的源代码里复制这段粘贴过去就可以啦。
本文开头的成长条是另一个设计。
友情提醒:
新浪的宝宝成长进度条不是一劳永逸的,您不能做一个放在置顶的博文里,因为它的日子不能自己更新。只有在当天博文里添加后,根据当天的日期生成。所以如果换了个性背景图,就要每次替换一下背景图的地址。
—————————————————————————————————————————————————
感谢管理员豆芽妈推荐本文到育儿博客:
http://s6/middle/63f73fa8t8fb70317af15&690
喜欢
0
赠金笔