怎么做才好看呢,这确实是个问题,至少新新很头疼(因为没有审美感,
不过,您别担心,告诉您一个简单的方法吧,首先进入模板市场,点“选择模板”,如下图:
![]()
进入模板选择页面,点“图文”区,如图:
![]()
![]()
点击下面的“开始制作”按钮进入‘到在线模板制作区,如图:
![]()
在这里,所有设计都是可见即可得的, 您完全可以充分发挥您的设计灵感,传上您的宝贝,然后用优美的文字描述,努力做到引人入胜最好,哈哈!
设计好了之后,点右上角的“预览/保存”,在弹出的提示框上点“系统临时保存”,如图:
![]()
上传成功后,点“输出,获取设计”,如图:
![]()
淘宝系统会自动打开预览效果图,鼠标点击最下面的“下载图片”按钮,如图:
![]()
不过很遗憾 无语~~,怎么办呢!!嘿嘿~,这可没能难道我,教您一招吧, 按一下 F11 键,放大屏幕,拖动滚动条使图像完全显示在屏幕上,然后按一下你电脑上的Print Scrn按钮( 或 Alt+Print Scrn 键)( 记着,这时候你不能再拷贝任何东西了哦,马上打开photoshop吧,打开了后,按Ctrl+N键在photoshop上新建一张空白的图片,然后按Ctrl+V把刚才Print Scrn的图像粘贴到Photoshop上,
然后调整图像的大小和位置: 首先用裁切工具(快捷键:C)裁切图像,接在您要用放大镜(快捷键Z)放大到实际大小,如图:
![]()
(当然,如果您会用PS,可以继续对图像进行修饰,做的再漂亮一点哦!)
接在这一步很关键,一定要注意看哦: 图片切片 按快捷键K,或用鼠标选择切片工具:
![]()
对图像进行裁切,注意,划分裁切区域的时候一定要根据您的宝贝来进行(注意下面图片上标注的1~6),因为每个裁切区到时候都可以做成商品链接的,点击可以打开宝贝详情页,
![]()
切片编辑完后,需要输出效果模板了,这时候,同时按Ctrl+Alt+Shirt+S键(存储为WEB所用格式),打开保存设置窗口如图:
![]()
注意了:一定要选择JPEG格式,点存储按钮,接在弹出窗口如,选择保存类型为 “HTML 和图像(*.html)” ,
![]()
这样photoshop处理工作就完成了,接着下一步,使用Dreamware工具(没有的话,赶快去网上百度一把吧)
![]() 打开刚才用Photoshop输出的html模板页面,
![]() 注意了:您可不要把images文件夹和html模板文件分开,一定要在同一个目录下,否则会出问题的哦。
![]() 接下来设置模板上宝贝的详情打来链接,请看步骤: 步骤1:用鼠标选择您的宝宝图 步骤2:把该宝贝的详情页面链接地址贴到上图步骤2指示的链接输入框里 步骤3:设置打开宝贝详情页面的目标方式为"_blank" 步骤4:把边框设置成0.
其他宝贝也用上面4个步骤设置吧!
嗯,所有宝贝都设置完了,总算可以了吧~~ 别急, 拷贝您用Photoshop制作的模板images文件夹所在的电脑路径,如:E:\tmp\images,怎么看呢,很简单,您双击进入到images文件夹里头,然后复制地址栏上的路径就行了,如图: 接着还在Dreamware上,点左上角的“代码”:
![]()
在代码编辑视图上,按照下图红线1,选择src="images ,然后按Ctrl+F,执行替换,替换内容格式为: src="file:/// + 地址栏拷贝的地址:E:\tmp\images,如下图红线2,执行替换全部 (注意您不能手工改代码哦,这个很重要)
![]() 地址变成了:
这样,模板设计部分就OK了,全选(Ctrl+A)复制(Ctrl+C)模板代码。
不过,如果要使用没问题的话,还需要把图片传到图片空间,这可要借助淘宝助理了,别急,慢慢跟着我做: 首先打开淘宝助理,新建一个空白模板,宝贝基本资料随便填写,没有错误提示就OK:
![]()
然后吧模板代码粘贴到"HTML原始程序码"里保存:
![]()
保存后点上传宝贝,这时候,选择图片需要存放在的图片空间:
![]()
上传,如果提示失败没关系,我们要的是模板代码,跟宝贝是否上传成功没关系,如下图红线部分所示,图片的地址已经变了。
![]()
接着拷贝处理后的模板代码, 哈哈大功告成了:
好了,模板完全做好了,下一步就可以贴到您的店铺上了。 (哎呀,口干了,您先别急,喝口水先,咕噜~~咕噜~~咕噜~~)
登陆您的淘宝,进入您店铺:
![]()
登陆后在您店铺首页上点“装修此页面”,进入到淘宝店铺装修平台,如图:
![]()
在旺铺后台添加一个自定义内容区(别说您还没有订购旺铺哦,没有的话赶快去定一个吧!):
![]()
接在把刚才添加的“自定义内容区”模块调整到合适的位置,一般拖到最上面,当然您自己觉得好就行,嘿嘿~~:
![]()
然后点下面的:
![]()
(嗯。。
好了,接下来就简单了,点下面的编辑按钮,记得是刚才添加的自定义内容区哦。。
![]()
弹出如下的在线编辑窗口,记得不能直接编辑哦,一定要点
![]()
之后点保存,发布,预览效果吧
![]() |