书城管理网店捞钱的100个精细化绝招
19385600000011

第11章 人气网店少不了精心的装修(2)

1、登录 QQ 的空间,下载所需要的公告栏模板素材。没有开通 QQ 空间的朋友请首先开通。

(1)、开通后登录到自己的 QQ 空间;

(2)、点击装扮空间或者立即装扮 QQ 空间跳转装饰 QQ 空间的素材页面;

(3)、选择自己需要的 QQ 皮肤素材:用鼠标指向需要的 QQ 空间皮肤,单击鼠标右键;

(4)、点击属性,在出现的对话框中选中地址复制下来;

(5)、把复制下来的地址中的“pre”改成“orig”,例如:把

“http://imgcache.qq.com/qzone/space_item/pre/3/8371.gif”修改成

“http://imgcache.qq.com/qzone/space_item/orig/3/8371.gif” 修改后刷新网页,得到自己

需要的 QQ 空间皮肤。

(6)、单击右键图片另存为到本地电脑中。

2、启动 Adobe imageready,使用 Adobe imageready 打开下载的 QQ 空间皮肤。

打开后的 QQ 空间的皮肤一般都有是两帧的 gif 动画,所谓的动态公告栏就是利用帧的不断变化而产生的效果。

3、调整 gif 动画图片的大小,宽度小于 400 像素。由于下载下来 gif 文件的

宽度不符合淘宝网公告栏 400 像素的宽度,所以需要对素材图像的宽度进行调整。

4、点击帧输入需要公告的文字。有两个帧,这里可以根据情况决定在两个帧里输入相同的文字还是不同的文字,如果输入不同的文字,那么帧与帧之间的间隔时间要设置长一点。

5、保存制作好的动态公告栏。点击预览没有问题后保存。

6、上传到网络相册空间。

7、登录淘宝网店的店铺基本设置安装公告栏。

怎样制作精美的网店分类导航

店铺中的分类导航即店铺类目,不论是在普通店铺中还是在旺铺中,均是在店铺左侧显示的,作用是显示商品的分类。

对一家店铺而言,所售商品分类是否合理是十分重要的。分类导航可运用简单的文字展现,也可使用独具特色的图片来展现,从而让店铺更加吸引人。若使用文字分类, 则导航的大小与颜色都是不能变的。如果店主想让自己店铺的分类导航显得与众不同,则可将各项分类导航制作成图片。对图片的高度没有严格的要求,只需合适就行,但图片的宽度最好不超过180像素。

如果买家进入店铺后,点击相应的分类却提示"没有相应宝贝",不仅会让买家失望,而且会让买家觉得店主没有用心经营,这样买家对店主的印象就会降低。因此,店主应及时为自己的商品进行分类。给商品分类能够提高店铺的形象,也能够提高交易率。给商品分类能给买家带来许多方便,服务于买家,其实最终是为店家自己服务。接下来小江就以在淘宝网上的店铺为例,告诉新手们制作商品分类的技巧。

1、制作商品分类导航。

商品分类导航可分成文字分类与图片分类两种。文字分类:进入"我的淘宝"―"我是卖家"―"店铺管理"―"店铺装修"―"店铺类目"—进行宝贝类目的分类。

2、对宝贝进行分类。

对商品进行基本分类的步骤是:进入"我的淘宝"―"我是卖家"―"店铺管理"―"店铺装修"―"店铺类目"―"宝贝分类"―"未分类宝贝"—进行放置。为方便买家购买,店主应及时为你的商品分类。

3、调整分类顺序。

调整分类顺序的步骤是:进入"我的淘宝"-"我是卖家" ―"店铺管理"―"店铺装修"―"店铺类目"―"宝贝分类"―对相应类目排序号进行修改并按后面的"修改"键保存。

4、关于一级分类与二级分类。目前一些网站如淘宝网只支持一级分类,但可以利用空间错位法来达到级别分类的效果,这样能给买家在视觉上做出一级与二级分类。

5、制作相同名称的二级分类(技巧)。如卖包的店,可以将斜挎包为一个一级分类,单肩包为一级分类,但在各个分类下均有相同的风格,即均含有比如淑女风格与手绘风格两种,要怎样设定。

