Install Zen coding in DW and modify its shortcut keys

Installing Zen coding in DW is nothing surprising, and it is particularly technical. However, with the current national conditions, it is indeed difficult to achieve it step by step.

Of course, we recommend this article before you start.Article.

Http://www.qianduan.net/zen-coding-for-dreamweaver-plug-in-tutorial.html

Some people may wonder why you need to record such a detailed introduction, because there is no necessary communication between the production tool and the producer, which will cause a great waste of productivity.

After using Aptana for two weeks, I finally found that the production speed was indeed not as fast as DW. However, my brother was obsessed with Aptana's failed operations for a long time, so he finally returned to DW due to the pressure of production efficiency.

Download and install DW firstProgramMore online than Ox Hair.

Recommendation 1:

DW cs4 Simplified Chinese full version

Http://adobecs4.com.cn/download/dreamweaver.htm

The full version must be installed, because the green version does not have any extension installation, even if you download the extension from the Adobe manager is a lot of problems.

 

Win7 license expiration solution: http://bang.pcw.com.cn/question/216376

After installation, install the Zen coding extension package and double-click the file.

After the modification, the shortcut key will not be mentioned again. The article described here is clearer.

Next, many of the default quick replacements for Zen coding are considered for various reasons, but I feel that it is unreasonable in production. For example, F: l can be directly modified to FL, W and other attributes, and the addition of PX units behind them seems to improve production. (This is of course inspired by the quick configuration of blue handsome brother n ++ quicktext), and later changed to WW to replace width: 100%. For details, refer to the modified Zen coding. js file.

Modify the file table.

  position: absolute; 
 PPA 
 position: relative; 
 PPR 
 Z-index: 999; 
 Z9 
 float: none; 
 FN 
 float: Left; 
 FL 
 float: right; 
 fr 
 clear: Left; 
 Cl 
 clear: Right; 
 Cr 
 clear: both; 
 CB 
 display: none; 
 dn 
 display: block; 
 dB 
 display: inline; 
 Di 
 added 
 display: inline-block; 
 Dib 
 overflow: hidden; 
 oh 
 margin: 0 auto; 
 MA 
 margin: auto; 
 M: A 
 W 
 width: | Px; 
 WW 
 width: | 100%; 
 H 
 Height: | Px; 
 hh 
 Height: | 100%; 
 B 
 border: 1px solid # CCC; 
 B3 
 border: 1px solid #333; 
 B6 
 border: 1px solid #666; 
 B9 
 border: 1px solid #999; 
 C 
 color: #000; 
 cf 
 color: # FFF; 
 TL 
 text-align: Left; 
 tc 
 text-align: center; 
 tr 
 text-align: right; 
 ti2 
 text-indent: 2em; 
 FZ 
 font-size: 12px; 
 // html 
 st 
  
 S 
  
 

Because the package file installed by mxp cannot be modified in real time as in Aptana for Zen coding files, how uncomfortable it is for young people with healthy brains and hot blood. In addition, because it is a program edge person, the mxp production process is too lazy to clear, so find a second-stream method to replace the Zen coding setting file to modify the default shortcut key.

Find the Directory and overwrite the corresponding Zen coding. js file.

The following two directories are hidden by default in the system. Before modification, you must first select the "show system files" option in the folder options.

The XP directory is:

C: \ Documents and Settings \ zyh \ Application Data \ Adobe \ Dreamweaver cs4 \ en_us \ Configuration \ commands \ zencoding

The win7 directory is:

 

C: \ Users \ Administrator \ appdata \ roaming \ Adobe \ Dreamweaver cs4 \ zh_cn \ Configuration \ commands \ zencoding The replaced file is zen_settings.js (this file has been modified. Most of the commonly used CSS and HTML are different from the original one. Please refer to it for production .) Zen_setting is the core file replaced by Zen coding. For shortcut key settings, see its file.