Syntax coloring of html files in eclipse - html

We use a custom cgi solution, which makes use of %-tags in html-files:
<% keyword some.stuff() %>
Does anyone know an easy way to get syntax coloring in eclipse for these tags?

HTML syntax coloring settings are in:
Preferences-Web-HTML files-Syntax coloring
Just change and apply your changes, and take a look at the preview window below to see what part is changed.
The reason I don't list the specific location of the setting you want, is that I cannot figure out what kind of code you are writing in your project. HTML files can contain a variety type of contents, like java code in .jsp and javascript, so you may have to check other syntax coloring settings related to the type of code you use. For example, .jsp syntax coloring settings are in:
Preferences-Web-JSP files-Syntax coloring
But the effect can show in a html file.
You can search syntax coloring in Eclipse Preferences window to get a full list of such settings.

My best bet would be Eclipse Colorer plug-in. It is a very elegant plugin based on extensive Colorer library.

Related

Visual Studio Code don't recognize HTML file

I am learning to build a Website on Python Django, but when I create a HTML file in VS code, this Editor don't recognize this file. You can see in following picture. I don't know how to solve this problem. Pls help me if you know, thank you very much
Try to install any HTML extension
Turn on HTML5 suggestion in settings.json file:
"html.suggest.html5": true
Follow this post
No HTML suggestions in Visual Studio Code
Note that in the bottom right-hand corner of your screen, the document language is Python Django, but if you click that and change the language to HTML, you will get HTML language features.
if necessary, sometimes it can be useful to compose a document in a side-by-side window that has the language type you need, to get the hinting and auto completion features, and then copy that into the adjoining document.
After installing and activating Django extension;
File - Preferences - Settings
Then find "Emmet:Include Languages" (You can use CTRL + F for that)
After that arrange "Item" and "Value":
Item = django-html
Value = html
Then click OK
In this way, it will be solved I guess

PhpStorm generate template from code selection

I frequently use PhpStorm's Extract variable & method refactorings. Is there a way to add/extend functionality that could create a new template file from the selected code, prompt for desired template path, and create an include/require statement for that template?
I'm asking either for an entry point into coding this functionality, or extending existing functionality. Or maybe it's already available and I missed it.
As #Ástþór mentioned, there is no such way to change the refactoring templates.
You can use surround with live templates to emulate this behavior. This will not find duplicates and will not replace them as well, but may be it's close enough what you want.
Add a surround live template like this one. Open the editor with Ctrl+Alt+S:
Edit the variables in order to get a nicer UX:
Select the variable you want to extract and select Code > Surround with Live Templates from the menu or press Ctrl+Alt+J.
Adjust the templates to your needs.
Live template variables
HTH
No, there isn't. You can ask this question at https://intellij-support.jetbrains.com/hc/en-us/community/topics/200366979-IntelliJ-IDEA-Open-API-and-Plugin-Development
Other useful sources: https://www.jetbrains.org/intellij/sdk/docs/basics/getting_started.html & https://confluence.jetbrains.com/display/PhpStorm/Setting-up+environment+for+PhpStorm+plugin+development

HTML Syntax Highlighting within Freemarker .FTL Spring STS

After a clean install of Spring Tool Suite and the necessary plugins my current project requires (of which Freemarker is one) I find that HTML seems to be ignored within all of my .FTLs and is just displayed as black text (see image of settings). Prior to this, any HTML tags, comments and strings were picked up and highlighted in the default colours given.
To clarify, now it's only the Freemarker specific syntax that is now detected.(Directives - Blue and Freemarker variables - Pink)
If anyone knows how to fix this issue I would be greatly appreciative!
Freemarker Preferences Image
That's https://issues.jboss.org/browse/JBIDE-22631. If you are using file .html.ftl or .xml.ftl (or ftlh or ftlx when JBIDE-22636 will be merged) file extension, it starts doing some highlighting, though it doesn't colorize the attributes differently anymore.

in PhpStorm, is it possible to reformat injected code within a PHP file?

PhpStorm can apply code style rules for specific languages with the Reformat Code command. PhpStorm can also recognize a language embedded within a file of another language (known in PhpStorm as 'Language Injection'). So, I expect that a language would be subject to its code style rules wherever the language is used -- whether embedded or in its own file.
I've found that this works as expected for css/js within an html file, but not for language injections within PHP files. PhpStorm will recognize css within a heredoc, and html as a heredoc and in single- and double- quoted strings -- yet reformatting does not work in any of these cases.
Short of using an intermediary file to reformat the code, how can I get PhpStorm to reformat these sections of code? I am using PhpStorm 6.0.3 for Mac.
Their documentation states:
PhpStorm supports full coding assistance for:
CSS and JavaScript in an HTML or XML file.
CSS, JavaScript, and SQL outside PHP code blocks and inside PHP string literals.
The second bullet seems only half true, as css/js/sql are recognized but not subjected to code styles inside PHP string literals. And injected html is not specified; but between PhpStorm recognizing the language injections and its capability to apply code styles to an arbitrary selection, all the pieces for formatting embedded languages seem to be there. What am I missing?
To reformat injected code according to PhpStorm code styles Preferences, select the injected code and open the Intention Actions list (Alt+Enter), and select "Edit __ Fragment" to edit it in it's own dedicated window (documentation). In this window, code formatting will work as expected.

