There are a few scenarios where you can highlight text and the richtext menu options disappear.
Aside from web-accessibility concerns of showing and hiding page features there's actually a bug where if you highlight a word (in order to say, make it a link) and let go in a certain area (within the dialog but outside of the text area) the richtext options disappear s you can't make it a link.
Hiding them seems to be just an exercise in hiding the dialog complexity but in doing so can make entry more complex.
Attached zipped video example of issue.
Solved! Go to Solution.
Topics help categorize Community content and increase your ability to discover relevant content.
Views
Replies
Total Likes
Hello @chebwin, Here you go. This solution should keep the RTE menu options always "visible".
Note: This code is tested on AEM 6.5 SP 11
I hope I did not introduce any typos. If you find any please point it out to me and I'll fix them in my post.
At a high level 2 things are necessary to achieve this,
1. Create a client library with a CSS and a JS custom script (code below)
2. Hook this client library into the extraClientlibs field.
The CSS:
.cq-dialog-content .rte-ui .rte-toolbar {
visibility: visible!important;
}
The JS
(function (document, $) {
$(document).on("foundation-contentloaded", function(e) {
setTimeout(function(e){
$(".cq-dialog-content .rte-ui .rte-toolbar .rte-toolbar-item").addClass("is-disabled");
}, 1000);
});
})(document,Granite.$);
Link it to the component:
extraClientlibs="[<your-custom-clientlib-name>]"
thanks,
Preetpal
Yes, we had a similar ask by the business team. Let me dig up that code and be right back with the implementation.
Hello @chebwin, Here you go. This solution should keep the RTE menu options always "visible".
Note: This code is tested on AEM 6.5 SP 11
I hope I did not introduce any typos. If you find any please point it out to me and I'll fix them in my post.
At a high level 2 things are necessary to achieve this,
1. Create a client library with a CSS and a JS custom script (code below)
2. Hook this client library into the extraClientlibs field.
The CSS:
.cq-dialog-content .rte-ui .rte-toolbar {
visibility: visible!important;
}
The JS
(function (document, $) {
$(document).on("foundation-contentloaded", function(e) {
setTimeout(function(e){
$(".cq-dialog-content .rte-ui .rte-toolbar .rte-toolbar-item").addClass("is-disabled");
}, 1000);
});
})(document,Granite.$);
Link it to the component:
extraClientlibs="[<your-custom-clientlib-name>]"
thanks,
Preetpal
Thanks Preetpal! Tested this locally and it works fine
Will need to test it's production ready for SP 17; a shame there's not a built in fix but I'm sure we'll go for this or something very similar
Views
Likes
Replies