The react-native-render-html component has a textSelectable property, but when set to true, it enables copying the entire text in the component, and doesn't allow highlighting to copy/paste individual text.
Is it possible to allow selecting partial text within the react-native-render-html component?
For more context, see the textSelectable property in the react-native-render-html documentation. It allows "all texts to be selected", and when I set it to true that is the clipboard copy behavior I am seeing, but I do not see a configurable property to allow the user to highlight only portions of the text in the component.
Is this a limitation of the library with no viable workaround?
Related
My aim is create custom event on Text Component. When I choose one word or when I highlight couple of words, event should fire to open a "buble view" upon, below or near that specific text.
I have found this package here react-native-selectable-text but it does not provide the functionality that I want.
https://github.com/Astrocoders/react-native-selectable-text
Two steps
1) How to create that selectable action. I am not talking about Text prop selectable which only opens a menu of copy, paste, select all options. I want to open a view like that menu. A view which will contain information about highlighted text.
2) How I can render a small box(View comp.) with specific coordinates. Like when I choose that text, box has to be rendered upon or below of the text.
I know direct manipulation. But hard part is how am I going to give that select&highlight action to text component?
We have a block type in our EpiServer project that can have either specify a video to use (an EPiServer.Url) or a youtube id (string). The thing is that it only makes sense to use either of those, not both. Is there a way of marking one field readonly if the other is filled?
Not using vanilla editors, I'm afraid. But you could fairly easily create a custom editor (dojo widget) for that use case.
Here's an example of a custom editor to display a checkbox list for selecting blocks, instead of the standard editor for ContentArea properties:
https://tedgustaf.com/blog/2016/create-a-custom-editor-for-a-content-area-in-episerver/
However, the same principles apply for any content type.
To be clear: you don't need a custom property type, just a custom editor. The backing property type could still be string, which would contain either the URL or the YouTube ID.
If you want the property to be more developer-friendly, you could create a block type with "YouTube ID" and "URL" properties, and then define a content property of that block type.
You would then use your custom editor to set either the "YouTube ID" or "URL" property of that "VideoBlock" property.
We have created a similar editor before, where the editor would either select a video using a dropdown, or specify a custom video stream URL.
In Sitecore MVC, FieldRenderer.Render(Item, "Field Name") automatically checks its field type. In another word, all XSLT extensions (sc:text, sc:image, sc:date, …) is affected by the RenderField pipeline.
But, I couldn't find sc:checkbox information and it doesn't show "CheckBox" in page edit mode. It just shows the value of the check box.
How can I make it show as like input type=checkbox in page editor?
Sorry for the link only answer but the general approach here is to use a Field Editor Button.
This will open a pop up window with the content editor style control for the field.
If using a custom experience button is not an option for you, you can output different markup (i.e. your input button) to the client when the page mode is in 'Edit' mode.
This will allow you to present the author with the controls you wish to display, but still output the normal output values for end users.
If you are able to use controller renderings, you can use the controller to load a different view to make this easier, but otherwise you can use if statements within your View to output different markup.
Let's say I defined a IBM WCM authoring template called "AT-Image"; it creates content item "CT-Image" that contains elements such as an Image of type "Image", Description of type "Short Text", Keywords of type "Text", and other fields that serve as meta for that image resource.
Now, I need to create a content item called "CT-Article" based off from its "AT-Article" authoring template. Let's say that "Article" item has 3 elements: Title, Summary, and Image. Title and Summary are of type "Short Text". But Image needs to be of type "CT-Image" and not Image or Image component.
Is this possible Out-of-the-Box or is this something I need to implement myself via WCM API?
From my point of view you should use a menu component in the following way:
Let's assume you have got your CT-Image and CT-Article in a common sitearea called "MyArticle" like this:
MyArticle
CT-Article
CT-Image
Furthermore you need a WCM Menu component which uses two selection criteria:
current sitearea as location
CT-Image as authoring template
So then rendering CT-Article with a presentation template PT-Article you can reference the menu component. Therefore, you reference the menu component in the presentation template markup. The menu component then will pick up the CT-Image and render it as it is located in the same sitearea as your CT-Article.
That's rather a content design approach then a technical approach. It's all there out-of-the-box and saves custom development effort.
If I understand correctly, basically you want to create pre-defined images and then pick one of them to display when you create an article. Correct?
Well, the easiest way would be to utilize what WCM already gives you: create an Image Component. You will be able to upload the image and also provide a description, but you won't be able to set keywords or metadata. The workaround for this would be to set the keywords/metadata as part of the article. If that is okay, this would probably be the best way to do it.
By doing that, all you would have to do is select the relevant Image Component from your Image Element in AT-Article.
If you really need the images to be their own content items (rather than components) so that they have their own keywords and other information, then the next "easiest" way is probably to use an HTML Element inside AT-Article. In this HTML Element you will have to use the "Insert Tag" option, and then choose an Element Tag and use "Selected" rather than "autofill" or "current" to navigate to the content item that you want (the one with the image).
The code will look like this:
[Element name="[path]" type="content" context="selected" key="[element]"]
Where [path] is the path to the content item and [element] is the element that you actually want to pull from that content item (such as image, description, keywords, etc.)
context="selected" is the key there. Then you just need to set up your Presentation Template to be able to use this information that you are pulling in from the HTML Element.
WCM 8.5 has the InContext tag.
The InContext tag renders a tag body within a specified context. The new context can be specified as a predefined context by using a UUID, or by path.
For eg. in this case you can use below where key="Image" in InContext tag is the Link element to the CT-Image content item :
[InContext uuid="[Element context='current' type='content' key='Image' format='id']"]
[Element context="current" type="auto" key="Image"]
[Element context="current" type="auto" key="Description"]
[/InContext]
I am having some issues getting TinyMCE to be as flexible as I need it to be. In my editor (used in a cakePHP-based app) I am not allowing users to edit the html, so we are relying entirely on the WYSIWYG. Unfortunately, TinyMCE is currently not allowing users to apply two CSS classes to the same text. Whichever style is applied last wipes out the original.
To give an example: If a user wants to designate a line of text to be both 'huge' and 'highlighted' (both CSS classes), they would highlight the text and choose 'huge' from the CSS style dropdown, then highlight the same text again and choose 'highlighted'. What results is text that only has the 'highlighted' class applied to it.
I can work around this problem currently by just adding an extra character to the text I am trying to style, apply the 'huge' class to that, apply the 'highlighted' class to the original text, and then delete the extra character. But, this really is far from an ideal solution.
Does anyone know of a way to resolve this issue?
You will have to write your own plugin looking similar to the style plugin.
When the user selects a class from the dropdown you just add it to the selected text instead of replacing it.