Sublime Text 2 - Problems with HTML automatic indentation - html

Every time I type an opening html tag (like <div>) then press the Enter key, the cursor automatically inserts an indention on the next line. However I don't want it to be indented since I still have to write the closing tag (actually I press the enter twice and write the closing tag in the third line so I can have an empty line in between). Now I have to press the back button to align the cursor with the opening tag.
I am aware of Sublime Text 2's autocomplete like when you type '<' and Ctrl + Space, a list
of available elements would appear. And when you select one item from the list, the editor would
provide you of both the opening and the closing tag. However, I'm not used to that kind of typing.
So is there a way to turn off this annoying feature of Sublime Text 2

You can disable auto-indentation by setting auto_indent to false.
In order to do this for the HTML syntax only, go to Preferences/Settings – More/Syntax Specific – User and insert the following contents:
{
"auto_indent": false
}
This will make the cursor to jump back at column 0 after hitting return.
To make it stay at the column of the opening tag, re-enable auto_indent and tweak the indentation settings in Packages/HTML/Miscellaneous.tmPreferences. If you aren’t into regular expressions, try to get rid of this file completely.

You can also just type the closing </div> tag and sublime text will automatically un-indent it for you.

Related

Find and delete (strip) all occurances of html tag and its contents in visual studio code

How can I find and delete all occurrences of an html tag using Visual Studio Code.
As an example, I am trying to parse a page that is riddled with SVG tags. I don't want the tags, nor the contents of those tags in the file.
If you are opening the "Find and Replace" popup in VS-Code (Windows: CTRL + H, Mac ⌥ + ⌘ + F), then inside the "Search" input field there are three icons on the right side.
Press the right one .* in order to activate regular expressions.
After it's activated you can search for SVG tags like so:
<\s*svg[^>]*>(.*?)<\s*\/\s*svg>
Leave the replace input empty and press enter in order to replace it with "nothing" and therefore removing the HTML-Tag and it's inner text.
But be careful, this will really delete everything between those matched tags.
So for example if you are looking for <a> tags, even this String will be completely removed: Some <span>special</span> formatted link
You can find an example with it here: https://regex101.com/r/ewEttF/1
You can use Regex Search and Emmet.
Use regex search to find the start tags: <svg[^>]*>
While the focus is still in the find dialog: Alt+Enter
this will select all matching cases and put focus on the editor
Move cursors after the opening tag: RightArrow
Use Emmet: Balance outward to select content of tag
Use Emmet: Balance outward to select content and tag start and tag end
Delete selected stuff with: Delete
End Multi Cursor with: Esc

How to disable PhpStorm expanding on typing space in HTML mode?

When I edit a file with the ".html" extension I get the following behaviour:
When I type the word "in" inside a tag followed by a space or equal sign, it is expanded to "inlist". When I type the word "in" inside a tags attribute followed by a blank, it is expanded to "{settings} ".
Is there an option to achieve, that those expansions only happen, when I hit the TAB-key?

Emmet Vim wrap a specific tag around

This is very basic but I just could not find an easier way of doing it.
I have an html file and I want to wrap <strong></strong> around some part.
So, I go to visual mode. Select the text. Do Control Y - ,. It asks for Tag. I enter strong and it wraps the tags as expected.
But this is way too long for vim IMHO.
Is not there a quicker/ easier way to get this done? May be an abbreviation attached to a keystroke?
So, I select the text in visual mode, press a key and there --- <strong> </strong> appear around it?
With the surround plugin it's select the text in visual mode, press S<, tag name, <cr>.
Or ys, motion or text object, <, tag name, <cr>.
< can be replaced by t, attributes can be appended to the tag name, and <cr> can be replaced by >.

After "a{display text}", then pasting the url, how can I get the cursor to go after the close </a>? Like $0 in a Sublime autocomplete

I'm using Emmet in Sublime Text 3.
After executing a{display text}, you get
display text
What I'm trying to do is get the cursor to jump to after the close </a>, after I've pasted in the url. I'm trying to simulate Sublime's autocomplete $0 behavior, like
display text$0
I am looking through snippets.json, but I'm not getting it. The only "a" entry is in the "abbreviations" object, and contains only the open tag:
"a": "<a href=\"\">",
I've not edited any Emmet tags before, and I thought this might be a good first one to try.
Any ideas on how this might be possible?
There's a built-in Emmet setting that does this for all tags:
This is in C:\Users\jeffy\AppData\Roaming\Sublime Text 3\Packages\Emmet\Emmet.sublime-settings
// If set to `true`, Emmet will automatically insert final tabstop
// at the end of expanded abbreviation
"insert_final_tabstop": false
I duplicated it to C:\Users\jeffy\AppData\Roaming\Sublime Text 3\Packages\User\Emmet.sublime-settings
and changed it to true. It does exactly as I want. Well, it still goes to the display text, even if there already is display text. Then it goes to the end. But close enough!

Can I wrap a text selection in a tag in phpstorm?

Suppose I have a text:
This is my text!
How beautiful it is!
And I want to wrap each line within a p-tag, is there an easier way than to navigate to each line and add them manually and have them close semi-automatically?
I want them to look like this:
<p>This is my text!</p>
<p>How beautiful it is!</p>
while having to do as less as possible.
Select your lines
Code | Surround With...
For Windows/Linux: Ctrl + Alt + T
For MacOS: Cmd + Alt + T
Choose "Emmet"
Type p* -- this will surround each line with <p> tag
NOTE: Empty lines will be wrapped as well so it is better remove them in advance.
Similar/related case.
P.S.
In current versions of IDE the dedicated "Surround with Emmet" action is available which allows you to bring that popup window in one key stroke instead of having going trough via intermediate Surround with... popup menu first.
That action has no shortcut defined by default, but you can easily change that and assign any desired shortcut in Settings/Preferences | Keymap -- just look for Other | Surround with Emmet action (hint: use search box to speed up your search).