I have a site where users can type posts. I want to add an some simple buttons on the side of the site that insert different symbols. The symbols dont need to be crazy like the windings font but just some basic math symbols. Also, how could I add the ability to highlight and make a selection a subscript (like Microsoft word)? Thanks.
You should consider using TinyMCE or CKEditor for your textarea. They both allow users to input custom characters (Look for the Ω - Omega symbol on the toolbar).
Those options #Thomas Li suggested are pretty neat. If they are more advanced than you want, here's a post with a similar question.
If you're asking for suggestions... I like the way TinyMCE launched that little window to let you select a symbol, but if you want just a small amount of characters, you could probably just list those as a toolbutton bar above the text, like stack overflow's formatting bar above "Your Answer".
Related
I am trying to add a menu of special characters in the wagtail editor so that users can add a menu of selected special characters to the content. What is the best way to do this? I can't find any plugins on this page either: https://wagtail.io/packages/.
Here is the official documentation on how to extend the Draftail editor. I would love to have these special characters as a standard feature, though! Following the documentation it is possible to add buttons for entities.
Using the Ace Editor pre-packaged version and trying to add some basic code highlighting (custom keywords) to the Ace JavaScript editor.
Please do not read too much into the example, it is purely an example to avoid posting sensitive data.
Keywords example: added to the keywordMapper:
"options": "settings|options|global|user";
And added some css to the page that uses it:
.ace-eclipse .ace_options {\
color: rgb(255,20,147);\
}\
I figured it would just highlight the keywrods so i can get this (without highlighting the dots):
But nothing I've tried works. I can only get the first (pre dot: '.') word to match. ".settings" wont match (you'd think it would).
The idea is that i'll implement auto complete based on the previous token, e.g. type "settings." to get a list containing "options" (and other stuff), click options and enter "." to get a list containing "global|user", another "." to show all the settings in each respective object.
I've experimented a little using the rules, but that is confusing enough, and the closest i can get is it working WITH dots being highlighted.
Any assistance is appreciated.
P.s. Had a go at the <![CDATA[ example on the ace main site and couldn't even get the code they post to work.
Its so confusing and there's hardly any documentation! I cant help but think it cant be that hard, as there are a ton of "real world users" on their site.
Thanks.
keywordMapper is only for keywords and top level identifiers. All the properties after dot are handled in https://github.com/ajaxorg/ace/blob/v1.2.6/lib/ace/mode/javascript_highlight_rules.js#L210.
so you should add another rule before it like:
{
token : "options",
regex : "settings|options|global|user"
},
You can use https://ace.c9.io/tool/mode_creator.html to experiment with the highlighter
But for autocompletion you don't really need to highlight tokens, you can just use their values, instead of types.
When one enters a question on StackOverflow, just above the text entry box is a set of Javascript buttons to do things like make text bold or italic, and to insert pictures and links.
I want to create a similar set of buttons for my own custom Content Management System (CMS). I was hoping that this would not be the kind of task that I would have to re-invent the wheel for.
However, the only set of buttons I have come across is TinyMCE, which, to say the least is incredibly feature-bloated.
I only need the ability to select text, and then have it be modified to be bold, italic, or a link, using the syntax of my CMS.
After some examination, it seems to me that paring down TinyMCE down to that level would be more difficult than writing from scratch.
Is are an existing toolbox that I can use to help me create these kinds of buttons (or perhaps a tutorial) that is ideally open source and not overly feature rich?
Note that I am not that great at Javascript programming, so while most programmers would probably assume this was easily done from scratch, I need a starting point to see how it is done.
Thank you for any advice.
These are some of the tools like TinyMce , all are open source.
Alternative to Tinymce
Does anybody know of a popup 'character map' jquery plugin? I have a text field and would like the user to be able to insert special characters (easily). Similar to the TinyMCE plugin.
One I've used and found pretty useful is Special Edit (http://www.ganzogo.com/projects/specialedit). It gives you really good control over what characters you want to appear, and is easily stylable to fit with your site.
I know they're using a jQuery plugin, but I can't seem to find which one they used. In particular, what I'm looking for is autocomplete with exactly the same functionality as SO's autocomplete, where it will perform an AJAX command with each new word typed in and allow you to select one from a dropdown.
Note that the tag editor has been completely re-written now, and no longer resembles the original, simple text box w/ suggestion drop-down that adorned the site for nearly three years.
If you're interested in the new form, see this Meta question: https://meta.stackexchange.com/questions/102510/can-i-use-the-tag-textbox-script
Autocomplete is the plugin used originally, albeit with various tweaks and customizations made to it over the years.
You might also like this one:
http://code.google.com/p/jquery-autocomplete/
Read the history here: http://code.google.com/p/jquery-autocomplete/wiki/History
Have a look at SO_Tag, a tagging system based on StackOverflows tagging system.
And Github.