xmlconfigurationmenudreamweaver

How to create custom Insert menu items in dreamweaver?

I need to create a menu item which inserts some proprietary markup, e.g. a code marker like 

<###LoginForm###>

as used by my CMS.

I'm finding it very hard -- logically, and according to documentation, I should be able to do it by editing menus.xml in configuration/Menus in Dreamweaver's folder in Program Files. But this doesn't work as expected. I tried to copy the item which inserts an HR tag, substituting my "tag", but nothing is inserted.

There are files in configuration/objects/common, referenced in the XML, which seem to contain insertable chunks of code, i.e. there's an HR.htm which looks like it should insert <HR> but it inserts <hr /> when the actual menu item is used in XHTML, so are they obsolete?

I would very much like someone to give me a foolproof recipe to create a menu which would allow me to insert my own tag-like code snippets as above.

Solution

  • The documentation for creating Dreamweaver extensions/addons could use a great deal of improvement. You maybe read how to add a menu item, but it probably didn't say what you should include in the attribute values to do exactly what you wanted. Trying to copy something else is a good starting point, but there can be some "magic" with how some things actually work.

    If this is a snippet of code, why not use the Snippets panel (Window -> Snippet)? You even have the option assigning a keyboard shortcut to individual snippets?

    As for objects (which the Insert menu and Insert bar are used to add code to the page), the built-in tags, such as HR, insert the XHTML compatible versions of the tag into documents with an XHTML doctype. This is by design, and is internal to Dreamweaver.

    If you added the following menu item to menus.xml above the HR entry:

    <menuitem id="DWMenu_Insert_LoginForm" name="LoginForm" enabled="(dw.getActiveWindow(true) != null && dw.getActiveWindow(true).allowsEdits()) && dw.getFocus() != 'browser' && dw.getDocumentDOM() != null  && dw.getDocumentDOM().getParseMode() == 'html'" command="var dom = dw.getDocumentDOM(); var offsets = dom.source.getSelection(); dom.source.replaceRange(offsets[0], offsets[1], '<###LoginForm###>')" />

    Note: I moved away from the file attribute and instead used the command attribute which allows running of JavaScript code, in this case:

    var dom = dw.getDocumentDOM(); var offsets = dom.source.getSelection(); dom.source.replaceRange(offsets[0], offsets[1], '<###LoginForm###>')

    which gets a reference to the document, finds the selection offsets within the document and replaces the selection with your code chunk.

    I've not tested this in every possible way, but works for me in a plain HTML and XHTML documents.