相同名称的分类是不能出现在淘宝中不可以编辑有相同名称的分类,如果店主已经设置好一个淑女风格后,再设置一个淑女风格时,淘宝会提示已有该分类不可以继续分类。这个时候,店主可将原来的淑女风格做一个小改动,如在它们之间加一个空格,之后再添加一个淑女风格的分类,随后按保存。这个时候系统认为原先的淑女风格已改动,因而新分类才操作成功。此时,在原先的淑女风格后面不要按"修改"键,以防原先的淑女风格跳回到没有保存的状态。这样最后就成功编辑了两个一样的淑女风格。

6、为什么将宝贝分类图片放了后,店铺宝贝主区域下沉?这是由于店主设置的商品分类图片超大了,图片大小控制在宽100像素以内,主区域便不会往下沉了。

7、宝贝分类数量是否有限制?目前还没有限制。但做一个有效的分类,是不需要太多类目的,否则就没有什么意义了。

店主若想让自己的分类导航给进入店铺浏览的买家们留下一个深刻的印象,就需要自己动手进行设计了。

分类导航一般包括欢迎图片与商品分类图片两种。可在欢迎图片上加入联系方式、营业时间等内容信息。接下去对怎样制作一套分类导航的欢迎图片与商品分类图片做一个介绍,重点介绍怎样修改、调整已有的素材图片,让其符合分类图片的制作要求。

1、制作分类导航模板

在photoshop软件中制作分类导航模板的具体操作步骤如下:

(1)一般来说,网上搜集到的图片很难与所要求的图片尺寸完全相同,因此要调整搜集到的图片尺寸。打开photoshop软件,选择菜单"文件"―"打开"命令,打开已搜集的两幅素材图片。可以看到两幅图片的样式非常接近要制作的欢迎图片和商品分类图片,但它们的尺寸并不合适,因此要对图片进行修改。

(2)开始制作欢迎图片,素材图片的尺寸是200像素×200像素,要把它的宽度修改为160像素。选择菜单"文件"-"新建"命令,打开"新建"对话框。设置"宽度"为160像素,"高度"为200像素,"分辨率"为72像素/英寸。单击"确定"按钮,在photoshop软件编辑窗口中新建一个空白图片文件。

(3)切换到素材图片,选择菜单"选择"-"全部"命令,然后选择菜单"编辑"-"拷贝"命令复制图像。单击新建的空白图片,选择"粘贴"命令将图片粘贴过来。

(4)在工具栏中单击"移动工具"按钮,水平移动图层至右侧。在工具栏中单击"缩放工具"按钮将图片放大,接下来调整图片大小。在工具栏中选择"矩形选框工具"按钮,在图层右侧从顶部到底部拖出一个矩形区域。

(在应用移动工具水平移动图层时,图层会自动和边框对齐,就像被吸附住一样,这一功能有利于准确的调整、定位图层位置。)

(5)因为原来素材较宽,要将其变窄,所以单击"移动工具"按钮,向左水平拖动选择的区域。选择菜单"选择"-"取消选择"命令取消区域选择。使用移动工具将图层移动到中间位置。此时如果宽度没有调整到位,可以重复上面的步骤,直到调整为合适的边框。

(6)选择菜单"文件"-"保存"命令,弹出"存储为"对话框,将图片保存为"欢迎.psd"。

(7)新建一个尺寸为155像素×72像素的空白文件,将另一幅素材图片用同样的方法粘贴到新建的空白文件中。将图片放大到300%,并移动到右对齐的位置。使用"矩形选框工具"按钮选择矩形区域。

(8)在工具栏中单击"移动工具"按钮,然后按下alt键的同时拖动图片上的矩形选区,即可在同一图层中对选择区进行移动,如果图片上有文字可将其覆盖。

(9)按照以上的方法能够将图片的宽度变大。

(10)图片的高度可以按照统一的方法进行处理,但要注意与右侧的花朵图标的链接。图片宽度和高度调整完成后,将图片保存为“按钮2.psd”。

2、为分类导航添加文字

店主可按照自身需要来制作商品分类图片上的文字。可在欢迎图片上标注联系方式、工作时间和店铺名称等内容,在商品分类图片上则可标注不同商品的名称。在欢迎图片与商品分类图片上制作文字的具体操作步骤如下:

(1)打开"欢迎.psd"图片,在工具栏中单击"横排文字工具"按钮'输入店铺名称"随心设计"。

(2)双击选中文字,在"选项"面板中将字体设置为"方正准圆简体",设置字体大小为18点",设置消除锯齿的方法为"平滑",设置文本颜色为"水红色"(#f462b8)。

