Is there a way to have Adobe Brackets automatically reformat an HTML file for me? I don't mean change the code, I mean indentation.
For example, I might be given a file that has code like this:
<div>
<strong>James Doe.</strong>
</div>
It is easier to read like this:
<div>
<strong>James Doe.</strong>
</div>
Is there something that can do this automatically in Brackets? If not, another application? Rather than me going through and reformatting the lines manually.
The "Beautify" extension is probably what you're after.
Just open the Extension Manager and search for "Beautify".
Related
I need to be able to add a js file to be able to manipulate the html? I tried to add something similar to what is done in the assets.yml by loading the styles.css, but I did not have the expected result, and I do not understand how else I could do it.
There is a new Quick Start Guide in a JavaScript tutorial that has the exact example you are asking for:
https://doc.oroinc.com/frontend/javascript/js-quick-start/
You can do JavaScript coding inline, I would suggest making a separate file for it though, just like you do with a .css file. A .js file is called with a <script> tag instead of <link> in your HTML document.
How to do it
Make a new file called main.js inside your folder
Call it with the <script> tag in your HTML document, usually just before the closing </body> tag.
Make an element and manipulate it - this example is the p element that has the ID #change. One way to do it is with document.querySelector. You can do it with a classname as well if you prefer.
I'll let you do the rest.
document.querySelector('#change').innerHTML =
<p id="change">Change me</p>
<script src="main.js"></script>
I am using custom seperators/tags for template variables in HTML code. My tags are "{[{" "}]}". Can I make IntelliJ IDEA (or WebStorm) ignore completely what is inbetween them? If it matters, it is Go template language with custom tags.
Example :
<div title="{[{.T.T "error"}]}!"></div>
Gets marked as error because of the quotes inside the quotes. It also disables the ability for proper auto indentation or code formatting.
Another example, in this case JavaScript in an HTML document :
<script>
{[{if .Data.User}]}
var userData = {[{.Data.User}]};
{[{end}]}
</script>
This marks the quotes themselves as error.
I don't want IntelliJ to check the template code, just ignoring everything between the brackets would be enough.
No, you can't. IntelliJ IDEA builds a complete parse tree for the entire file, and it is not able to ignore arbitrary chunks of the file.
What you can do is either write a plugin that will be able to parse your template syntax, or change the syntax you use so that it matches more closely an existing template library already supported by IntelliJ IDEA.
Is there a way to change autocomplete rule for attribute values in PhpStorm 7.1 (or disable it)?
I mean I want to change autocomplete from
<div class=""></div>
to
<div class=''></div>
In addition to already stated workarounds by Noah.
It's not possible to choose quote symbol in such case.
Please watch/vote this ticket to get notified on progress: http://youtrack.jetbrains.com/issue/WEB-459
I've been using PhpStorm since v5, but have not found a way to address this.
However, this behaviour can vary, depending on how you're getting to the quotes.
If you're typing <div class= and it's automatically filling in the "" for you, you can remove that by [unsetting "Automatically add quotes for attribute values"].
If you're using tab-completion, like <div cla[TAB], then there doesn't seem to be much you can do, except press backspace after tab. I haven't
You can set up your own Live Template <div class='$END$'></div> to give you your desired format.
There may be a plugin or two that can change / override PhpStorm's default behaviour, but I haven't looked too much.
My apologies for the post. I realize that this is more than likely redundant but for some reason I can't seem to find my answer.
I believe there is a keyboard shortcut in Textmate for converting something along the lines of
div.test
to
<div class="test"></div>
Any ideas? Anyone know where I can get documentation about this shortcut?
Thank you.
See Zen Coding and Sparkup.
Without the additions mentioned by #Bradford, the alternative option is to use the built-in snippets. For example (when the document is set to be HTML), typing div<TAB><TAB>test inserts the following and places the cursor on the second line:
<div id="test">
</div>
One of my most common operations in textmate is to encapsulate a block of text in a <div>.
How can i create a keyboard shortcut for this? I do not really feel like learning anything complex, so simple solutions would work best - thanks!
Maybe I didn't understand your question, but what about the "Wrap Selection in Open/Close Tag" (Ctl-Shift-W) from the HTML bundle? Having a block of text selected then overtyping the default <p> with <div> does the work. See http://manual.macromates.com/en/bundles#html
But the following snippet :
${0:${TM_SELECTED_TEXT/\A(.)<\/div>\z|./(?1:$1:$0<\/div>)/m}}
does the same thing without even typing the tag ...
HTH
This might slightly off topic, but you might be interested in using Zen coding for Textmate, which allows you produce lots of HTML with a few key strokes.
You write:
div#page>div.logo+ul#navigation>li*5>a
You get:
<div id="page">
<div class="logo"></div>
<ul id="navigation">
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
(disclaimer: the example code is from the above mentioned site)
Besides that it adds features for easy navigation of editable parts of HTML, for easy wrapping of content using the same syntax as above. This last past would allow you to wrap any text (content) in whatever HTML you would like.
Happy coding :)