Plugin to add HTML toolbar (like in EditPlus)?



  • Is there a plugin to add HTML toolbar (like in EditPlus)?
    I would like to have toolbar buttons for formatting (B, I, U), adding basic elements (br, nbsp, img, a) and a color picker. These are the buttons I used in EditPlus, but now I’d like to switch to a free editor.



  • Seems like a reasonable plugin to want. I don’t know of such a plugin, though you might investigate “HTML Tag” – if it doesn’t have that feature, you might be able to ask at https://fossil.2of4.net/npp_htmltag/ for that feature to be added. I don’t know how long that might take.

    Alternately, if you have PythonScript plugin, you could do something like I’ve done for automating markdown: make a script for each type of tag that you’d like to insert around highlighted text, and then use the right-click context menu, or keyboard shortcuts, to insert those.

    For the scripts, they all look like:

    #https://notepad-plus-plus.org/community/topic/10957/looking-for-markdown-plugin
    #https://daringfireball.net/projects/markdown/syntax#em
    for i in range(editor.getSelections()):
        start = editor.getSelectionNStart(i)
        end = editor.getSelectionNEnd(i)
        word = editor.getTextRange(start,end)
        editor.setTarget(start, end)
        editor.replaceTarget('**{0}**'.format(word))
    

    Which is putting the ** before and after the highlighted text. So for you, you would just use

        editor.replaceTarget('<b>{0}</b>'.format(word))
    

    … to make the highlighted text bold. If nothing is highlighted, it will just put in the empty <b></b> tag pair.

    If I were doing this for you, I would create a subdirectory of %AppData%\plugins\config\PythonScript\ called HtmlActions or something, then create a separate script (as above) for each of the tags (bold, italic, underline, img, link, …), and edit all of those scripts like above.

    To make them available for keyboard shortcuts or RClick context menu, you would first need to go to Plugins > PythonScript > Configuration … and add them to the “Menu Items” list, hit OK, and restart NPP. To make them available for Toolbar icons, ADD them to the “Toolbar Icons” list in the same dialog.

    To add to context menu, use something similar to what I have in %AppData%\Notepad++\contextMenu.xml:

        <Item FolderName="Markdown commands" PluginEntryName="Python Script" PluginCommandItemName="MarkBold"           ItemNameAs="Mark Selection as Bold"           />
        <Item FolderName="Markdown commands" PluginEntryName="Python Script" PluginCommandItemName="MarkEm"             ItemNameAs="Mark Selection as Emphasis"       />
        <Item FolderName="Markdown commands" PluginEntryName="Python Script" PluginCommandItemName="MarkCodeInline"     ItemNameAs="Mark Selection as Inline-Code"    />
        <Item FolderName="Markdown commands" PluginEntryName="Python Script" PluginCommandItemName="MarkKbd"            ItemNameAs="Mark Selection as Keyboard"       />
        <Item FolderName="Markdown commands" PluginEntryName="Python Script" PluginCommandItemName="MarkLinkInlineURL"  ItemNameAs="Mark Selection as URL of Inline-Link"   />
        <Item FolderName="Markdown commands" PluginEntryName="Python Script" PluginCommandItemName="MarkLinkInlineText" ItemNameAs="Mark Selection as Text of Inline-Link"  />
        <Item FolderName="Markdown commands" id="0"/><!-- divider INSIDE submenu -->
        <Item FolderName="Markdown commands" PluginEntryName="Python Script" PluginCommandItemName="Markdown"           ItemNameAs="Convert Markdown to HTML"         />
    

    To add a shortcut command, go to Settings > Shortcut Mapper > Plugin Commands; if you’ve got a new enough NPP version, you can type “python” in the Filter box, otherwise, just scroll down to the “PythonScript” section; select the script you want to set the shortcut for, and Modify.

    To add the icon, all you need to do is ADD it to the list, above. You can also set a different icon for each script; see the PythonScript documentation.



  • welcome to the notepad++ community, @Bence-Kovács

    i’ve just found one plugin that might do what html toolbar does.
    it’s called webedit, it’s fully customisable, and has a customizable toolbar with customizable icons as well.

    but it only is available for notepad++ 32 bit as far as i can see.

    you can download it here:
    https://sourceforge.net/projects/npp-plugins/files/WebEdit/WebEdit 2.1/

    and here’s a screenshot of the menu and the toolbar:
    Imgur

    i’ve found this easy guide to get you started, if you want to try it out:
    http://devarticles.in/miscelleneous/how-to-add-html-tag-keyboard-and-toolbar-shortcuts-to-notepad-2/


Log in to reply