Tapatalk

Zen Coding - writing HTML code using CSS like selector syntax

Zen Coding - writing HTML code using CSS like selector syntax

2
NewbieNewbie
2

    Nov 23, 2009#1

    This is an adaptation of the script discussed at
    http://www.smashingmagazine.com/2009/11 ... html-code/
    to work on UltraEdit Javascript engine.

    This is a text expander that turns this css string

    Code: Select all

    div#content>h1+p
    into the correspondent html

    Code: Select all

    <div id="content">
<h1></h1>
<p></p>
</div>
    The script will select the current line and try to expand it.

    Save the source code as a .js file and use it in your scripting/scripts UltraEdit menu.

    hth! =)

    Download the script file ZenHTMLUltraEdit.js and save it for example in the subdirectory scripts in the UltraEdit/UEStudio program directory or wherever you want. Open Scripting - Scripts, add this script file and assign a hotkey or chord for fast calling the script. Now you can code a line as the example demonstrates and hit the hotkey or the key sequence to execute the script for converting the line according to the code into HTML.
    1
    NewbieNewbie
    1

      Nov 23, 2009#2

      Great work, echopark!

      If you don't mind, i would like to add you to the project committers list on Zen Coding project, so you will be able to upload your plugin and create Wiki-pages with installation instructions.

      So, if you interested, just email me: [email protected]
      4

        Jan 11, 2010#3

        echopark

        I really appreciate U adapting Zen Coding (ZC) for UE.

        I was wondering if U had tried it with CSS snippets which ZC has ...e.g.

        bdcl:c ... hot key inserts border-collapse:collapse;

        I changed function getEditorType (around line 1290) to return 'css' & tried some css snippets and it seems to work fine as long as the abbr snippet doesn't have a ':' like the example above ... here the entry point isn't correct and a pattern of deleting line 1 , col 1 char, but bdcl hot key ... abbr snippet without : ...doesn't suffer from same problem.

        Wondered if U had tried it or had plans to w/ css... regardless if you do or don't a much appreciated contribution.

        Update... altered how the replacement text was inserted and now it handles css abbr with/without the colon : whereas before the colon was a problem. Still the heavy lifting was down by Echopark.

        UE 15.20
        Doug
        UE 16.1
        1
        NewbieNewbie
        1

          May 19, 2010#4

          Would you mind giving a slightly more detailed instruction on how to install and use this tool?
          6,685587
          Grand MasterGrand Master
          6,685587

            May 20, 2010#5

            Hopefully echopark has nothing against my change on his post at top of the topic. I replaced his script code by a link to the script file on the server of IDM and added some lines how to use that script, see the last paragraph of the first post. I don't know who has sent the script file to IDM. I have just detected that it is on IDM's server without being referenced at the moment on page user-submitted scripts. See also the blog Zen Coding for an explanation with images how to setup and use this script.