(3)选择菜单"图层',―"图层样式"-"描边,命令,打开"图层样式"对话框。在左侧"样式"列表中选择"描边"选项,在右侧的"大小"文本框中输入1像素。单击填充类型的"颜色"按钮,选择填充颜色为"蓝色"(#0505fb)。

(4)单击"确定'按钮后,为文字增加了蓝色的描边。

(5)在店铺名称下输入工作时间与联系方式,而文字样式则延续了前面的设置。

(6)接着修改刚才输入的字体样式与颜色。双击选中榆入的文字,在"选项"设置字体为"汉仪凌波体简",字体大小为14点",单击填充类型"颜色"按钮,选择填充颜色为"梅红色"(#^d707a8)单击"确定按钮。

(7)设置行距为18点,设置消除锯齿的方法为"平滑",然后将文字移动到图片中间位置,并为文字加上1像素灰色的描边效果。

(8)根据前面的方法,给商品分类图片添加文字。打开商品分类图片"按钮.psd",设置字体为"汉仪方隶简",字体大小为18点,设置消除锯齿的方法为"平滑",设置文本颜色为"粉色"(#e6a9f3),然后输入商品分类名称,如"普通店铺装修",并设置位置为2像素的白色描边。

3、制作分类导航动画

给店铺设置分类导航是为了让买家能清晰地了解店铺中的各类商品,因此制作鲜明的分类名称是十分重要的。而突出效果的最好方法便是使用动画方式。下面介绍使用之前制作好的欢迎图片与商品分类图片制作动画效果,具体操作步骤如下:

(1)打开photoshop软件,打开两幅图片“欢迎.psd”和"按钮.psd"。先单击"欢迎.psd’文件,由于图片中没有特殊的图案,可复制一些心形图案以便制作动画效果。

(2)合并心形图案的几个图层,在"图层"面板中单击"图层2,,将其选中。单击工具栏中的"魔棒工具"按钮,在打开的"选项"面板中设置容差为2,并取消"消除锯齿"、"连续"和"对所有图层取样"多选框。在心形图案的中间位置单击,就能够选中所有颜色相同的区域。

(3)在"图层"面板中单击"创建新图层"按钮,然后选择菜单"编辑"-"填充"命令,打开"填充"对话框,在"使用"下拉菜单中选择"白色"选项。单击"确定"按钮后,图层中被选中区域填充为"白色"(#ffffff),在图层右上角设置不透明度为50%。

(4)在"图层"面板中单击背景图层前面的"眼睛"图标,将其隐藏。选择菜单"窗口" ―"动画,'命令,打开"动画"面板,单击"复制当前帧"按钮。

(5)在“动画”面板中单击第1帧,在"图层"面板中将图层3设置为隐藏,在"动画" 面板中单击第2帧,在"图层"面板中将图层3设置为显示。然后,按住81116键选中第1帧和第2帧,单击"动画"面板'0秒",在打开的菜单中选择延迟时间“0.5 秒"。

(6)单击"动画"面板中的"播放/停止动画"按钮,就可以查看动画显示效果。选择菜单"文件"―"存储为Web和设备所用格式"命令,弹出"Web和设备所用格式" 对话框,在"品质"下拉列表中选择"两次立方"。

(7)单击"存储"按鈕,弹出"将优化结果存储为"对话框,在对话框中设置文件名为“huanying.gif”。单击"保存"按钮完成gif动画的保存。

商品分类按钮动画的制作方法,与欢迎图片的制作方法类似,需要把分类文字设置为闪动。其具体操作步骤如下:

(1)选择“按钮.psd”图片,在"图层"面板中隐藏背景图层。

(2)选中文字图层,把它拖动到"创建新图层"按钮处,就可以复制一个相同的文字图层。

(3)双击新复制图层右側的图层效果标志,打开"图层样式"对话框,在"描边"设置中把填充颜色调整为"蓝紫色"〈#4840f3〉。

(4)单击"确定"按钮,刚复制的图层中文字描边颜色从白色变成了蓝紫色。在"动画,'面板中单击"复制当前帧"按钮,选中第1帧时,设置显示原来的文字图层,隐藏复制的文字图层;选中第2帧时,设置显示复制的文字图层,隐藏原来的文字图层,

(5)单击"动画"面板上的'0秒",将两个帧的延迟时间都选择为1.2,,秒。