How to make a word underline in Markdown?
For example: bold = **bold** or __bold__, italic = *Italic* or _Italic_.
I have tried with 2 and 3 underscores, but it is not working. Also tried by taking the reference of markdown-it.js.
In Jupyter notebook, you can use the following to get underscored text
<u>underscored text </u>
since markdown is a markup language and In fact you can use HTML/CSS inside it, the easiest way I've found so far is:
text here <span style="text-decoration: underline">underlined text</span> other text
Note: you can still use markdown syntax inside the <span> tag.
you can just use HTML markups in mark down.
if you want to underline, italic or strong, use follows,
<u> this is underlined </u>
<i> this is italic </i>
<strong> this is strong </strong>
etc..
Using a plugin (markdown-it-ins)
You can use ++Underlined Text++ to make text underlined in markdown-it.js. Bear in mind that this is not standard markdown and might not work elsewhere. Here's a demonstration of this working in the markdown-it website.
This syntactic extension (inserted text) is added by a plugincalled markdown-it-ins. It's enabled by default in the demo page, but you might need to install and enable it manually for your own page.
Using HTML tags inside markdown
If you want this to work for any markdown parser, you should try using the <u> HTML tag, as most parsers will actually parse HTML inside markdown (this might cause a few unwanted side-effects). markdown-it supports it, if you enable the related option. Here's an example of this in action.
Just to complement on the answers, if you happen to be using Atom for the markdown, ++this++ won't work (unless perhaps if you install any package for that), but <u>this</u> will.
I have:
output:
pdf_document:
latex_engine: xelatex
keep_tex: true
in-line, outside of chunk:
\underline{Text to Underline}
and it works just fine!
I was actually looking for a workaround and though the use of a <u> HTML tag can be regularly interpreted by a Markdown parser, I changed my point of view and understood that I could do without it.
After all, Markdown is all about simplifying the documentation and levelling it out so that every document could be equally read.
i.e. if I want to use Markdown I'll stick to its principles.
By the way, this answer has been formatted with the help of Markdown itself ;-)
Related
I'm trying to have a textarea input field just like when you post a new StackOverflow question. You can have line spaces, you can bold text, you can insert link etc.
However, when you push some kind of button, all of that gets translated into a long HTML string (e.g., spaces become <p> or <br>, bold becomes <strong>, link becomes <a>). Is there a way to do this with some kind of JS plug in?
What you describe is a What You See Is What You Get (WYSIWYG) editor.
Google "WYSIWYG editor library"
Examples:
https://prosemirror.net/
https://www.tinymce.com/
This question has been answered here Rendering HTML inside textarea
What you need is WYSIWYG (What you see is what you get) editor.
There are a lot of them.
You can check out these:
Ckeditor The best web editor for everyone
TinyMCE Full featured web editing
They are very easy to use.
If I have understood what you are asking, you will need to learn regular expressions. Everything is the context is based on text replacement.
Example: because textarea does not display hyperlinks, buttons, i can do somethings like in stackoverflow.
For hyperlink, i can write something link [# http://facebook.com] or [link]http://facebook.com [link];
later, I extract the http://facebook.com and wrap it between <a></a> elements.
What everybody above said is true, you want to be looking at a WISYWG editor.
If by chance you are using Bootstrap, you may want to look at Summernote.
I have no affiliation with them, but I used it for one of my projects and was very pleased.
If I have a google doc with styling (bold, underline, etc), is there a way to parse the formatting with Javascript? I am trying to make an extremely simple WYSWIG -> HTML formatter, and easily was able to substitute whitespace with HTML, but am having a harder time with formatting.
TL/DR: If I copy and paste from a Google Doc to a textarea, can I use Javascript to see what the formatting was?
Instead of using a textbox, which will remove all formatting, you can use HTML5's contenteditable property.
<div id="editable" contenteditable="true">
edit me
</div>
If you paste something into that box, it will preserve formatting. Now you can use jQuery's .html() to get the HTML of the container.
$("#editable").html()
Demo
I'm using prettify for color coding but my code is still flat and not indented correctly, how do I format it so it looks similar to github gist or pastebin? (I'm aware you can embed from these sites but it doesn't look very professional).
If your code is flat, you will need to rewrite it - as in github. Maybe you could even find an autoformatter, but it will be as language-dependent as the highlighter.
If your code is only displayed flat, you might need a <pre> tag around it or set the css property white-space:pre to the surrounding element.
I would use gist.github.com. It looks petty professorial. If still want only CSS and you are on ruby CodeRay.
Depending on your needs, CodeMirror's automatic formatting might suit.
With their formatting extension, you can just do:
editor.autoFormatRange(from, to);
Here's a demo of it in action.
You'd also get the ability to edit your code snippets - and if you don't want that, you can turn it off with the editor.readOnly() function.
Here is what I would do, your welcome to go about it differently:
I would write my code in an editor, (like Notepad++, because it's ultra awesome).
I would make sure my code was formatted the way I wanted.
I would highlight the area of code I wanted and copy it.
I would then switch to the "html" tab in my Wordpress post editor.
I would type out an opening and closing <pre> tag. If I were using prettify I would type in <pre class="prettyprint"></pre>
I would paste my code between the opening and closing <pre> tags I just created.
I am new to TinyMCE. I wanted to customize the HTML generated by the Rich Text Editor (RTE) to be saved with tags without 'style' attribute.
For example, here is what I want to achieve:-
If i change the font of text in RTE to color red (#ff0000), the HTML generated is:-
<p><font style="color: #ff0000;">Some text to format</font></p>
But I want the HTML to be stored as :-
<p><font color="#ff0000">Some text to format</font></p>
I am aware that <font> tag is deprecated, but I need to render this HTML in a Flex application which supports naive HTML.
I tried the following configuration:-
inline_styles : true
I also tried setting it to false, just in case I was comprehending the semantic, opposite.
But no success so far.
Any pointers shall be appreciated.
Thanks,
Mangirish
TinyMCE tries to stay away from deprecated things (at least it did when I was a little more engaged in it, many months ago), so you may expect a lot of troubles.
The option inline_styles (when set to false) is expected to do what you want, so it may be a bug. You may ask about this problem on their forums. (The main creator of TinyMCE, Spocke, is a friendly man, who often answers this type of questions.) Just be sure to show them the full configuration you have.
Is there any JS function that can change the color of certain text in a textarea?
For example, blar blar {blar} blar, {blar}, including { }, will be in blue. Other words will be in blank. In other words, all I need is a function that can change color of all text in { }.
I've done some studies and it seems that most people say it can't be done. But I'm seeing rich text editors or those wysiwyg editors having the ability to bold or underline words. There must be a way to do it.
Any suggestion is welcome.
No one mentioned contentEditable?
Just make a contentEditable div and use javascript to style it.
I reccommend you to look into the Dojo Toolkit's.
It has a Editor widget.
Other resources:
Some contentEditable problems in IE.
How to use contentEditable with jQuery or without it.
wysiwig-editors are using iframes instead of textareas. Textareas are very little customizable, since what you're after is changing part of the content. You can't add tags inside a textarea, which makes it impossible to only change part of the text.
If you look at the editor here in SO, you write normal text inside a textarea, and it is then transformed in the box below it, so you'll see the asterix inside the textbox, but in the box below, it'll transform special characters by regexing them with tags.
If you're using firebug, you can start writing inside the editor, while looking at the HTML in the preview-box.
you can't use a textarea to do that, per se.
But, javascript is your friend. Perhaps you should take a look at the code of a few rich text editors.
You could start with lwrte, since it says its "lightweight". Also, its written in jquery so it will be pretty easy to undertand. (and I'm a jquery fanboy).
Hope that helps,
jrh
I Think You will need to use execCommand method of javascript it controls many thing such this stuff of changing specifc textcolor
Regards
But some Jquery WYSIWYG editors do this ! How is that possible ? See this editor lwrte