This is a question which partly stems from my lack of linguistic understanding of Arabic and other RTL languages.
I'm working on a Sitecore site which now requires localisation for RTL languages. The specification states that all text elements should be right aligned, and of course the dir="rtl" attribute applied.
However, what I can't readily find out is whether the Sitecore Content Editor (not just the WYSIWYG control, but all input fields) should be switched to RTL and how to do this. Creating an Arabic version of an existing item does not change input fields to RTL.
Thanks!
The Rich Text Editor will automatically switch to RTL in the editor and any text entered will be right aligned, but the input boxes and other controls will not. You can still enter arabic text in those controls but it will simply be left aligned. As long as your front-end code has the correct RTL tag set then it will render to the end user correctly.
Also remember you have the Page Editor at your disposal and you should build your site with this in mind, using the Page Editor even the simple text fields will be RTL.
Currently the Sitecore Client doesn't support RTL.
If you are worried about that you will have invalid data on the front end - don't worry. RTL just changes the flow of the text and will have no impact on how your content editors enter their content. You can see what I mean here - http://jsfiddle.net/dgtbw4m5/2/
<label for="rtlInput">RTL Input:</label>
<input type="text" id="rtlInput" dir="rtl" />
<br/>
<label for="ltrInput">LTR Input:</label>
<input type="text" id="ltrInput" />
Test the two inputs and you will see it won`t make much difference for the content editor as the only thing changing is the text flow is a different direction. The value remains the same.
when content is mixed with any RTL Language and English, the content got messed up with different order. Because, English locale by default Left to right. To avoid that follow the "dir" tag for English content.
Use span tag surrounded English work with dir="RTL" < span dir = "RTL" > English < / span >
أواجه مشك**English**ال محتوى ممزوج باللغتين الإنجليزية والعربية.
Related
Unity texts have that feature where certain HTML-style tags can be used to format text, like <b></b> for bold and <color=#ff0000></color> for colored text. Sometimes I see some Unity games display user-provided text (like a nickname or a chat message) and they are not escaped, which means the formatting tags get applied if the user types in those tags. Asking for those devs (I don't dev myself), what's the best/easiest way to escape those tags? Are there built-in functions for that, or should they write/import a new function?
Edit: Yes I did look up "C# HTML escaping" and found a function that escapes < into <, but Unity doesn't render < as < and I got <color=#ff0000> nonsense in the Unity scene. Yes I do realize there is a tick box that disables rich text but there is also a use case where, for example, you actually want to use user-provided text within a rich text context.
Both Text and TMP_Text (TextMeshPro and TextMeshProUGui) have according field Rich Text in the Inspector or via code it is Text.supportRichtText and TMP_Text.richText. By default they come enabled.
Yes I do realize there is a tick box that disables rich text but there is also a use case where, for example, you actually want to use user-provided text within a rich text context.
So quite simple
Enable this option in use cases where you want to allow that rich text tags change the format
Disable this option if you do not want it.
As said you can even switch this on runtime via code when needed.
If you want to further prevent your users from being able to putting certain symbols into input fields at all use the according input type and input validation settings (see e.g. InputField)
I want to write text on the right side of an image in GitHub .md file. I mean image should be displayed on the left side of the text (text including heading, list, para and links). I know I can do it using HTML or CSS using flex or so but is it possible to do it using GitHub markdown? And is it also possible for the text to be vertically aligned with respect to image size?
Markdown doesn't provide a set of rules or syntax for how the text is to be displayed, other than allowing HTML elements with CSS. That's because Markdown, like HTML, is a markup language, and presentation is supposed to be done outside of it at a separate level (usually CSS).
However, for a variety of reasons, including security, aesthetics, and accessibility, GitHub strips out all CSS when it's rendering HTML from a README or other text document, so there isn't a way to do what you want.
Unfortunately the accepted answer is wrong. It is possible.
Github-Markdown:
<img align="left" width="200" src="https://www.rd.com/wp-content/uploads/2018/02/25_Hilarious-Photos-that-Will-Get-You-Through-the-Week_280228817_Doty911.jpg" />
# Headline
Some text
Rendered result on Github:
For the sake of completeness:
See also this answer: GitHub Pages: How can I wrap text around an image?
For angular material placeholder becomes a label when we enter value in the input control.
I am using my form for both view and edit mode. When in view mode I just disable the form so user can't edit it (based upon the user role and API takes care of it too)
However it looks pretty odd looking at control with placeholder text on it. Is there any CSS trick so that I can make placeholder value to be a label of that control and have the input shown as blank field (so it looks like no value is available for this control and placeholder actually becomes a label on the top)
Please advise
OK, I seems like my questions was not clear enough.
I found the solution and was pretty easy.
I used "floatLabel" attribute of mat-form-field and made is dynamic with form's disabled property.
if the form is disabled placeholder will be become label even if the input has not value available.
<mat-form-field appearance="fill" floatLabel="never">
<mat-label>Input</mat-label>
<input matInput>
</mat-form-field>
I am working on an online rich-text editor, similar to the WordPress page creator, or the Stack Overflow post creator. It has been pointed out that there are two distinct types of online rich-text editors:
WYSIWYG editors, and
HTML editors
I'm building the second type. Unfortunately, neither <textarea> nor using contenteditable are very convenient for HTML rich-text editing.
The problem with <textarea> (as used here in Stack Overflow) is that you can't show text-level semantics in the edit field. You can't just highlight a word and make it bold, you have to insert some kind of markup (e.g. *****bold*****). Not very user friendly and not really "rich" text either.
On the other hand, using contenteditable solves those problems but introduces a problem of control. Browsers will insert all sorts of HTML and CSS to make the edit field look good. If you hit Enter, the browser will insert <p>, or <div>, or <br>, or <div><br></div>... depending on the browser. If you paste in a few paragraphs copied from HTML, you get tons of excessive markup--beyond what was even in the source HTML. For example, the following source code:
<p>This is one paragraph!</p>
<p>This is another.</p>
Shows up on a website as:
This is one paragraph!
This is another.
...which, if you copy and paste into a contenteditable form, can give you something like this:
<p style="line-height: 1em; color: rgb(34, 34, 34); font-size: 12px;
white-space: normal;">This is one paragraph!</p>
<p style="line-height: 1em; color: rgb(34, 34, 34); font-size: 12px;
white-space: normal;">This is another.</p>
...bringing inline styles with it, and in some cases additional HTML.
I've been trying to figure out how to limit and control the amount of HTML that the browser inserts in a contenteditable element, but I am beginning to think that contenteditable is only suited for WYSIWYG type editing, and will never work for HTML style rich-text editing.
Is there a third alternative, or has anyone built some sort of Javascript editor that meets my needs?
The alternative is to code it all by yourself using click events on normal divs, and so on. There are a lot of things that would need to be done using this approach and there are a lot of questions on stack overflowthat would help, including setting up all event handlers & handling adding a caret when they click on a location in text [1], keypress events for everything including Enter, Backspace, Delete, all alphanumeric keys, and the rest. You would need to create the caret as a visual element when they clicked something, enter text when they typed, delete text when they hit backspace, enter newlines when Enter is pressed, and so on. Google Docs and Online Word probably use this approach, but it is a massive amount of work and I don't know of any open source libraries that implement it, but it would give you full control of everything, including formatting of everything (since you would be entering it all).
[1] Detect which word has been clicked on within a text
How can I enter a superscript in a text-field in blackberry cascades. I am making a small maths apps and need to enter some text in superscript(variables power)? If this is not possible can you suggest some possible workaround. I am using these in a list too, so I would prefer if rich text is not used.
You can use HTML text styling (including CSS) for certain widgets with text ie Label, TextField etc. Not sure if there's a tag for superscript since tags support is quite limited, but it's worth to have a look at available ones:
http://developer.blackberry.com/cascades/documentation/ui/text/styles.html (scroll down to HTML text styling section)