How can I get custom tags to be recognized as script-like tags in the Freemarker Extension for VS Code? - visual-studio-code

I have the Freemarker extension for VS Code. This recognizes the script tag and treats all code inside of it as JavaScript which is great. However, the platform I am developing for has its own Freemarker directive that adds a script which I would like VS Code to recognize and treat the same way as a script tag, so I can have the correct syntax highlighting etc. Is there any way to do this?
Here's a screenshot showing that right now, there's no syntax highlighting for the custom tag:
Here's a screenshot showing that I currently have to add an unwanted script tag to get the effect I want for the custom tag:

Related

How can I make a plugin for Vscode to change colors of a file type?

for example .xlp is my file type and name is code.xlp I want to highlight some code.
or some colors ?
Somethings like this
Inno Setup For VS code
In case you don't want to write custom extension, try manual configuration of 'file association' for '.xlp' files.
This will tell VS Code to highlight content of '.xlp' files as language of your choice.
For example, I set it to C# and it looks like this:
Steps for this configuration:
Inside of '.xlp' file press ctrl + P to open navigation field,
Search for >Change Language Mode,
Choose Configure File Association for '.xlp',
From dropdown list choose language you like.
As mentioned inside a comment you must write an extension for VS-Code to have your custom syntax highlighting for those files.
There is a good documentation available at:
https://code.visualstudio.com/api/language-extensions/syntax-highlight-guide
At the mentioned web page you will find also more information about how to write your own extension and how to deploy it etc.

How to add a list of custom bad/forbidden words to Visual Studio Code

There is a list of words/phrases that I would like Visual Studio Code to underline when they occur in the project. The list is custom. How to accomplish it?
You can use the extension Highlight to give particular text a different color.
I like the extension Highlight mentioned by #rioV8, but what it misses is:
1) You can not provide a message when code part triggers RegEx
2) It highlights with different colors (it's nice). But it does not use Lenses in Visual Studio Code.
So i wrote an extension that does that. Shows message when code triggers RegEx in realtime. You can think of it like as an Uber Linter.
https://marketplace.visualstudio.com/items?itemName=tomasz-smykowski.assistant
You can find it above and install. Also there is source code available on GitHub

Is it possible to create an extension to vscode that changes the CSS of the editor?

I wish to develop an open-source WYSIWYG editor for markdown in vscode.
See the image below. I want an extension that can do something like that.
Change font-sizes for lines for titles.
Change lines indentation for subtitles.
I'm looking at the extension reference: https://code.visualstudio.com/api/references/vscode-api and don't see something that can help.
Do you have an idea how to change the CSS of the editor based on rules? in addition, If you have a link to extension that did it may help.
In other words: How a vscode extension can change css style of the editor window?
You can't change arbitrary css in the editor. See the extension guide for info about the VS Code extension philosophy and how you can extend VS Code
Two options:
Use the decorations api to change rendering of tokens in the editor.
Use a webview to implement a custom view (but don't try re-implementing a text-editor because it will be a pain and will not work like VS Code's normal editors do)

VS Code expand selection not working

I have no idea since when it is working like this but when I use alt+shift+right arrow in HTML document the selection will expand to single line and then select whole document without jumping trough every tag. Is it a bug or a feature?
This native action is not very helpful.
For html and js (may work for some other languages too) there is an extension Expand region.

Creating Code Blocks <code> or <pre> in CKEditor

Is there a plugin to allow users to create <code/> or <pre/> blocks?
If I pass in some html that includes <code> </code> blocks the contents shows up, but with no visual indication that it is different from any other text. Thats inconvenient, but I can't seem to find a way that a user could select a block of code they typed that they want to appear literally and click a button to indicate that.
I'm still pretty new to the CKEditor, but I know Telerik has a pretty graceful implementation of this. (just click the upper right toolbar button titled "Format Code Block").
Does this editor support that? Are their any plugins that add this functionality?
As for pre-elements, there is this plugin by wwalc: http://ckeditor.com/addon/insertpre
It is also available in GitHub: https://github.com/wwalc/insertpre
The only issue is that it hasn't been updated in a while - It officially only supports CKE up to version 4.1 - so there might be some ACF problems at least. You can search for alternatives at http://ckeditor.com/addons/plugins/all using keywords like code and pre, this will always show the most up to date results.
For code blocks you can also use the Text Formats feature - by default it is available in the Standard and Full presets, though you can also add it to your custom build.
When the Format plugin is enabled, it adds the Format drop-down list to your toolbar. Check the Formatted text format - it wraps the active text block with <pre> tags. Note that it works on block-level, so you don't even need to perform any text selection. However, this also means it's not appropriate for inline formatting.
You can also add some custom styling to the Formatted format by adjusting the config.format_pre definition. See the Applying Block-Level Text Formats sample for demos of both the default implementation and custom format definition (scroll down the sample page to get the complete source code for both solutions).
As for inline code formatting, the Styles drop-down list contains the inline Computer Code style that wraps a text selection with <code> tags. Likewise, you can (and actually should) customize the styling that is applied with this feature.
Additionally, for some really fancy code formatting, see the optional Code Snippet plugin. It lets you insert code snippets with syntax highlighting into the editor. These snippets look great (you can also choose a theme that you like) and since they are implemented as widgets, they have all advantages of CKEditor widgets: a code snippet is treated as a single entity inside the editor, you can select it as a whole, delete, change its position with drag&drop etc. See the documentation and sample for more information and examples.