编辑“OBLOG OBLOG用户模板教程(初级)”
该编辑可以被撤销。 请检查下面的对比以核实您想要撤销的内容,然后发布下面的更改以完成撤销。
最后版本 | 您的文本 | ||
第1行: | 第1行: | ||
OBLOG朋友们,你们好,我们来讲一下用户模板制作方法。此教程是以表格制作模板为例,主要针对初级用户对象,比较简单,高手路过吧: | |||
*'''一、工具''' | *'''一、工具''' | ||
第13行: | 第11行: | ||
*'''二、测试''' | *'''二、测试''' | ||
到[[OBLOG]]官方站下载OBLOG程序,然后再安装[[IIS]],把本地机器架设成一个服务器,这样来预览我们制作后模板效果。 | |||
*'''三、模板准备工作''' | *'''三、模板准备工作''' | ||
新建一个文件夹oblog,在新建一文件index. | 新建一个文件夹oblog,在新建一文件index.html。将文件保存到这个文件夹下。路径是这样:oblog/index.html;在oblog文件夹里建一个文件夹image,这个文件夹是用来放图片和样式表的。也可以不用这样,随个人喜好。 | ||
<div>[[{{ns:image}}:ob593.jpg]]</div> | <div>[[{{ns:image}}:ob593.jpg]]</div> | ||
*'''四、模板分析''' | *'''四、模板分析''' | ||
第26行: | 第24行: | ||
在PHOTOSHOP里把图做好,然后对它进行切割。这个模板是上面一个大BANNER下面是文章主体部位。宽度为778PX在屏幕里居中显示。 | 在PHOTOSHOP里把图做好,然后对它进行切割。这个模板是上面一个大BANNER下面是文章主体部位。宽度为778PX在屏幕里居中显示。 | ||
我们把这里面的图片都切割一下分别取个名字:BANNER. | 我们把这里面的图片都切割一下分别取个名字:BANNER.GIF | ||
<div>[[{{ns:image}}:ob595.jpg]]</div> | <div>[[{{ns:image}}:ob595.jpg]]</div> | ||
NAV.GIF | NAV.GIF | ||
第57行: | 第55行: | ||
三、头部 | 三、头部 | ||
◆在大表格里插入新的表格,在DW下面的属性面板中将BANNER. | ◆在大表格里插入新的表格,在DW下面的属性面板中将BANNER.JPG大图做成背景图,调节表格高度和宽度让背景图片全部显示出来。 | ||
◆在表格里放入博客地址标签:"$show_blogurl$"。如下图: | |||
<div>[[{{ns:image}}:ob602.jpg]]</div> | <div>[[{{ns:image}}:ob602.jpg]]</div> | ||
四、导航栏 | 四、导航栏 | ||
第99行: | 第97行: | ||
2.日志标题定义 | 2.日志标题定义 | ||
新建一个表格,放置日志标题标签:"$show_topictxt$",这里需要定义一下链接样式, | 新建一个表格,放置日志标题标签:"$show_topictxt$",这里需要定义一下链接样式,窗口菜单――CSS样式,右面会出现CSS对话框 | ||
<div>[[{{ns:image}}:ob607.jpg]]</div> | <div>[[{{ns:image}}:ob607.jpg]]</div> | ||
点新建样式按钮,效果如下,按照下图制作 | 点新建样式按钮,效果如下,按照下图制作 | ||
第116行: | 第114行: | ||
新建一个表格,把标签$show_logtext$放进去,具体效果如下: | 新建一个表格,把标签$show_logtext$放进去,具体效果如下: | ||
<div>[[{{ns:image}}:ob612.jpg]]</div> | <div>[[{{ns:image}}:ob612.jpg]]</div> | ||
* | *注意:如果上传大图就会把表格撑开,所以要加上这个代码,效果图如下: | ||
选中表格,加样式 | 选中表格,加样式 | ||
第159行: | 第157行: | ||
[[category: | [[category:OBLOG]] |