I was wondering how to create word processor buttons in html such as:A Bold Button,An Italic button and text size increase button.(THEY DON'T HAVE TO BE PRETTY) any ideas would be GREATLY APPRECIATED! THANKS!
You won't be able to achieve this with HTML alone. This sounds like a job for javascript. What you are looking for is called a rich text box, and there are a few decent open-source options around. You should consider using these before building one from scratch. For instance, WordPress uses TinyMCE: http://www.tinymce.com/ . It is definitely worth a look.
Related
Hi I have a requirement in which user will be able to write a Document like a contract.
User should be able to write in Block letters, use underline options and do some indentation while writing his/her document.
I am using ReactJS for the development.
I am not sure how we can achieve it using a text area or form.
Any help is highly appreciated.
Looks like you need to use a WYSIWYG (what you see is what you get) editors.
react-dragt-wysiwyg is a good example.
You might need to do some research to figure out
which editor fits your requirements
relatively easy to integrate into your system
doesn't slow down your site
looks reliable, i.e. the original authors are likely to keep supporting it
Is there a way to limit content editors on sites to just text? I would like to have them not inject any styles by using inline styling in HTML, or using any buttons in the editor.
I have a few rogue editors that go color and style crazy, and for the next iteration of the public facing site I run, I don't want any chance of that happening.
Thanks all!
There are a couple options I've used in the past - neither is ideal but they may help you.
You can disable features from the rich text editor. Read through this article - it should apply to SP 2013 the same but basically, you can disable color, font, etc from being applied in the RTE.
You can use jquery to remove all styles after the fact. $("#element").removeAttr("style");
I don't think you can accomplish this limitation using a content editor. According to Microsoft, content editor's are designed for HTML so any setting to disable HTML input would be counter intuitive.
http://office.microsoft.com/en-us/windows-sharepoint-services-help/about-the-content-editor-web-part-HA001160897.aspx
"The Content Editor Web Part is intended for adding HTML content to a Web Part Page"
I'm not sure from your post what you are trying to accomplish holistically, or what business need these content editors solve. Could you build a static page/template that fits your need (and maybe even looks like the normal content editor) but utilizes the rich text box feature?
using rich textbox in Sharepoint 2013
I'd like to use tooltips with the same design as the error/validation tooltips (rounded box with a tip pointing to the mouse's position).
Given the name "error/validation tooltips", it bothers me to use them as normal tooltips.I haven't found people having the same "principles" issue as myself..
So, is it that bad to use the error/validation tooltips as normal tooltips? And, if yes, what would be the easiest way to re-use its design without rewriting much code?
Hope it's clear enough :) And that you will be able to enlighten me somehow in this matter :)
Regards.
BS_C3
Good or Bad is subjective based on what you're trying to do and the design of your app. There is never a right a wrong answer to stuff like that.
To reuse that design, you have two options that I see.
The first is to set the styleName of your toolTip component to errorTip.
The second is open up the default.css in the Flex Framework directory and copy and paste the CSS for the errorTip into your own CSS file that you then use in your application.
These docs will be good reading on this issue.
Suppose you're developing a web site and blind users will be a significant chunk of your target market. If the web site includes document editing functionality, what would be appropriate WYSIWYM tools? Are languages like Markdown, Textile and Wiki Formatting really accessible or are they inconvenient to blind users?
I'm a blind programmer and while I haven't used most of the languages you mention I've found that any markdown language is fairly easy to use if you have the desire to learn it. I've had no problem using either HTML or several markup languages for wiki's. Part of it will depend on how invested the users are in your site. If it's a site that will be visited infrequently or for short periods of time, it's much less likely that a user will take the time to learn the required markup whether they are blind or not. Unfortunately, I have not found an accessible JavaScript WYSIWYG editor but I find it easier to manually enter the markup so haven't looked very hard.
the first question is: how important is semantic structure? could you get away with plain text. You could do simple parsing like treating blank lines as paragraph markers, treating a series of lines which begin with * as a bulleted list, identify URLs and make them into links, etc.
As a blind developer myself, I have no problem in understanding languages like Markdown. But if it's a syntax I'm unfamiliar with, I'll only learn it if I expect to use the site very often, or care deeply about the content.
Two final thoughts come to mind: while I certainly experience some accessibility challenges using TinyMCE, you could develop something much simpler - provide less than 10 formatting options, like inserting hyperlinks, making lists, centering text, setting the style (such as heading) etc.
And lastly, when I talk to non-technical blind people, they often just write their content in Word and paste into a wiki or blog post. This sounded strange when I first heard it, but it does make sense. So an ideal solution would accept pasted in content.
In closing - it depends how important this is, and how much effort you want to expend. Maybe a Markdown editor with a live preview (like on this site), buttons for inserting simple formatting like URLs, and the ability to paste in rich text would tick all boxes :-)
On a web page, the most accessible embedded text editor for blind users is one that uses standard HTML, such as a <textarea> element, with a corresponding <label> element:
<label for="editor">Enter your text here using wiki markup:</label>
<textarea id="editor"></textarea>
If a WYSIWYM tool is built using standard accessible HTML, then blind users can easily enter text into it, with full confidence that they're entering text in the right place. Then the question becomes: Which is the better markup language? They all require memorization, but some may be more intuitive than others. One way to find out which is best would be to do some usability testing with a wide variety of target users. Also be sure to providing easy, accessible access to syntax help.
Picture yourself working in pure text 80x4 display (just open a console and resize appropriately), then use vi/emacs/ed and you'll soon realize what markup will get in the way.
Try to do as much work as possible to understand plain text, else use light markup like POD, finally things like AsciiDoc are very powerful but needs training.
I don't know about WYSIWYG/WYSIWYM tools, but I do know that complying with W3C standards (especially their HTML5 en CSS3 drafts) while writing your own editor code will help a lot.
In CSS you can specify speed and intonation of speech. In HTML you can specify alternative text (alt attribute in many elements) that screen readers are compatible with. Be sure to know when to use the abbr and the acronym elements. Use the former when you want the screen reader to read the meaning of an abbreviation and the latter when the acronym should be read as a word (e.g. ASAP, NATO and OS).
For the editor itself, I recommend creating a WYSIWYG editor that uses divs and spans. Screen readers will understand easily the structure of a document. For the current line, use a text box; for every other line that's not being edited, convert the contents immediately to valid HTML.
If you find a good tool, be sure to post it here. I'm looking for one too. :-)
Here's what I'm trying to do. I'm looking for a WYSIWYG editor or just a plain text-box that will highlight HTML syntax (in ASP.NET). Basically, we have a CMS that allows you to mess with templates for various pages, but right now all of the editable HTML is in a plain, ugly, text box. Does anyone know of an editor that will highlight the synax and allow you to edit it? I've checked out Antipro SyntaxEditor, which seems to be a good highlighting solution, but it's just a highlighter, and not an editor.
Thanks!
You may need to combine tools. For example, SO combines Markdown with Google Prettify which handles the actual syntax highlighting.
Another option is CKeditor and they offer open source licensing.
I use FreeTextBox on my dasBlog site. It seems to work pretty well and has the capabilities you're asking for.
Update
Hmm... the version on my own site has a button the toolbar to do syntax highlighting, but that button isn't shown on any the demos available at the link I have gave you. Just know that it does work, but that you may have to play with the configuration some to get that working.