巧用PS制作淘宝通栏店招--店招导航栏制作(二)

 时间:2024-10-13 22:32:34

1、在店招通栏背景中我们截取一张1920*30的矩形图片,并填充我们自己想要的颜色。为了达到立体效果,我用渐变填充的颜色。

巧用PS制作淘宝通栏店招--店招导航栏制作(二)

2、在制作出的导航条中编写我们需要编写的导航菜单。请注意,因页头背景不能自适应页面,所以要将导航条略靠内一点,以免笔记本电脑展示不全。

巧用PS制作淘宝通栏店招--店招导航栏制作(二)

3、选择切片工具,切出图片。将制作好的全图存储为html格式。即“文件-存储为web所用格式-存储”,然后将格式类型存储为html格式(如不清楚,详细做法请参考《如何将图片存储为html格式》)。

巧用PS制作淘宝通栏店招--店招导航栏制作(二)
巧用PS制作淘宝通栏店招--店招导航栏制作(二)

4、把每一个导航块切下来,保存并上传淘宝空间备用。

巧用PS制作淘宝通栏店招--店招导航栏制作(二)

5、在切好的图片上点击右键,在弹出的界面中选择“编辑切片选项”。

巧用PS制作淘宝通栏店招--店招导航栏制作(二)

6、在新弹出的界面中即可直接输入图片地址和链接目标,然后保存。

巧用PS制作淘宝通栏店招--店招导航栏制作(二)

7、在dreamweaver中打开我们前面保存的html文件,拷贝代码,返回店铺装修,删除默认导航模板-新建自定义模板-拷入代码-保存-发布,即可成功!

巧用PS制作淘宝通栏店招--店招导航栏制作(二)

8、也可以使用dreamweaver编辑的方式,进行链接和目标位置的添加,上传代码的方式与上述部分完全相同。

巧用PS制作淘宝通栏店招--店招导航栏制作(二)

9、如果想更多地了解图片存储为html文件的方法,以及在淘宝首页实现自动跳转的话,请继续关注《如何将图片存储为html格式》和《淘宝等网页轻松实现跳转的方法》。

巧用PS制作淘宝通栏店招--店招导航栏制作(二)
  • PS怎么设计制作淘宝店铺全屏店招导航的详细步骤
  • 怎样用用PS制作自己的店招加导航
  • ps笔刷圆圈不见了怎么办?
  • 在ps cc中给图片添加点状化滤镜的方法
  • ps如何创建矢量蒙版?
  • 热门搜索
    劳动手抄报简单一等奖 欢庆六一手抄报图片 节能环保手抄报 万圣节手抄报 书法手抄报 厉行节约反对浪费手抄报内容 手抄报网 小学生环保手抄报 小学二年级手抄报 元旦手抄报图片