I want to show some source code with the WebBrowser control on a winform. And I want to decorate the source code with HTML tags, such as color, font, and size. But I found it difficult to display the indent properly.
To be precise, my source code are held in String[], and each String holds the proper indent (space or tab) already. But it seems these kinds of indent are just ignored by the WebBrowser control.
Could someone tell me how to?
I like to paste my code in a Gist and then display it that way. Github will recognize the code and format it accordingly.
If you're going to be doing it often you could try markdown.
Or use a one-off formatter like Syntax Highlighter.
The <pre> element (using <code> elements with appropriate class names to mark up the parts you want to syntax highlight)
<pre><code class="javascript"><code class="keyword">function</code> <code class="name">foo</code>()…
You might want to look into this JavaScript library to highlight and format your code. http://code.google.com/p/syntaxhighlighter/
Or you can check out a service like this - http://pygments.appspot.com/ or this - http://hilite.me/
Related
I am trying to create a TOC for my Markdown blog.
The methods I am finding here... : Markdown to create pages and table of contents?
....do not work for me because I am naming all of my headers # _</>_ The Setup because I am using CSS on to style the "", giving each header a nice colored Icon next to it. If I simply use ```# The Setup ```` it works great.
This causes issues whenever I try to use [The Setup](#The-Setup).
I tried a few things like [The Setup](#_</>_-The-Setup) and other things, but I can not get it to work.
If someone can point me in the right direction I would greatly appreciate it. Also, if anyone has a better way of adding custom icons next to headers, I think that would be the better way to go about it.
As always, thanks in advance.
The general solution is to examine the rendered HTML output to see what the tool is converting the special characters to, in the HTML's element ID. Every tool could handle the conversion differently (it could convert special characters to -, _, or just remove special characters). Some examples:
<h1 id="_____the-setup">The Setup</h1>
<h1 id="-the-setup">The Setup</h1>
<h1 id="the-setup">The Setup</h1>
Once you have identified the exact id that the tool is using, then you use that value as the heading link in the markdown's table of contents. For example:
[The Setup](#_____the-setup)
Now, the tricky part is that not all Markdown tools will export the rendered HTML, including VS Code. The workaround for VS Code is:
Open the markdown preview mode (which renders to html internally).
Open the VS Code Developer Tools (Help > Toggle Developer Tools).
Use DevTools to inspect the element (in this case, the heading element for "The Setup").
I see that VS Code named the id as the-setup, so in the markdown's table of contents, I write [The Setup](#the-setup). Now the table of content hyperlink works in VS Code. Caveat: it might not work in other Markdown tools if they render a different HTML element ID!
Another shortcut now available in VS Code (1.70 July 2022), is that markdown can autocomplete the header ID. So you just type #, and it will list the valid IDs:
Currently, I am working on a program that converts an html page into a PDF using the iText Library.
The Checker that I am using is PAC3 -->PDF Accessibility Checker 3 which is described by the following link (https://section508.gov/blog/check-pdf).
One of the issues is the “Alternate description missing for an Annotation”
An excerpt from the following link explains it:
http://www.uottawa.ca/respect/sites/www.uottawa.ca.respect/files/fss-fixing-accessibility-errors-in-pdfs.pdf
Alternative description missing for an annotation This usually happens when the link is not clear enough. To fix this error, add alternative text to the link tags. To add the alternative text, please do the following;
In the tag tree, select the tag for the link, and select Properties
from the options menu.
In the Touchup Properties dialog box, select
the Tag Tab.
Type alternate text for the link, and click close
I have been trying to use iText to fix this problem, but googling, looking at the source and reading the documentation does not help.
Does anybody have any suggestions on how to either write the HTML or use the itext problem to get rid of the “Alternate description missing for an Annotation”
Thank you for your help
You did not specify whether you using old code (XMLWorker, HTMLWorker) or new iText code (pdfHTML).
This of course impacts the proposed solution.
In my answer I am going to assume you are using pdfHTML
There are several options:
edit the incoming HTML using a library like JSoup
convert the incoming HTML to iText IElement objects, and edit those, setting properties where needed
write your own custom TagWorker that handles all instances of a specific tag, and write custom logic to deal with the missing annotations.
An example of a custom tag worker can be found here:
https://developers.itextpdf.com/content/itext-7-examples/converting-html-pdf/pdfhtml-custom-tagworker-example
I would like to do something like this:
```swift
let someVar = "foo"
```
in Jekyll, and have it show up as a highlighted block of Swift code, where someVar can be clicked and go to #. Currently the tag is printed and visible instead. I know it's not exactly what the syntax highlighting feature in Jekyll is for, but is it possible in any way to add links to highlighted code blocks, without manually highlighting myself? Is there perhaps some other GitHub Pages-compatible plugin that could do this?
Looking at the code, there doesn't seem to be any way to escape code formatting inside a Jekyll Rouge highlight Liquid block to either to go back out to markdown parsing, or to insert raw HTML.
Another approach would be to use JavaScript to parse the content of your HTML and substitute in a link whenever you see the corresponding tag.
More info: Replace words in the body text
I am using PHPStorm IDE and in the meanwhile I also use HTML comments for the ending tags.
I use Reformat Code by cmd+alt+L keys a lot. I am aware that the Code Style in Preference will change the code style when using Reformat Code. However, it seems that I cannot change the HTML comments which are in the same line as HTML ending tags from going to the next line when I use Reformat Code feature which is annoying.
How can I change that to have the HTML comments inline with HTML ending tags when using Reformat Code feature?
AFAIK there is no such option.
https://youtrack.jetbrains.com/issue/WEB-5070 -- star/vote/comment to get notified on progress.
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