"language-markup" HTML Syntax Display in Markdown - html

Trying to submit a blog entry in Markdown. The entry includes a section displaying HTML syntax. However, when I try to include it in the markdown file, the HTML is getting rendered in the page itself.
How do I get it to just display the syntax without rendering?
This is what I'm trying now:
<pre class=" language-markup"><code class=" language-markup">
<p>Blah</p>
</code>
</pre>

Related

Centered one-line python code in markdown

I am trying to center a code in markdown (used in JupyterLab). Here is the code I use
<div style="text-align:center"><span style="font-size:1em;">
`code template`
</span> </div>
But this code keeps showing ` at the beginning and end of this simple snippet. Any suggestion on solving this problem is appreciated
Markdown generally is not processed in HTML block-level elements like <div>s:
Note that Markdown formatting syntax is not processed within block-level HTML tags. E.g., you can’t use Markdown-style *emphasis* inside an HTML block.
But you can still use HTML:
<div style="text-align:center"><span style="font-size:1em;">
<code>code template</code>
</span> </div>

Display HTML from Form on a page as HTML instead of HTML Code

I'm creating a node app with mongodb.
I'm using TinyMCE in textareas for input. When I save it to the database and want to show it somewhere on a page, I see the HTML Code (<p>This is a paragraph</p>) instead of the actual rendered HTML.
When I console.log() the item from the ejs file I get this:
<p>Hello</p>
<p>I was here:</p>
<p>Link</p>
But when I look into the source code of the page I see this:
<p>I was here:</p>
<p>Link</p>
Any ideas?
So here is the solution:
In ejs there is the <%- for unescaped values, which I forgot.
https://ejs.co/#docs

How to generate unrendered HTML elements on web page with Angular 2.1.1 like stackoverflow?

What I am trying to do:
I am attempting to create a web page with Angular2 which shows HTML on the screen in much the same way many websites do such as stackoverflow, css-tricks, and and w3schools (to name a few). I would like to be able to copy the code and paste it somewhere else after its shown on screen.
What I know:
I have come to realize that it will probably be necessary to convert all of my opening tags ( i.e., < ) to &lt and to convert all of my closing tags ( i.e., > ) to &gt, however I am still not sure what the best way to interpolate some variables into the template.
For example, I have this in my template file:
<div>{{myTitle}}</div>
<div><p>{{mySubTitle}}</p></div>
<div>
<ul>
<li>{{item1}}</li>
<li>{{item2}}</li>
<li>{{item3}}</li>
</ul>
</div>
What I want to see (and be able to copy) in the browser:
<div>This is my title</div>
<div><p>This is my subtitle</p></div>
<div>
<ul>
<li>Apple</li>
<li>Orange</li>
<li>Durian</li>
</ul>
</div>
Stack overflow makes this really easy and nice to accomplish by letting you highlight the code you want to display on screen and clicking the {} button in the editor. However, when I try using the <pre> and <code> tags in my Angular2 app, I do not get the same result, I cannot see the actual HTML elements like <div> and <li>.
Instead what I see is:
{{myTitle}}
{{mySubTitle}}
{{item1}}
{{item2}}
{{item3}}
I have used handlebarsjs in the past and am familiar with that library but I was under the impression that using Angular2 would eliminate the need for handlebarsjs. Does anyone know how to accomplish what I am trying to do in Angular2 without handlebarsjs?
For < and > you'll probably need to use &lt and &gt.
For the braces in template expressions you may want to use ngNonBindable directive.
<div ngNonBindable> {{myTitle}} </div>
Use <pre> or <code> for HTML to become rendered verbatim.
<pre ngNonBindable>
<div>{{'{{'}}myTitle{{'}}'}}</div>
<div><p>{{'{{'}}mySubTitle{{'{{'}}</p></div>
<div>
<ul>
<li>{{'{{'}}item1{{'{{'}}</li>
<li>{{'{{'}}item2{{'{{'}}</li>
<li>{{'{{'}}item3{{'{{'}}</li>
</ul>
</div>
</pre>
You need to escape { and } (for example like shown above)

safe option in django templates

I am trying to print a html tag in django template using safe option in django templates.
I am using it like below.
{{ message|safe }}
It works fine as long as I have only one tag ,
for example If I have to print below, it works fine.
<div class="message">data</div>
But If I have another tag inside div , it is not generated as raw html, rather it is generated as below.
<div class="message"><img src="/media//uploads/Capture_16.PNG" /></div>
I would like it to be generated as
<div class="message"><img src="/media//uploads/Capture_16.PNG" /></div>
What options do I have to achieve this ?
EDIT
Below is the original message without using safeor any kind of escaping.
<div class="message">data</div>
<div class="message">&lt;img src=&quot;/media//uploads/Capture_16.PNG&quot; /&gt;</div>

HTML attribute encoding

I have an .cshtml page with the following HTML in it:
<div class="content rowBody">
<span class="rowText" title="#description">
#description
</span>
</div>
If the value of #description is: <img src=x onerror=alert(/XSS/.source)>
I see it showing up just like this in the title attribute and therefore executing, while the one in between the span tag appears to be encoded and does not trigger the alert box.
My assumption was that the Razor engine view attempts to encode anything preceded by the #. Does this not apply to HTML attributes?
Generated source:
<div style="margin-left: 31px;" class="content rowBody unselectable" unselectable="on">
<span class="rowText unselectable" title="<img src=x onerror=alert(/XSS/.source)>" unselectable="on">
<img src=x onerror=alert(/XSS/.source)>
</span>
</div>
It looks like what you're seeing here is different encoding based on the context. The required output encoding for HTML tags is different to HTML attributes as it is different for JavaScript and different again for CSS.
Having said that, I couldn't reproduce this behaviour with a clean MVC4 project. What version are you using?