How to use hotkey in notepad++ webedit plugin?
what are the keyboard shortcuts to press to insert html tags??
Install the "webedit" plugin. Which will allow you to add custom shortcuts.
(Plugins > plugin manager).
After the program restarts, go to plugins > webedit > edit config. And either change an existing one or add a new one, (example &A= | ). You can remove the shortcut icons if they annoy you.
Then you go to, settings, shortcut mapper. Right now, ctl+enter is set to word completion I believe. Change that to something else (on main menu). Then go to the plugin commands tab and find your command and set it to ctl+enter. Then restart, and it should work.
http://www.graphicdesignforum.com/forum/showthread.php?t=52719
All keyboard shortcuts can be assigned/modified using the standard Shortcut Mapper. For more information see the WebEdit.txt help file.
That's what it says in the plugin description, at least.
Setting>Keyboard Shorcut>Plugins commands
then go to
- WebEdit - A
- WebEdit - Div Class
- WebEdit [...]
and select shortcut
I see that someone sort of answered it but I have a few things to add.
When you install WebEdit, go to the config as stated.
Go down to the [Tags] section.
Underneath all the comments, add the shortcut you want.
Here is the syntax:
<Tag>=<Replacement>
For tag, put what you want to replace. For example 'h1' (dont use the carrots).
put the = sign.
Then for replacement, put what you want "h1" to be replaced with.
Here is an example of my h1 hotkey:
h1=<h1>|</h1>
What the pipe character does is tell npp where to put your cursor after the replacement.
So this is how you use it now:
type h1, then press 'Alt+Enter'(by default, you can change this too), then BAM, your 'h1' will be replaced with:
<h1></h1> and your cursor will be sitting between the tags.
You could also do h1=<h1>|\n</h1> which would print the same thing but with a line break.
You can do some pretty awesome stuff with it. Saved me SO much time once I got used to it. I never type without it anymore lol.
Here is what my personal setup looks like under the [Tags] section (and I commented everything below starting with the m=module because it was messing with my 'p' tag and I didn't care anyways.
begin=<!DOCTYPE html>\n<html>\n<head>\n</head>\n<body>\n\n|</body>\n</html>
h1=<h1>|</h1>
h2=<h2>|</h2>
h3=<h3>|</h3>
h4=<h4>|</h4>
h5=<h5>|</h5>
h6=<h6>|</h6>
html=<html>\n|\n</html>
script=<script type="text/javascript">\n\t\n</script>
link=<link rel="stylesheet" type="text/css" href="|">
a=
div=<div>
divclass=<div class="|">
divid=<div id="|">
divend=</div>
p=<p>|</p>
ul=<ul>\n\t|\n</ul>
li=<li>|</li>
header=<header>\n\t|\n</header>
nav=<nav>\n\t|\n</nav>
section=<section>\n\t|\n</section>
article=<article>\n\t|\n</article>
aside=<aside>\n\t|\n</aside>
footer=<footer>\n\t|\n</footer>
Remember one thing; after you edit the WebEdit, you have to restart NPP before the new tag will work.
I know this is a bit old, but you can use the Emmet plugin to speedup your HTML and CSS typing. you can customize your snippets to make any text.
It cames whith dozens of snippets already, you just have to type it and then hit Ctrl+Alt+Enter.
You can find the file to edit in this path:
C:\Program Files (x86)\Notepad++\plugins\EmmetNPP\emmet\snippets.json
It's easy to spot what you have to do.
On the plug-ins menu you will find all options that this plugin offers.
Experiment it like typing html:5 and then hit Ctrl+Alt+Enter.
Or even this ul>li*4>a[href=page.php?id=$]{page $}.
You will be amezed.
Check this online documentation for keyboard & mouse shortcuts
Related
Hi I'm using Emmet on Atom code editor and it works fine only with the simple tags like meta.
Nevertheless when I try something complex like ul>li*5 or meta[property=""] and then press tab, nothing happens.
Anyone know how to fix this?
It happened to me as well, the problem is that the same hotkey(tab) is set to multiple actions, so my solution was to edit the expand action like this.
go to Settings > Packages > Search Emmet...
on the keybindings get the last one tab and click on the copy icon
[]<- (something like that)
then go to Edit > Keymap... and copy the next there
'atom-text-editor:not([mini])':
'ctrl-alt-shift-c': 'emmet:expand-abbreviation'
As the keymap.. overrides all the other keybindings this one will work over all other definitions.
Note: if you use 'tab' as key binding it will only be used for expand-emmet, so you won't be able to actually tab__(2spaces) in HTML, PHP, more... files
HOPE IT HELPS
you find after installing emmet, tab completion doesn’t work as described in the documentation, go to Atom > Keymap or File > Keymap add the following code, then restart Atom (this fix worked for me):
'atom-text-editor:not([mini])':
'tab': 'emmet:expand-abbreviation-with-tab'
Answer is from
https://github.com/emmetio/emmet-atom/issues/503
It worked for me.
You go to Atom > Keymap or File > Keymap add the following code, then restart Atom.
'atom-text-editor:not([mini])':
'tab': 'emmet:expand-abbreviation-with-tab'
Just want to mention that like in https://stackoverflow.com/a/65645633/7773582 I had to restart Atom installed in Ubuntu Linux Groovy Gorilla to get my own keymap.cson for a new Keybinding with
'atom-text-editor[data-grammar="text html basic"]:not([mini]),
atom-text-editor[data-grammar~="erb"]:not([mini]),
atom-text-editor[data-grammar~="jade"]:not([mini]),
atom-text-editor[data-grammar~="css"]:not([mini]),
atom-text-editor[data-grammar~="stylus"]:not([mini]),
atom-text-editor[data-grammar~="sass"]:not([mini]),
atom-text-editor[data-grammar~="scss"]:not([mini])':
'shift-enter': 'emmet:expand-abbreviation-with-tab'
for the Emmet-Plugin to unfold its Syntax to work properly.
Any add-ons you install will most likely wont work if you dont restart your app.
If all solutions mentioned here does not take any effect to your Atom app is simply because your Atom app is STILL working in the backgroud even if you closed it.
Simple solution is go to Task Manager and End Task your Atom app there...
Hope it helps...
Happy Learning...
What is the equivalent Atom Indent Guides like the one Bracket has showing vertical lines connecting matching beginning/opening and ending/closing brackets or keywords?
Atom supports "Indent Guides" and even names it the same, you can access the configuration by choosing Settings View: Open from the Command Palette
or by pressing Ctrl-, (Control + Comma). Scroll about two-thirds of the way down and there is a checkbox to toggle the Indent Guide on or off:
When enabled they look like this in the editor:
Also found an "improved" package in Atom if Atom's indent-guide isn't cutting it.
https://atom.io/packages/indent-guide-improved
Repo seems to be updated.
UPDATE: show indent guide option is now under Editor tab, in settings.
Screenshot:
Haha. I encountered this issue today too. If I understand your question correctly, you want to know how to enable this feature?
Go to preferences/settings and then scroll down and check 'show indent guide'.
Example
My problem is simply that some of the Emmet snippets and abbreviations get overridden by the Sublime Text 3 default tags - for example, when I type 'link' and press TAB I don't end up with:
<link rel="stylesheet" href="">
as stated in the Emmet documentation (https://github.com/emmetio/emmet/blob/master/lib/snippets.json).
Instead I get:
<link rel="stylesheet" type="text/css" href="">
This which is the Sublime Text 3 default. The same goes for 'img' and a few other useful tags, and now I'm wondering: why is that and what can I do "fix" it? I want the Emmet snippets to have "first dibs", and not the other way around.
Open Preferences -> Package Settings -> Emmet -> Settings-User and add the following content (it should be empty upon opening it for the first time):
{
"remove_html_completions": true
}
Save the file, then restart Sublime.
For a look at all the options you can customize, open Preferences -> Package Settings -> Emmet -> Settings-Default. If you see anything that you'd like to change, copy the setting to Settings-User, making sure there's a comma , at the end of each line except the last one.
Just for the record I want to convey that I've finally found the solution to my problem. It would seem as if Emmet has this built in setting where you can specify in which scopes you want your code editors' defaults to override Emmet, and as a default this is set to "text.html". Hence what I needed to do to resolve my issue was just to change this setting to none by simply typing
{
"disabled_single_snippet_for_scopes": ""
}
In the Emmet user settings. Cheers!
It’s pretty hard for Emmet to play nice with native Sublime Text snippets due to lack of API. But Emmet tries to guess what you want to do as much as possible.
By default, when you type something in ST that matches native snippet you’ll likely see an autocomplete popup with snippets proposals. Which means you’ll likely want to expand native snippet by pressing Tab key. On the other hand, most Emmet abbreviations doesn’t look like predefined snippet, e.g. you won’t see autocomplete popup when typing abbreviation.
Thus, Emmet doesn’t expand abbreviations by Tab key when autocomplete popup is visible. It seems like a decent solution for native snippets problem (ST API can tell if popup is visible). I’m pretty sure in your link example there was autocomplete popup visible.
For hardcore Emmet users it’s possible to disable this behaviour and force Emmet to always expand abbreviations by Tab, event if autocomplete popup is visible. To do so, go to Preferences → Settings-User and add the following option:
"disable_tab_abbreviations_on_auto_complete": false
See https://github.com/sergeche/emmet-sublime/blob/master/Preferences.sublime-settings#L29
I am a big fan of ST2, and have been finding oodles of tricks to code/type faster.
One thing that I would like to know is if it is possible to create custom symbols for things like code blocks, include segments, and other bookmarks for goodies in your file.
For example:
I want to quickly include a standard C lib via (inc, tab). Is there a way for me to create a section where I keep all my standard lib includes (i.e: #CSTDLIB) and use the functionality of goto-> symbol (ctrl+r) to skip straight to this segment from anywhere in my file?
I tried looking to see if there was some sort of special handler to place in a comment that would recognise it as a "bookmark" but couldnt really find anything.
Cheers in advance.
This is an old question, so I'm answering for the latest ST3. Pretty sure this was possible with older versions as well.
The builtin C/C++ syntax definitions support a special formatting for comments in the following form:
// =jump target=
The string "jump target" will then be listed in the symbol list for ctrl+r. Unfortunately that only works if the // is at the beginning of the line. But we can fix that.
Install PackageResourceViewer, then from the command palette use PackageResourceViewer: Open Resource->C++->C.sublime-syntax.
In this file it says:
- match: ^// =(\s*.*?)\s*=\s*$\n?
scope: comment.line.banner.c
captures:
1: meta.toc-list.banner.line.c
Now remove the ^ in front of the regexp, save the file. Now you can enter comments // =jump target= anywhere, and jump there with ctrl+r.
If I have understood you correctly, you can use Ctrl + F2 shortcut for making bookmarks anywhere in your file, and walk through these bookmarks by F2 button. To remove bookmark, press Ctrl + F2 again in the line which you want to exclude from bookmarks.
If it isn't so, and this functionality doesn't cover your requirements, please specify more detailed use case.
Hope it will be useful to you
Is there any eclipse shortcut/trick/plugin/whatever that will allow me to select a section of text and surround it with an arbitrary html/xml tag when using the html editor.
Something like this textmate video
EDIT: not sure If my Eclipse setup is the same as yours, but...
I have the HTML Editor installed, and if I switch to the Java perspective, I can use Edit -> Quick Fix and then choose Surround with new element to get exactly the effect in your video. (On a Mac, the shortcut for this is ⌘1).
Hope this is helpful.
In the C++ editor, you can try Source -> Surround With... -> Configure Templates to add the tag you want.
The following works and allows for entering random/arbitrary tags:
Select the desired text that you want wrap.
Go to 'Edit > Quick Fix' or press 'Ctrl + 1'.
In the new menu that appears select 'Surround with new element'
However there is an annoyance, please upvote Bug 494169