Umbraco supports Bootstrap but when I try to create <a href="..."><span class="glyphicon glyph-..."></span>Link text</a> it is completely removing <span>
I know about possible hack to add comment within <span> but it is not solution which I can recommend to clients. Also I've tried to modify validElements, added validChildren and modified umbraco.controller.js to support +a[span] but it didn't work.
Do we know also what version of TinyMCE is embedded into Umbraco 7 and in case I want to update tinyMCE by myself how to do it?
What kind of content is it that you're using where you would like the editors to be able to use some icons? Would it be possible to consider using something other than a rich text editor? Of course if it's rich text then the answer is obviously no.
Is it to be used whenever list elements appear? Perhaps adding a <div> around the RTE output with a class of "rte-content" for instance and then target list elements using that class in your css - it will just need to be added as a selector with the rule already defined for the glyphicon classes for instance.
However..if you need to be able to have different glyph- classes have you then considered adding them as styles that can be selected when a certain text is marked up? You can assign a stylesheet for use in the Rich text editor on the "rich text editor" datatype in the "Developer -> Datatypes" settings.
But before it's possible you will need to create a rte stylesheet first - You do that by going to the "Settings -> Stylesheet" section and the right click the stylesheet folder and create a stylesheet, which you can call "rte". Once that stylesheet is created you can right click it in order to create the elments/classes that it should be possible to add. Usually people use it for allowing H1-H6 tags for instance.
Then the name would be "Heading 1" for instance and the alias would be h1. The name would show in the "Styles" dropdown of the rich text editor.
This approach can also be used to make classes where alias should just start with a dot...like ".glyp-heart" without the signs around them.
I hope this makes sense and is useful. Otherwise I'm looking forward to hearing from you again.
Btw...If you wish to report issues related to Umbraco you should do so at the issue tracker at http://issues.umbraco.org/issues - However I don't think the above is an issue related to Umbraco it's more a tinymce related issue the way I see it and I think it's unlikely that the core team will spend time on it :)
It is hard to invent more simple way around, because it needs to contain very little of HTML due that editors are not very familiar with it. All other solutions which I can imagine assume icon as a background of a link (so additional class in the <a>) which is OK but then I won't be able to use Bootstrap.
TinyMCE and Umbraco 7 glyphicon bug
Hello,
Is there a chance to get fixed following issue:
https://twitter.com/thediverdk/status/486797874349748224
Umbraco supports Bootstrap but when I try to create <a href="..."><span class="glyphicon glyph-..."></span>Link text</a> it is completely removing <span>
I know about possible hack to add comment within <span> but it is not solution which I can recommend to clients. Also I've tried to modify validElements, added validChildren and modified umbraco.controller.js to support +a[span] but it didn't work.
Do we know also what version of TinyMCE is embedded into Umbraco 7 and in case I want to update tinyMCE by myself how to do it?
Regards,
Gregory
Is it tidyhtml that's still acting on it on publish? Used to be cobfig/umbracosettings.config key to turn it off in v4... Not sure about 7.....
Hi Gregory
What kind of content is it that you're using where you would like the editors to be able to use some icons? Would it be possible to consider using something other than a rich text editor? Of course if it's rich text then the answer is obviously no.
Is it to be used whenever list elements appear? Perhaps adding a
<div>around the RTE output with a class of "rte-content" for instance and then target list elements using that class in your css - it will just need to be added as a selector with the rule already defined for the glyphicon classes for instance.However..if you need to be able to have different glyph- classes have you then considered adding them as styles that can be selected when a certain text is marked up? You can assign a stylesheet for use in the Rich text editor on the "rich text editor" datatype in the "Developer -> Datatypes" settings.
But before it's possible you will need to create a rte stylesheet first - You do that by going to the "Settings -> Stylesheet" section and the right click the stylesheet folder and create a stylesheet, which you can call "rte". Once that stylesheet is created you can right click it in order to create the elments/classes that it should be possible to add. Usually people use it for allowing H1-H6 tags for instance.
Then the name would be "Heading 1" for instance and the alias would be h1. The name would show in the "Styles" dropdown of the rich text editor.
This approach can also be used to make classes where alias should just start with a dot...like ".glyp-heart" without the signs around them.
I hope this makes sense and is useful. Otherwise I'm looking forward to hearing from you again.
/Jan
Btw...If you wish to report issues related to Umbraco you should do so at the issue tracker at http://issues.umbraco.org/issues - However I don't think the above is an issue related to Umbraco it's more a tinymce related issue the way I see it and I think it's unlikely that the core team will spend time on it :)
/Jan
Hello,
Thanks for your reply.
I intend to use it as below:
<a class="button" href="/About"><span class="glyphicon glyphicon-list-alt"></span>Team's Bio</a>
It is hard to invent more simple way around, because it needs to contain very little of HTML due that editors are not very familiar with it. All other solutions which I can imagine assume icon as a background of a link (so additional class in the <a>) which is OK but then I won't be able to use Bootstrap.
is working on a reply...