CS-Cart是国际化英文外贸网店最优方案!

自己动手网店模板设计

(本文是写给初学者的学习方法类文章,已经是入了门的朋友就请不要浪费宝贵时间。 )

如果你有自己设计Wordpress,Blogspot等经验,那可以说你已经会网店设计了。如果你任何经验都没有,你先要学习一些基础知识。当然,会网店设计不等于能设计的好看,设计是否好看是另外的话题,我们这篇文章只说说如何自己动手设计网店。

需要学习的基础知识:HTML,CSS,Photoshop,Dreamweaver。

前两个是要了解和记忆的语法,后两个是工具的使用。不要被这些语法和工具吓倒,其实最好的学习方法,就是一边学习一边设计网店模板。发现问题,学习问题,解决问题是最快的方法。学习过程是由点到面,由粗到细的,这样的方法不会因为枯燥乏味而提前放弃。我根据Opencart的模板设计,把学习的过程介绍一下。

Opencart软件下载之后,打开目录:/catalog/view/theme/default/,这个Default目录里就是网店的设计。文件夹里还有image,stylesheet,template 3个目录,分别是用来存储设计图片,CSS文件,模板文件。

Step 1. 把Default目录复制一个新目录,另外取一个你喜欢的名字,通常是你的网站域名。例如IECSP目录。在这个目录下是有Default一样的文件夹和文件。

Step 2. 把新目录上传到你的网店服务器空间里(如何在虚拟主机中安装Opencart,请到Opencart网站寻找帮助),新目录要和default目录是同级的,父目录是theme。然后再到Opencart软件的管理中心把模板改成你的新文件夹IECSP。这时候你访问网店页面,是和default设计一样的。

Step 3. 找到stylesheet目录里stylesheet.css文件,使用Notepad++(在sf.net里下载)打开这个文件,你会看到很多CSS语句。看不懂不用怕,我们学习的方法就是做一点,学一点。

Step 4. 我们先尝试把背景色修改成黑色,找到 body { margin: 0px;padding: 0px;text-align: center; } 语句,在后面添加一句: body { margin: 0px;padding: 0px;text-align: center; background:#000000;} ,之后你保存这个文件,再上传到网店主机的相同目录中,覆盖旧文件。

Step 5. 刷新网店网页,你会发现网页背景色已经是黑色的了,虽然很难看,但是这已经是你自己设计的了。

下一步你可以把Logo换一下,再根据这个修改思路,找你想修改颜色,字体的位置,然后再CSS文件中进行修改,如果不会就到Google里搜索CSS语法,反复尝试,你会发现你改的越多,网页越漂亮。当设计和default模板有较大差别的时候,你会充满成就感。

我在这篇文章不是要写基础知识的学习,我只是希望告知初学者一个好的方法。学习一门技能的第一步,我认为并不需要去买一本书照着做,如果你直接动手,一边做一别找资料,更容易产生持久的兴趣。

No related posts.


电子酷作 原创版权内容,转载请注明来自 http://www.ekuzo.com
TAG: ,


发表留言


  • 关于我们
  • 付款方法
  • 优惠活动
  • 联系我们
  • 版权声明
  • 隐私保护
  • 服务条款
  • 网站地图
  • 客户中心