In Sublime3 Text Editor, I'm trying to type the following:
p some dummy text
and have the result be
<p>some dummy text</p>
I can't seem to find the shortcut for this. Anyone else run into this?
Thanks in advance.
Are you using Emmet? If so, put the text between {}.
p>{some dummy text}
For more info, visit Emmet’s Documentation.
Related
I'm looking for a setting or extension in VSCode that provides the following functionality:
Format on save
wrap html attributes on their own line, even if there is only one attribute
put closing symbol of opening tag on new line, aligned with tag
alphabetically order attributes
do not align attributes according to the position of the first attribute, simple use one level of indentation
Example 1:
<span my-attr="value">Hello, world!</span>
becomes
<span
my-attr="value"
>
Hello, world!
</span>
Example 2:
<x-status-indicator wire:click="pushMe" class="block" :status="$status"
:description="$description" />
then becomes
<x-status-indicator
:description="$description"
:status="$status"
class="block"
wire:click="pushMe"
/>
So far there have been many posts about formatting, but I could not find a single post or extension that satisfies these requirements. Any suggestions would be greatly appreciated, thank you! :)
I can't find out how to select the whole content of HTML attribute. For example I have a div with class
<div class="menu-link font-size-bigger font-weight-bold"></div>
So now when I want to select all classes "menu-link font-size-bigger font-weight-bold" I must press smartSelect.grow 3x
Is there a better way. I just want to use one shortcut press. Thank you
For this use case you need to install an extension. You could try these:
https://marketplace.visualstudio.com/items?itemName=chunsen.bracket-select
https://marketplace.visualstudio.com/items?itemName=StAlYo.select-quotes
I've been currently using the Brackets.io editor, and it has lots of extensions and so on, which is pretty good. Anyway, I couldn't find any extensions to do precisely what I want, so I came here in hope any of you guys could help me.
Well, as you know, on Netbeans, when you type a tag, such as P, the editor closes it, and if you then press ENTER, it automatically auto indents the code as the following:
<p>
Example
</p>
Is there a way to do so on Brackets.io, in the same, same way?
Thank you all for your attention :)
Emmet does that.
Typing the following keys < p > RETURN a does the following :
Without Emmet:
<p>
a</p>
With Emmet:
<p>
a
</p>
By the way, Emmet is a very cool tool, and you can obtain the same result faster with the following keys :
p TAB RETURN a
Is it possible to get the content of a clicked paragraph in tinymce? If yes, how?
For ex: I have paragraph as shown below
I will use '|' to denote cursor
<p>123</p>
<p>45|6</p>
<p>789</p>
I should get output as
<p>456</p>
Any help would be appreciated.....
I believe this will do what you want:
tinymce.activeEditor.selection.getNode()
Take a look at this TinyMCE Fiddle for an example of how you might do this: http://fiddle.tinymce.com/xAfaab
In ST2 when you type div.foo and then press tab it goes to <div class="foo"></div>
Is there any setting to do autocompletion like that?
<div class="foo">
// 4spaces here.
</div>
Thank you.
UPDATED
Didn't find a special setting but found where to change snippet if someone intested.
In Sublime Text 2/Packages/HTML/html_completions.py just change
snippet = "<{0} class=\"{1}\">$1$0".format(tag, arg)
to
snippet = "<{0} class=\"{1}\">\n\t$1\n$0".format(tag, arg)
Solved.
You must be using emmet.... stock sublime text 2 does not auto complete class attribute from typing element.class that is emmet's doing. I use it... I love that emmet magic.
Similarly you could type element>element to make the second one nest on the first one. or element#id to add an id instead of a class...
Here is an entire cheat sheet for emmet for more completions using emmet plugin on ST2.
Make sure your page is on HTML. You can do this with CTRL+SHIFT+P. Then type 'set html'.
Then you can type div.class_name followed by TAB.