I want to display code characters on an HTML page. But no matter what I try it always renders HTML characters. pre or code doesn't work. How can I do this?
-
2"code characters"? can you be more specific?Rubens Farias– Rubens Farias2009-11-18 13:58:37 +00:00Commented Nov 18, 2009 at 13:58
Add a comment
|
9 Answers
The <xmp> tag doesn't require the contents to be escaped.
eg:
<xmp>
<p>Blah </p>
</xmp>
...will look like this on your screen:
<p>Blah </p>
2 Comments
bluish
+1 It's deprecated, but it's so easy to use.. Expecially for test/debug purposes it's the best way, I think. Hope it will be valid again!!
Lye Heng Foo
Better to use the solution suggested by weeger below, i.e. to use PHP htmlentities().
You need to use character references instead of the plain characters themselves:
<code><HTML></code>
The elements code and pre are just to mark the content as code or preformated.
Comments
By escaping them.
& will print &
< will print >
You didn't mention what you're using to generate the html, if you're manually editing, some editors have options to escape a selection. If you're using a language, look for some function that escapes html special characters. (google for how to escape html in language-name-here)
Comments
Since tag is now depreciated : https://developer.mozilla.org/en-US/docs/Web/HTML/Element/xmp
You can use PHP to convert HTML tags :
<code>
<?php print htmlentities('<p>Blah</p>'); ?>
</code>
Comments
Look for an HTML encode function in your language.
string s = HtmlEncode(myInput);
response.write(s)
or similar
answered Nov 18, 2009 at 14:03
No Refunds No Returns
8,4464 gold badges36 silver badges44 bronze badges
Comments
To display HTML tags within a browser, you can surround the output with
<xmp><p>HTML<p></xmp> tags
This is the easy way to fix this problem. but this tag already deprecated.
for more details : xmp
You can use htmlentities.But you can't use this inside the JavaScript file. because JavaScript runs in the user's browser. PHP runs on the server.
<code>
<?php print htmlentities('<p>HTML</p>');?>
</code>
answered Sep 21, 2022 at 8:02
Poorna Senani Gamage
1,2682 gold badges20 silver badges32 bronze badges
Comments
So I am displaying vue code in html content block with this. wrap the the code I want o display twice. for example:
<pre>
<xmp>
<template> <h1>{{ title }}</h1></template>
<script>
export default {
name: 'App',
data(){
return {
title: 'My First Vue app :) '
}
}
}
</script>
<xmp>
</pre>
The example here
Comments
Download tinymce From
https://www.tinymce.com/download/
<html>
<head>
<script src='tinymce/js/tinymce.min.js'></script>
<script>
tinymce.init({
selector: '#myTextarea',
height: 300,
width:800,
theme: 'modern',
plugins: [
'advlist autolink lists link image charmap print preview hr anchor pagebreak',
'searchreplace wordcount visualblocks visualchars code fullscreen',
'insertdatetime media nonbreaking save table contextmenu directionality',
'emoticons template paste textcolor colorpicker textpattern imagetools'
],
toolbar1: 'insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image',
toolbar2: 'print preview media | forecolor backcolor emoticons',
image_advtab: true
});
</script>
</head>
<body>
<textarea name="myTextarea" id="myTextarea" rows="4" cols="50">Hello Ashish</textarea>
<input type='submit' value='save'/>
</body>
</html>
Comments
try wrapping HTML content in <textarea></textarea> For ex: <pre> <textarea> <html> </html> </textarea> </pre> Works in awesome way. You don't have to use obsolete <XMP> example tag. <textarea> tag will wrap the content in text area. Try out !
