你的位置:东莞市麦客网络科技有限公司 > 产品服务 > 淘宝模板制作 网店装修代码制作 PS切片工具使用
淘宝模板制作 网店装修代码制作 PS切片工具使用
发布日期:2022-08-17 18:14    点击次数:143

                首先说说我对各种软件的一些事情..之前写了几篇关于软件的教程,非常多的朋友都来一起探讨,我感到非常开心..他们问我"你是不是专业的?" "你是不是什么毕业的?"  "你的软件技术怎么这么好?" 其实,我可以告诉大家,我是在开店之后才去学习这款软件的...当时觉得店铺非常不好看,别说顾客了.来我自己到自己的店铺也没有想呆一下的感觉...我就对自己说...非要把店铺装修漂亮不可...然后,自己下载了PS和MD...针对性的学习...不如说那里不会,到经验居去找下帖子,没的话去百度找找,只要你肯去学,做过一次.你以后都会..慢慢积累下来,仿佛就是软件操作高手了

 

下面我介绍下我们所用的软件

 

图片

Adobe Photoshop CS4    这个也就是我们常说的PS软件,是一款比较好的图像处理软件,它的功能非常多,划分为图像编辑、图像合成、校色调色及特效制作部分。 不怕你不会,就怕你不学,没人会一步登天的...专家也是慢慢变成的

图片

 Macromedia Dremweaver MX2004   这个是一款网页制作和管理网站于一身的所见即所得网页编辑器,它的优点在于最佳的制作效率,网站管理和无可比拟的控制能力。我们并不是专业,也不喜欢做到专业一样。我们只要利用它就行了

 好,我们来看看如何运动这两款软件

首先是打开你要获取代码的图片,选择切片工具,是要把图片切分开来,这样可以把想填加链接的图片做到,每个切片大小可以不一样

 

图片

 

第二步,在图片的左上方开始,点击左键拖拉,会出现一个虚线框

图片

然后放开左键后,软件会自动设置,左上角的数字代表这个切片的序号

   

图片

然后继续切片,第二切片要于第一个切片贴边,要不然会样切片1变小或切片不完整

图片

  然后按自己的要求来划分,注意一定要把整个图片划分起来, zooskool即使是没有用的 

PS:你切分多少等下会得到相对应的图片,所以你要把你想添加链接的那部分要分开来

 

 

图片

 

然后切分后,我们就保存为web和设置所用格式,马上就结束PS的工作

 

 

图片

 

点击保存

 

 

图片

记住要保存为图象和html类型

图片

好的,保存之后,PS可以关闭了。下面我们运用Dreamweaver

刚得到两个文件,把images上传到图片空间,html的文件就用Dreamweaver来制作

   

图片

注意,刚刚因为我们切片的时候是分了4份,所以得到的图片也就是4个

 

 

 

好的,我们打开Dreamweaver,

Dreamweaver是网页制作和管理网站于一身的所见即所得网页编辑器,它是第一套针对专业网页设计师特别发展的视觉化网页开发工具,利用它可以轻而易举地制作出跨越平台限制和跨越浏览器限制的充满动感的网页。

 

 

我用的版本是MX 2004,比较旧了,呵呵.好的我们会看到这样的一个模版

 

 

图片

我先在简单介绍一下Dreamweaver....Dreamweaver一般打开页面后的界面包括:菜单栏、面板组、工具栏、代码编辑区、属性和面板组。

 

  

图片

  

我们要运用好这软件,产品服务就必须了解一些基本。连基本都不会,是很难操作起来的,首先是菜单栏一共分文件,编辑,查看,插入,修改,文本,命令,站点,窗口和帮助。我们也不需要对每个都深入研究。

 

 

图片

  

文件菜单:就是包括对文件的各种操作,例如新建,保存等。

编辑菜单:对文件的一些指令,例如是拷贝,粘贴和替换等。

查看彩单:使用查看菜单可以查看文档的相关内容。

接下来就认识一下快捷键

Ctrl-B或Ctrl-I来为文字应用黑体或斜体格式,

选中的文本应用HTML格式:

Ctrl-0: 无格式   

Ctrl-T: 段落   

Ctrl-1: 标题 1  

Ctrl-2: 标题 2

 

 

然后我们认识一下属性板,因为等下需要用到,属性版上可以对选种的对象来进行修改,比如说地址,链接,格式,字体等。还有一点,属性板是根据当前对象来设置的,你选择的对象不同,它的显示出来的属性调整就会不同

  

图片

 好了,我们可以开始去做了。。缩小一下窗口,直接把HTML文件拖进去可以了,   

图片

 

好的,现在我们看到这样的画面,上方是我们等下需要的代码,中间就是我们的图片,下面是属性设置

 

图片

 

然后我们按照切片的位置来修改,把图片的地址改成上传之后的图片地址,链接是超链接的地址,填加对应的地址点击图片会打开,当然没有需要的部分也不用填加

 

图片

  

图片地址改了后。会变成这样,是正常的,然后我们继续去改换其他

 

图片

 

图片地址改完后,链接也填加了,下面马上完工,拷贝代码

 

图片

到我是卖家版面,选择装修店铺

 

图片

  

到自定义版块,点击编辑HTML,

图片

  

把刚拷贝的代码复制下去,然后保存

 

图片

  

这样,我们的图片就完成了,若有填加链接的图片,点击是可以打开的

图片