Not quite sure that I understand your question...The content in the RTE do you want to wrap all of the three lines in the same div tag or do you want to render each line in it's own div tag so you end up having 3 div tags instead of one?
If so then I'm not sure that using the RTE field is the best way to go about it - Any reason why the text needs to be in a RTE?
Basically, I want text in Rich text editor because I want to format text from the CMS, for the BODYTEXT.
The client want that three lines in the RTE want to select all three and set a format name SECTION WITH WHITH BACKGROUND; all three lines wrapped in a div.
Currently, I need to go to source code and do it manually by set a div with class..
There are no easy reliable ways of doing it in my experience. The "best" approach is the one you mention above where you add it using the code view, which is not ideal for an editor.
One can probably extend the options of tinymce to enable adding divs but that is probably going to be a lot more work than switching to using the grid instead.
Perhaps you could try to add some rich text editor styles to the "formats" dropdown by adding a stylesheet in the "Settings" section and then add some classes, which the editor can the select by marking the desired text and then choose the class in the "formats" dropdown. That might work actually...
So in the "Settings" section you right click the stylesheet folder and create a stylesheet named "rte" for instance.
Then you right click the newly created "rte" stylesheet and add a new property/element - You can name it "Line 1" and then set the alias to p.line-one. Hit save and then add "line 2" and "Line 3" the same way.
Now go to the "Developer" section and go to the rich text editor datatype and then put a checkmark in the styles where the "rte" stylesheet should now be listed.
Please notice you don't need to add any CSS to the "rte" stylesheet. You can if you prefer to keep the class styling in there but I usually just keep the styling of the classes in my global stylesheet when allowing the editors to add classes in the RTE.
Now you can have the editors mark each line and add different styling - However you can't add divs - But since the P tag is also a block level element it might be sufficient.
Rich Text Editor Format in Block
Hi Guys,
Does anybody knows how I can format in block?
For example, I have three seperate lines in a rich text editor, and I want to select them all and wrap them in a div, through a pre-defined format...
Any help pleaasE?
Thank you
Hi Simon
Not quite sure that I understand your question...The content in the RTE do you want to wrap all of the three lines in the same div tag or do you want to render each line in it's own div tag so you end up having 3 div tags instead of one?
If so then I'm not sure that using the RTE field is the best way to go about it - Any reason why the text needs to be in a RTE?
/Jan
Hi Jan,
Basically, I want text in Rich text editor because I want to format text from the CMS, for the BODYTEXT.
The client want that three lines in the RTE want to select all three and set a format name SECTION WITH WHITH BACKGROUND; all three lines wrapped in a div.
Currently, I need to go to source code and do it manually by set a div with class..
Are there are other solution?
Hi Simon
In my humble opinion I don't feel a rich text editor is right for this scenario. Sounds more like a job for the grid editor actually. Try reading through the documentation here https://our.umbraco.org/documentation/getting-started/backoffice/property-editors/built-in-property-editors/grid-layout
Hope this helps! :)
/Jan
Thanks Jan for your reply.
But are there any solution regarding RTE stylesheet, where I can assing CSS class or a selector to a group of three
tags for example...?
Thanks
Hi Simon
There are no easy reliable ways of doing it in my experience. The "best" approach is the one you mention above where you add it using the code view, which is not ideal for an editor.
One can probably extend the options of tinymce to enable adding divs but that is probably going to be a lot more work than switching to using the grid instead.
Perhaps you could try to add some rich text editor styles to the "formats" dropdown by adding a stylesheet in the "Settings" section and then add some classes, which the editor can the select by marking the desired text and then choose the class in the "formats" dropdown. That might work actually...
So in the "Settings" section you right click the stylesheet folder and create a stylesheet named "rte" for instance.
Then you right click the newly created "rte" stylesheet and add a new property/element - You can name it "Line 1" and then set the alias to p.line-one. Hit save and then add "line 2" and "Line 3" the same way.
Now go to the "Developer" section and go to the rich text editor datatype and then put a checkmark in the styles where the "rte" stylesheet should now be listed.
Please notice you don't need to add any CSS to the "rte" stylesheet. You can if you prefer to keep the class styling in there but I usually just keep the styling of the classes in my global stylesheet when allowing the editors to add classes in the RTE.
Now you can have the editors mark each line and add different styling - However you can't add divs - But since the P tag is also a block level element it might be sufficient.
Hope this makes any sense :)
/Jan
Thanks Jan.
But I assume that for different section....I can use rows I think?
is working on a reply...