i am building a webapp that will have notes fields all over the place, but i dont know what kind of markup i should use.
these are my requirements
User must be able to change the text style (bold, italic, underlined)
User must be able to create bullet lists
User must be able to create numbered lists
User must be able to change the font-size or use pre-definded headings
User must be able to add links
User must have a WYSIWYG - Editor that hides the actual markup
the last one is the most important requirement, my target users struggle even with word, so using markup style input like here on stackoverflow is not an option.
so what kind`s of markup do you know that fits ans has some fancy WYSIWYG - Editor?
if you think that i missed a important requirement please feel free to suggest it.
tia
You'll need to check out tinyMCE.
It's the best javascript-based WYSIWYG editor I've found.
Related
I'm not sure what this functionality or feature is technically called. I just tried asking the chat on their homepage and they suggested I try asking here to see if anyone else has done this.
We're looking to allow users to highlight text and connect a tag to that text so that it can be categorized and found in a search later on, or used in analytics. For example, if the highlighted text says, "His leadership skills were average," the user should be able to highlight that text and be offered to tag it with pre-built tags, in this case perhaps "leadership" and "neutral". That way a separate user can search for those tags later. What would this functionality be called?
Does anyone know of a ready-made plugin that allows adding input, textarea, select etc. on tinymce?
The tinymce.dom.Selection API (https://www.tiny.cloud/docs/api/tinymce.dom/tinymce.dom.selection/#select) allows you to select elements or set content in the TinyMCE editor. You can assign the API class to an action or an interaction element like a button or form, and any selected content will be replaced with the contents the API action passes in.
If that's not a good fit for what you need, is there an example of the type of adding input, a textarea, or a select you're looking for?
There are no official plugins that allow such interactive elements to be added. TinyMCE is a text editor that is built to create blog posts, articles, etc. By design, it is not a page builder. However, there may be some unofficial plugins on GitHub that may implement such features.
If you are going to insert forms and text areas that should not be edited or reconfigured afterward, you can use templates. They may come as any valid HTML. Thus, some fixed forms can be just saved as templates.
Another way is, of course, inserting HTML directly into the code.
I am using wagtail and my user wishes to be able to change font sizes in the Rich text editor. I have attempted to use TinyMCE but the install is problematic (see this question and non-answer)
Is there an alternative that would provide the functionality that I am looking for?
You'd probably consider this a non-answer too, but if a rich text editor with that feature did exist, it would be breaking the design principles of Wagtail. Wagtail is a system for capturing and presenting information, not a web design package, and mixing the two is liable to lead to all kinds of problems down the line (inconsistent styling between pages, difficulty redesigning or migrating the site in future, accessibility for screen-reader users).
The correct alternative is to find out what information your client wishes to communicate with different font sizes, and then make sure you're modelling that information in your page models. For example, if they want to include pull-quotes in their text, you can model the page content as a StreamField with a pull-quote block type (with its own text style defined by you in HTML/CSS). If they don't have any specific informational purpose in mind, and just want to play around with fonts, then gently advise them that that's your job, not theirs...
I am thinking of converting my forum input textarea exclusively to TinyMCE HTML editor. I already have both options but it is a pain maintaining both and inserting images in textarea needs preview etc...
This is more of a general question. Do you think it is safe to include HTML editor (with all the safety measures like paste only text, filter for html not allowed etc...) as the only kind of editor on a forum? It's 2011 and machines are generally fast, connection are better.
What are the downsides of using HTMl editor instead of text field? I can not imagine a blog CMS to have "normal" textarea for input.
But for some reason on forums I do not see many html editors... Even the TinyMCE site has a textarea for their editor. So is there really something to watch out for and a no go...?
I know it is more of a phylosophical question, but I guess you have experience with forums, blogs, etc...
My site is about cooking and beeing able to insert pictures (and upload them) the easy way seems to be a big plus for our home cooks ;-)
If you don't consider security (you'll need to filter the HTML input on the server side so it won't contain anything dangerous), there's only the user experience left for consideration. On a forum you write text most of the time. There's seldom any use for more functionality than bold, italics and images. The solution used here on Stack Overflow addresses this by having a very limited set of functions, and applying it in the textarea with a sane markup language.
Other forums either use old software or didn't think the improved user experience was worth the effort. The textarea-only solution fits most forums well enough since most of the input is text-only anyway.
I do think you would benefit from HTML input. Make sure that only allowed HTML can be sent though, since the user can circumvent everything on the client side.
TinyMCE uses Javascript to add functionality to an existing textarea. If Javascript is disabled, then the user will be presented with a normal textarea anyway.
I would say it's relatively safe, as long as all input from the user is validated on the server before it's used for anything.
I'm forced to use ConstantContact as a development platform for email marketing, and it offers some custom XHTML tags like <Property> and <Article>, and the documentation over at http://constantcontact.custhelp.com/cgi-bin/constantcontact.cfg/php/enduser/std_adp.php?p_faqid=2215 seems to assume that adding such a tag into your custom XHTML template will simply allow the property to be editable in the "control panel" area rather than hidden deep in the HTML code.
My client is not experienced with hunting through code to find the area that needs to be edited, so I'd like to make it easy on them and allow the text to be editable in a textarea right from the control panel. This is possible with the "Greeting" property. Can I create custom properties in ConstantContact much like the default <Greeting />, which can be edited right from the wizard?
Since I didn't see a rated answer, I figured I'd add one.
Just to clarify, Constant Contact is a crap service that skates by on name recognition and clients too ignorant to know there are better options. (No offense to your client...)
Now, to answer your question, there is no way currently (4.13.13) for you (or any developer outside of the Constant Contact fortress) to create a custom template that can be used within their WYSIWYG editor.
The only way to have a truly custom design converted into an editable template is to send Constant Contact your art files and pay them $600 to create it for you.
http://www.constantcontact.com/services/email-marketing/index.jsp#template-creation
So I feel your pain, as I've been in this exact situation.
I want to add to this as I just faced a similar problem. After spending 6 hours building an HTML and testing it via MailChimp - I prefer it 100% - I had to then port it across to Constant Contact (CC). They have an advanced editor but as the persons above mentioned, you cannot add editable areas - it looks like you need to use XHTML for that...?
However that all said, my work around was to take a template they provide that looks as close as possible to my design and then manipulate it as you get to edit the HTML for those areas. I have to say, I was able to get my email to almost 100% the same - not being able to edit the disclaimer stuff at the bottom was a pain.
The only reason I couldn't get them to move to MailChimp - a 100% superior bit of kit - was because their CRM system is tied up with CC.