I thought it's possible to write pure HTML as input in Jade files but I get an error while trying.
For this HTML
div(ng-controller="TestController")
h1 Services list
ul(ng-model="test")
li(ng-repeat="item in items")
a
| {{ item.name }}
div(ui-view)
I get the following error
Running "watch" task
Waiting...
>> File "app/frontend/views/home.jade" changed.
Running "jade:compile" (jade) task
>> Error: app/frontend/views/home.jade:2
>> 1| <b>hello </b> test
>> > 2| <ul ng-model="test">
>>
>> unexpected token "indent"
Warning: Jade failed to compile "app/frontend/views/home.jade".
>> Destination not written because compiled files were empty.
>> 5 files created.
Running "watch" task
Waiting...
apparently by starting with a pipe | this should work
| Plain text can include <strong>html</strong>
p
| It must always be on its own line
jade-lang.com/reference/plain-text
Outputting plain text should look like this:
pre
<div>Stuff</div>
Instead of just writing plain HTML code into the .jade file(s) you'll need to use the Jade syntax for HTML files:
doctype html
html(lang="en")
head
title= pageTitle
script(type='text/javascript').
if (foo) {
bar(1 + 5)
}
body
h1 Jade - node template engine
#container.col
if youAreUsingJade
p You are amazing
else
p Get on it!
p.
Jade is a terse and simple
templating language with a
strong focus on performance
and powerful features.
Edit:
To use plain HTML tags within Jade you basically got 2 possibilities:
p Plain text can include <strong>html</strong>
or | Plain text can include <strong>html</strong>
p
| It must always be on its own line
You can check on further details here: http://jade-lang.com/reference/plain-text/
Related
I would like to display /home/<user>/file as inline code within a free wordpress.com blog, which supports PHP Markdown Extra. However when I write
A **text** mentioning a `/home/<user>/file` path
in markdown, the <user> part disappears from the generated HTML blog post. This seems to be wordpress.com specific, because it doesn't happen here on SO.
More specifically, it just happens when I write
inline code outside of a table or
a code block without a language annotation.
However, the following is ok (<user> appears in HTML):
inline code within a table
| Item | Note |
|:-----------|:-----|
| `<user>` | ok |
writing a code block
``html (with 3 backticks)
A **text** mentioning a `/home/<user>/file` path
``
with a language annotation.
I tried the usual escape variants like
\<user\> and <user>, but they appear wrongly/literally in HTML.
So, how do I write angle brackets within inline code in markdown for WordPress?
GitHub Pages Jekyll use Pygments by default to render syntax highlighting for code blocks. But I prefer an easier alternative highlight.js to do the job because I only need to indent 4 spaces to mark code blocks in the markdown source files.
However, my R code are all mistakenly interpreted as php or perl or makefile or other type of code by highlight.js, and I want to manually mark the code block by
```r
(some r code)
```
instead. But when I use this, the first line of the code block always appears to be a blank line. I view the HTML source code produced by the 4-space mark, it is like
<pre><code>x <- rnorm(100)
y <- 2*x + rnorm(100)
lm(formula=y~x)
</code></pre>
which does not suffer from this problem.
How can I eliminate the blank line in the first line of the code block?
I face the same issue today when I change my highlighter to highlight.js.
With the help from others, I finally git rid of this blank line, and willing to share the solution. Basically, the whitespace inside <pre> is not trimmed, and be treated as a newline in the rendered page (you can use firebug extension of Firefox enabled with show whitespace to observe the extra line).
Then the solution is obvious.
put pre and code tags at the same line with your actual code. like this:
<pre><code class="css">#font-face {
font-family: Chunkfive; src: url('Chunkfive.otf');
}
or using solution provided by mhulse to make your raw post more readable
<pre><code
>line of code
Here and ...
Here
</code></pre>
Write your own js code to trim L/R whitespace(s) of your content before it be put in <pre>
For more details, check this page.
This Markdown code:
# Introduction
Turns into this HTML code when compiled with Pandoc:
<h1 id="introduction">Introduction</h1>
The way I use Markdown:
Generate HTML document
Edit it in MS Word to add page numbering
HTML version goes to blog, MS Word version goes to uni submissions
In CSS I can override link colors if they are inside H# tags, but MS Word has problems interpreting hierarchy of CSS overrides... and ends up with wrong colors anyway.
Is there a way to generate HTML without headings being wrapped in anchor tags, like below?
<h1 id="introduction">Introduction</h1>
In case there is no solution, here is a little PHP script I wrote to remove tags from headings that must be run on the resulting HTML file:
<?php
// Usage: php cleanheadings.php myhtmlfile.html
// Check that arguments were supplied
if(!isset($argv[1])) die('No input file, exiting');
// Load file
$content = file_get_contents($argv[1]);
// Cut out the <a> tag
$heading = '/(<h[123456] id="[\w-0-9]+">)(<a href="#[\w-0-9]+">)(.+)(<\/a>)(<\/h[123456])/mu';
$clean = '$1$3$5';
$cleanhtml = preg_replace($heading,$clean,$content);
// Write changes back to file
file_put_contents($argv[1], $cleanhtml);
?>
I'm using Redcarpet as a Markdown renderer and I would like to be able to display html or any text with < and > without it to be parsed.
Here is an illustration of what should happen:
The user types
I *want* to write <code>
The source of this comment when sent back by the server should be
I <em>want</em> to write <code>
Problem is since the renderer outputs escaped html when parsing the Markdown, I get:
I <em>want</em> to write <code>
Therefore I can't distinguish between the html that people send to the server and the html that is generated by the Redcarpet renderer. If I do a .html_safe on this, my markdown will be interpreted but the user-inputted html too, which shouldn't.
Any idea on how to fix this?
Note that the idea would be to display (but not parse) user-inputted html even if the user didn't use the backticks ` as expected with markdown.
Here is the relevant bit of code :
# this is our markdown helper used in our views
def markdown(text, options=nil)
options = [:no_intra_emphasis => true, ...]
renderer = MarkdownRenderer.new(:filter_html => false, ...)
markdown = Redcarpet::Markdown.new(renderer, *options)
markdown.render(text).html_safe
end
If I understand you correctly you just want <code> as normal text and not as an HTML element.
For that you need to escape the < and > with a backslash:
I *want* to write \<code\>
I'm searching for a tool that would allow me to check whether a certain snippet of HTML would be valid in it's proper context.
I'd input something like
<dd>
my definition
<div>
div inside <dd> is allowed
</div>
</dd>
instead of the whole document. A ordinary validator will complain about the missing dl-tag, but most of the times I just want to know whether a certain element is valid inside another one or not.
I'll try to explain it more detailed. Consider the following snippet:
<form>
<label>Name: <input /></label>
</form>
Would be valid, but to check it I have two options:
Validate the whole document: Most of the times this is good enough, but sometimes when I'm working on partial HTML snippets or embedded HTML it's quite some trouble. I'd have to copy the whole thing to a new HTML document and validate that.
Just copy the snippet and validate it with the W3C validator and ignore some of the errors.
Basically I'd like to check, whether an element contains only elements it's allowed to contain.
You can actually use the W3C validator to check a snippet.
Choose the 'Validate by Direct Input' tab and select More Options. In there there is a radio button to 'Validate HTML fragment'. http://validator.w3.org/#validate_by_input+with_options
It will wrap your page in valid html so the errors which you see are only due to your snippet.
W3C does currently (May 2020) have a fragment validator, but it seems to have bitrot (no HTML5, at least). Here's a couple of simple scripts that attach a header and a footer to your fragment, and run the result through a local copy of the Nu checker. The fragment can be anything which is valid at the top level of a <body> tag - modify the header and footer if you need something else.
validate1.sh takes a single filename argument and checks it, while validate2.sh cycles through all HTML files in a directory. It has a simple exclusion list mechanism which you'll need to change. You'll need to modify both to point to your copy of vnu.jar.
validate1.sh:
#!/bin/bash
#
# validate1.sh
#
# Run the nu validator on the HTML fragment in the supplied filename.
# This script adds a header and trailer around the fragment, and supplies
# the result to 'vnu.jar'. You'll need to modify it to correctly locate
# vnu.jar.
if test "$#" -ne 1; then
echo "Usage: '$0 fname', where 'fname' is the HTML file to be linted"
exit 1
fi
var="<!doctype html>
<html lang=\"en\">
<head>
<title>foo</title>
</head>
<body>
$(< "$1")
</body>
</html>"
echo "Checking '$1'... subtract 6 from any reported line numbers"
echo "$var" | java -jar vnu.jar -
validate2.sh:
#!/bin/bash
#
# validate2.sh
#
# Run the nu validator on the HTML fragments in the supplied directory. This
# script adds a header and footer around each fragment in the directory, and
# supplies the result to 'vnu.jar'. You'll need to modify it to correctly
# locate vnu.jar.
if test "$#" -ne 1; then
echo "Usage: '$0 fname', where 'fname' is the HTML directory to be linted"
exit 1
fi
for filename in $1/*.html; do
case $filename in
# simple exclusion list example:
"$1/root.html" | "$1/sitedown.html")
echo "Skipping '$filename'"
continue
;;
*)
;;
esac
var="<!doctype html>
<html lang=\"en\">
<head>
<title>foo</title>
</head>
<body>
$(< "$filename")
</body>
</html>"
echo "Checking '$filename'... subtract 6 from any reported line numbers"
echo "$var" | java -jar vnu.jar -
done