Eclipse - how to extend HTML editor to add custom tags?

I write an application and inside of HTML code I have custom tags (of course these tags are parsed on server side and end user gets them as valid HTML code). Example of custom tag usage:
<html>
<body>
...
<Gallery type="grid" title="My Gallery" />
...
</body>
</html>
1.) How can I have eclipse recognize my custom tags inside of HTML code and add syntax highlighting to them?
2.) How can I add auto-suggestions to my custom tags? For example if I type "<Gallery " press "Ctrl+Space" - in the list of available attributes it shows me "type" and "title" and if I type "<Gallery type=" press "Ctrl+Space" I would see list of available values only for tag "Gallery" and its attribute "type".
Thanks in advance!
Not really what you want, but maybe it helps you:
You can try the Aptana Plug-in for Eclipse. It allows to write your own regular expression for HTML validation, so a custom tag would be ignored by the validator.
E.g.:
.gallery.
Eclipse allows you to add simple auto-suggestions via Templates. On
Eclipse 3.7.1 (Indigo) + PHP Dev Tools (PDT) 3.0.0: Window > Preferences > Web > HTML Files > Editor > Templates
Sadly, there is no easy way: you have to roll your own parser for this, and then add both your extra elements and the base grammar (HTML) to it.
If you have your parser, you could use it to do syntax highlighting (strictly speaking, for that simple lexing is enough); and a good parser can support content assist (auto-suggestions in your terminology).
Caveats:
Creating a parser for HTML is not an easy task. Maybe by aiming at a more often used subset is feasible.
If a parser exists, the editor parts are still hard to get well.
Some help on the other hand: you could use some text editor generators to ease your work:
Eclipse IMP http://www.eclipse.org/imp/ can in theory handle any type of parser, but currently it is most optimized for LPG. The documentation is scarce, but the developers are helpful in the forums.
Xtext http://www.eclipse.org/Xtext/ got quite a hype for creating text editors for DSLs. The generated editors are quite nice out of the box, but is not the best solution for large files. Has a really helpful developer community.
EMFText http://www.emftext.org/index.php/EMFText is a lesser known entity - I don't know it in details, but I guess, it is similar to Xtext.
I know its been a long time since this Q was asked,
but I hope this might help others like myself that reach this in search of a solution.
So, When using Eclipse (Mars.1 Release (4.5.1) - and possibly earlier - I did not check).
Go to Window - Prefrences
Then in the dialog that opens go to Web - HTML Files - Editor - Validation.
On the right side:
under Ignore specified element names in validation and enter the list of custom elements you use. (e.g. Gallery,tab,tabset,my-element-directives-*)
you might also like to go under Ignore specified attribute names in validation do the same for your custom attributes.(e.g. ng-*,my-attr-directives-*)
Two things to note:
After letting eclipse do a full validation you must also close the file and reopen it to have the warnings removed from the source code.
Using this method would ignore those attributes under any element. I don't think there is a simple way to tell it to ignore some-attribute only if its a child of some-element.
I find templates are an ok alternative but let's see if we can encourage a more robust solution; please take a moment and vote for this: https://bugs.eclipse.org/bugs/show_bug.cgi?id=422584
You need to add a new HTML template.To add a new template, complete the following steps:
1) From the Window menu, select Preferences.
2) In the Preferences page, select Web and XML > HTML Files > HTML Templates.
3) Click New.
4) Enter the new template name and a brief description of the template.
5) Using the Context drop-down list, specify the context in which the template is available.
6) In the Pattern field, enter the appropriate tags, attributes, or attribute values (the content of the template) to be inserted by content assist.
7) If you want to insert a variable, click the Variable button and select the variable to be inserted. For example, the word_selection variable indicates the word that is selected at the beginning of template insertion, and the cursor variable determines where the cursor will be after the template is inserted in the HTML document.
8) Click OK to save the new template.
You can edit, remove, import, or export a template by using the same Preferences page.
Reference : http://help.eclipse.org/kepler/index.jsp?topic=%2Forg.eclipse.wst.sse.doc.user%2Ftopics%2Ftsrcedt024.html