I've been doing development in TWIG lately. It is an html templating language that is very simple and robust.
I've set notepad++ to automatically treat .twig files as html. This is ok, but I don't get any syntax highlighting on my twig functions.
The twig syntax is incredibly simple (by design) and would be easy to add to notepad++. The problem is, everything I find on this subject is either about creating a new language definition (and I do not want to reinvent the html definition), or modifying the color for existing syntax bits in a language.
Is there any way to copy a language definition and then modify it in notepad++? If not, is there any way in notepad++ to add extra syntax bits to an existing language definition?
edit
TWIG is an html template language/engine. they syntax for it is the same as html, with the addition of a few open/close tags (specifically {% %}, {{ }}, and {# #}) for control statements. you can read more about it at the twig website
edit #2
Based on the answer from Brian Deragon, I have been investigating 3 files. Heres what I've figured out/done so far:
\plugins\APIs\html.xml - Seems to define keywords, for autocomplete. I made a copy of the file named twig.xml
langs.model.xml - Again, a list of keywords, with all the languages in 1 XML file. I copied the HTML object and replaced the name and ext parameters with twig.
stylers.model.xml - Has a list of different items, and style information (color, bg color, font, etc) for each. I copied the HTML section and changed the name and desc parameters to twig.
Those changes done, I opened up a twig file in notepad++, hoping to see it listed in the language options. Sadly, it has not appeared, leading me to believe that some of this is hard coded (and thus what I want might not be possible).
The stylers.model.xml is interesting, though. Each entry has a bunch of items, defined like this:
<LexerType name="twig" desc="TWIG" ext="">
<WordsStyle name="DEFAULT" styleID="0" fgColor="000000" bgColor="FFFFFF" fontName="" fontStyle="1" fontSize="" />
<WordsStyle name="COMMENT" styleID="9" fgColor="008000" bgColor="FFFFFF" fontName="" fontStyle="0" fontSize="" />
<WordsStyle name="TAG" styleID="1" fgColor="0000FF" bgColor="FFFFFF" fontName="" fontStyle="0" fontSize="" />
<WordsStyle name="TAGEND" styleID="11" fgColor="0000FF" bgColor="FFFFFF" fontName="" fontStyle="0" fontSize="" />
...
</LexerType>
Those seem to be where the styles are defined for the different elements. I can't find anywhere where those elements are defined though. langs.model.xml has a definition for comment start/end, but not for any other delimiters. what I really need is a place to tell notepad++ to treat { } as a delimiter, much like it does for < > now.
edit #3
I am also looking at this list of user defined languages for notepad++ http://sourceforge.net/apps/mediawiki/notepad-plus/index.php?title=User_Defined_Language_Files
User defined languages use a different engine, but i might be able to find one in there that is similar to html enough that I can adapt it.
You should be able to just copy and edit the XML definition file (html.xml); as long as you don't need stuff beyond the basics, like code-folding, advanced coloring based off of case-handling blocks or multiple conditionals, separate formatting for lead characters, label coloring, xml-based commenting, language mixing (coloring of embedded scripts), support for coloring of duck-types, etc. If you need anything "advanced" you need to write your own lexer, in which case most of the below applies.
Even still, the templates I listed below should give you a head-start on your own language definition file.
As far as I'm aware, Notepad++ uses Scintilla Lexers for determining its code rules.
You'll have to create your own lexer, but...the HTML Scintilla Lexer is already included in the Scintilla source code.
Then you would insert your custom lexer using a plug-in, like Gary's Lua Highlighter Plugin.
Resources for building a custom lexer:
How to write a scintilla lexer
That being said, Geany is very similar to Notepad++ (based off the same engine, Scintilla), so you might want to see whether it's already been done for Geany, or whether there's an open-source project for it in the works. This would at least give you a head start.
If that doesn't help, there are IDEs and editors with Twig support built-in, like:
Eclipse
Netbeans
GEdit (which has a Windows binary, if needed)
JetBrains PhpStorm
GEdit has published their XML definition of the language here, which might help as a reference when creating your own definition file or lexer; there's also another template published by the guys from Twig here that might be of some help.
Here are the best Notepad++-specific tutorials for creating custom lexer's/User Defined Languages I can find:
User Defined Languages
How to create a user-defined language in Notepad++ based on an existing language?
If you want to get brave and build your own Scintilla dll, reference these threads, to see a guy who got it working, and to show up in the language list (use the previous/next thread message to see responses, or the thread index; it's a mailing list, so its UI isn't the best)
http://osdir.com/ml/editors.notepad++/2007-02/msg00021.html
Hope that helps or gets you at least more of a head start!
I made a Highlighter for it here:
https://github.com/Banane9/notepadplusplus-twig
Possible duplicate of this post: https://superuser.com/questions/40876/assigning-custom-extensions-to-a-languages-syntax-highlighting-in-notepad
All you need to do is add your custom extension in Settings->Style Configurator
Click on HTML and add your extension in the User Ext box.
EDIT: If you want to add more rules to your language, you might have to add another XML in notepad++->plugins->APIs
If you think it's like HTML, just copy over html.xml and save as twig.xml
Add more rules to this XML file
Related
I have a few folders of PDF files that are all related to the same subject, for instance the PDFs for Adventures in Middle-earth RPG. I like to create a tiddlywiki to use as an index to the files. I will then set up a tidder as a menu then set up tiddlers that embed an iframe to open the PDF right inside the main document.
I used the wonderful technique from here: https://stackoverflow.com/a/40561642/10221
I now set a field named "pdf" on the tiddler for each PDF to store the filename to open like this:
\define build-link()
<iframe name="" src=".\$(pdf)$" width="600" height="600" marginwidth="0" marginheight="0" frameborder="0" vspace="0" hspace="0" allowtransparency="true" scrolling="no"></iframe>
\end
<$set name=pdf value={{!!pdf}}>
<<build-link>>
</$set>
My question, is there a way that I could create a generic tiddler that I use for all the books and then pass the pdf field value into the tiddler when I open it? I'm hoping for something like [[TidderName[pdf=CoreBook.pdf]]]
That would save me from having to create a whole bunch of tiddlers, one for each book, which are almost identical. It would also let me pass in things like the page number to open since the browser lets you append things like #page=5 to advance to a specific page. Then I could do things like [[Character Creation|TidderName[pdf=CoreBook.pdf,page=27]]]
Or maybe I'm just thinking about this totally wrong. I've been using Tiddlywiki for years but I'm certainly not an advanced user.
How do I render a strikethrough (or line-through) in an adoc file?
Let's presume I want to write "That technology is -c-r-a-p- not perfect."
That technology is [line-through]#crap# not perfect.
As per Ascii Doc manual, [line-through] is deprecated. You can test here.
Comment from Dan Allen
It's important to understand that line-through is just a CSS role. Therefore, it needs support from the stylesheet in order to appear as though it is working.
If I run the following through Asciidoctor (or Asciidoctor.js):
[.line-through]#strike#
I get:
<span class="line-through">strike</span>
The default stylesheet has a rule for this:
.line-through{text-decoration:line-through}
You would need to do the same.
It is possible to customize the HTML that is generated using custom templates (Asciidoctor.js supports Jade templates). In that case, you'd override the template for inline_quoted, check for the line-through role and produce either an <s> or, preferably, a <del> instead of the span.
If you're only targeting the HTML backend, you can insert HTML code verbatim via a passthrough context. This can be done inline by wrapping the parts in +++:
That technology is +++<del>+++crap+++</del>+++ not perfect.
This won't help you for PDF, DocBook XML, or other output formats, though.
If the output is intended for HTML you can pass HTML.
The <s> HTML element renders text with a strikethrough, or a line
through it. Use the element to represent things that are no longer
relevant or no longer accurate.
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/s
To render as:
Example text.
use:
1. Pass inline:
Example +++<s>text</s>+++.
2. Pass-through macro:
Example pass:[<s>text</s>].
3. Pass block:
++++
Example <s>text</s>.
++++
I'm wondering how to make re-usable html partials with Assemble.
What I would like to do is just simply override front-matter of my new template that references the component I want. See below:
Below is my-list.hbs(references my-list.yml)
---
horiz-list: "<%= my-list %>"
---
{{> horiz-list}}
Below is horiz-list.hbs(references horiz-list.yml)
<ul class="horiz-list">
{{#each horiz-list}}
<li>{{.}}</li>
{{/each}}
</li>
Yml files are just lists of things like bananas, apples, oranges, or whatever.
I thought this would work, but it doesn't.
NOTE: The only thing I have seen about re-usable components so far is a stack-overflow that talked about extending the page using handlebars, but I couldn't find that this morning, and when I read it, it didn't seem like a straight-forward process.
Any help from the community would be much appreciated, given that assemble has some really nice features.
Thanks!
Okay, so... Trying to override data like this won't work, because it has a rigid order to how contexts are put together.
Thankfully, someone has already solved this problem for all of us.
This(below) is what I meant by "extending the page using handlebars"... It basically makes contexts in partials more flexible with data.
https://github.com/albogdano/handlebars-helper-mdpartial
There is also a node package that works with this to put keys for all the partials, and adds even more flexibility.
https://www.npmjs.org/package/assemble-partial-data
How does it Google or other search engines treat images with same source but different - translated alt attribute.
<!--on English page: example.com/en/locations -->
<img src="http://example.com/img/london.jpg" alt="nice bridge" />
<!--on German page: example.com/de/stelle -->
<img src="http://example.com/img/london.jpg" alt="schöne Brücke" />
What and which language is more relevant? Does it search engines use both alt's or...
thanks
There are no hard facts on this, but there is no reason to think that search engines would look at different language versions when analyzing a page. On each page, they take the alt attribute as the textual equivalent of the image, and it is natural that in pages in different languages, the texts are different. So search engines use for each page the alt text that it has.
On the other hand, “nice bridge” and “schöne Brücke” are rather useless for the purposes of searching, and they are not appropriate textual equivalents of any image that I can imagine.
I recently have found a strange occurrence in IE8 & FF.
The designers where using js to dynamically create some span tags for layout (they were placing rounded corner graphics on some tabs). Now the xhtml, in js, looked like this: <span class=”leftcorner” /><span class=”rightcorner” /> and worked perfectly!
As we all know dynamically rendering elements in js can be quite processor intensive so I moved the elements from js into the page source, exactly as above.
... and it didn’t work... not only didn’t it work, it crashes IE8.The fix was simple, put the close span in ie: <span class=”leftcorner”></span>
I am a bit confused by this.
Firstly as far as I am aware <span class=”leftcorner” /> is perfectly valid XHTML!
Secondly it works dynamically, but not in XHTML?!?!?
Can anyone shed any light on this or is it simply another odd occurrence of browsers?
The major browsers only support a small subset of self-closing tags. (See this answer for a complete list.)
Depending on how you were creating the elements in JS, the JavaScript engine probably created a valid element to place in the DOM.
I had similar problem with a tags in IE.
The problem was my links looked like that (it was an icon set with the css, so I didn't need the text in it:
<a href="link" class="icon edit" />
Unfortunately in IE these links were not displayed at all. They have to be in
format (leaving empty text didn't work as well so I put there). So what I did is I add an few extra JS lines to fix it as I didn't want to change all my HTML just for this browser (ps. I'm using jQuery for my JS).
if ($.browser.msie) {
$('a.icon').html(' ');
}
IE in particular does not support XHTML. That is, it will never apply proper XML parsing rules to a document - it will treat it as HTML even with proper DOCTYPE and all. XHTML is not always valid SGML, however. In some cases (such as <br/>) IE can figure it out because it's prepared to parse tagsoup, and not just valid SGML. However, in other cases, the same "tagsoup" behavior means that it won't treat /> as self-closing tag terminator.
In general, my advice is to just use HTML 4.01 Strict. That way you know exactly what to expect. And there's little point in feeding XHTML to browsers when they're treating it as HTML anyway...
See I think that one of the answers to Is writing self closing tags for elements not traditionally empty bad practice? will answer your question.
XHTML is only XHTML if it is served as application/xhtml+xml — otherwise, at least as far as browsers are concerned, it is HTML and treated as tag soup.
As a result, <span /> means "A span start tag" and not "A complete span element". (Technically it should mean "A span start tag and a greater than sign", but that is another story).
The XHTML spec tells you what you need to do to get your XHTML to parse as HTML.
One of the rules is "For non-empty elements, end tags are required". The list of elements includes a quick reference to which are empty and which are not.