sublime安装教程!

用户头像
上海/网页设计师/8年前/676浏览
sublime安装教程!
用户头像
大话阁

电商设计师,需要会一点基础的代码,而sublime,是用代码的一件利器!

       前言:虽然就电商流量而言PC端的流量基本没有,依靠代码作一些炫酷的特效,作用也不是太大!但是作为一名伪装“有理想、有追求”电商设计师,不懂代码,怎么能完成晋(更)级(流)高(畅)阶(的)设(装)计(B)师的梦想呢?所以基本的装修代码还是要会一点滴。这里推荐下这款广受编程开发者最爱的代码软件:sublime!

       有小伙伴会问:DW不也是代码软件吗?为什么还要用sublime?这里打一个不太恰当的比方吧:DW就像一个远洋巨轮,而sublime就像一个摩托游艇,虽然功能没有DW那样强(臃)大(肿),但是更轻便,更灵活,是一个有高亮提示符的文本编辑器。通过预置一些电商常用的代码片段,可以大大的提升工作效率。

       不多BB,下面咱直接介绍安装流程:

1.官网下载软件:http://www.sublimetext.com/3

       可以看到支持mac、windows、Linux三系统。

2.下载完毕,点击安装

       这是安装完毕后的界面

3.安装软件的包管理工具:Package Control(这个是必须安装的插件,用于方便安装和管理其他插件)

       步骤一:ctrl + ~ 打开控制台

       步骤二:复制下面的一段代码,放在软件中,回车,执行即可:

import urllib.request,os; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); open(os.path.join(ipp, pf), 'wb').write(urllib.request.urlopen( 'http://sublime.wbond.net/' + pf.replace(' ','%20')).read())

       安装成功后点击Preferences,即可看到Package Control

4.汉化软件

 (1)打开包管理工具(快捷键ctrl+shift+p)

 (2)输入install package,点击Package Control:install package 回车

 (3)安装中文翻译插件,输入 chinese,随便找一个,点击确定

       汉化完成!

5.推荐安装三个插件

       Emmet    (提高HTML和CSS代码编写的速度)

       HTML-CSS-JS Prettify    (格式化代码插件)

       SideBarEnhancements    (自定义浏览器与快捷键的工具包)

安装方法同上,

    (1)打开包管理工具

    (2)输入install package,

    (3)点击Package Control:install package 回车,分别输入三个插件的名字,逐个安装)

        安装过程中这个 “=”符号像一颗海草海草,随波飘摇,左右晃动,安装完成就无声无息消失了。

       注:sublime还有很多功能强大的插件,此处不一一赘述,安装方法也是同理。

6.给软件设置关联浏览器,以方便观看网页效果

       这个步骤相对简单:首选项——Package Settings--Side bar--Key Bindings-User

       以火狐浏览器为例, 打开后在那个页面输入如下代码:

[

// Firefox

   {

       "keys": ["f12"],

       "command": "side_bar_files_open_with",

       "args": {

           "paths": [],

           "application": "D:/Program Files (x86)/Mozilla Firefox/firefox.exe",

           "extensions": ".*"

       }

   },

]

保存,ok(此处是火狐浏览器,别的浏览器也是如此,改变浏览器安装路径即可,另外要注意安装路径的斜杠写法是"/")

7.最后献上电商设计常用的代码片段

       装代码片段的方法:

(1)点击菜单--首选项--浏览插件目录,后 会弹出一个文件夹(后缀大概为:Roaming\Sublime Text 3\Packages)

(2)将下载好的代码片段文件夹拖到这个之前弹出的文件夹中

       个人电脑的软件文件夹截图

(3)安装完电商代码片段,点击工具-代码片段,就可以愉快的使用各种电商代码片段了(代码片段还可以自己编写哦)

      代码片段已经放在附件中,可以下载!      

      注:sublime可以无限期免费试用,但会定期弹出提示,建议买正版!如果腰包紧,那科学使用,具体方法,自己想...

      最后感谢代码片段的提供者:@banner

      学习之路无止境,小伙伴们,我们一起加油努力吧!    

2
阅读原文
|
举报
|
2
分享
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
新年快乐送福网页矢量图banner
浏览电脑网页的元素
三个青年正在装修网页矢量插画
卡通风格网页页面3D渲染
卡通风格网页页面3D渲染
三个青年站在网页周边矢量插画
网页电商背景矢量插画
男生坐在网页面前办公矢量插画
男生和女生站在网页面前矢量扁平插画
网页设计——纸杯蛋糕
女生坐在网页面前办公矢量插画
三位美女围着网页看信息矢量插画
卡通风格网页页面3D渲染
一个男生和两个女生站在网页前面打招呼矢量
商务网页
 网页背景
3D风格时尚电子商务设计元素
四个人物分别在上网贴纸合集
网页背景
户外旅行飞机情侣假日出行
卡通风格网页页面3D渲染
B19【星空诗意&网页幽灵按钮】公司产品服务简介汇报
网页页面矢量插画
卡通女孩与网页表格3D渲染
卡通风格网页页面3D渲染
你可能喜欢
大家都在看
登录注册