You need to be logged in to post in the forum - Log In

An active JCE Pro Subscription is required to post in the forum - Buy a Subscription

Support is currently Online

Official support hours:
Monday To Friday
From 09:00 To 17:00 Europe/London (BST)
  Wednesday, 30 March 2022
  8 Replies
  1.2K Visits
Hello, is it possible to add <small> tag to the list
It's more symantically correct than using a style or the font size https://www.w3schools.com/tags/tag_small.asp

I like to limit the use of font sizes generally or clients can go nuts with 'em ! ;)
more than a month ago
·
#110821
Accepted Answer
The menu item id is internal and so cannot be changed, but I have moved the menu item title to the menu div container element, so you can use that as an attribute selector, eg:


div[title="Small"].mceMenuItem::before,
div[title="bg_black"].mceMenuItem::before {
color: white;
background: grey;
display: block;
padding: 3px;
border-right: 5px solid white;
}
div[title="Small"].mceMenuItem::before {
content: "Block Elements";
}
div[title="bg_black"].mceMenuItem::before {
content: "BG Colours";
}


Please try JCE Pro 2.9.23 Beta 3 - https://www.joomlacontenteditor.net/downloads/editor/pro/development

Just because you're not paranoid doesn't mean everybody isn't out to get you.

more than a month ago
·
#110718
small.jpg
more than a month ago
·
#110719
Or maybe it might be best as a button, as it is an inline element?
more than a month ago
·
#110726
An alternative is to create a Custom Style in Editor Profiles -> Plugin Parameters -> Style Select

This can then be applied to a text selection from the editor Styles list.

https://cdn.joomlacontenteditor.net/tmp/110717-add-tag-to-format-select-list.jpg

Just because you're not paranoid doesn't mean everybody isn't out to get you.

more than a month ago
·
#110761
Ah, fab that's great. It does stick it at the top instead of alphabeticising with those from the stylesheet. Is that changeable?

Also, it would be really handy if the styles dropdown could be grouped, as I find it gets really long.
I know there is a search and I try to prefix by something memorable for clients, but grouping would be easier for them.

Thanks very much
S :)
more than a month ago
·
#110765
It does stick it at the top instead of alphabeticising with those from the stylesheet. Is that changeable?


Custom Styles are added to the top, with stylesheet styles added alphabetically below.

I might add some sort of divider between these, but it won't be possible to create groups of stylesheet styles.

Just because you're not paranoid doesn't mean everybody isn't out to get you.

more than a month ago
·
#110816
I have been thinking about this and I think I will move all of my "Format Elements" into the "Styles" dropdown.
And because the Styles is created from <div>s & <span>s, I should be able to style this dropdown myself.

Obv. this needs work, but I'm happy that it's feasible.
Untitled-4.jpg

Would it be possible to change the ids like this "mce_58" to use the title of the span?
So for the following,


<div id="mce_58" class="mceMenuItem mceMenuItemEnabled mceEnabled mceSelected" role="option" aria-disabled="false" aria-pressed="false" aria-checked="true" tabindex="-1"><span class="mceText" title="bg-purple" aria-label="bg-purple" style="font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 13px; font-weight: 400; text-decoration: none solid rgb(36, 32, 32); text-transform: none; background-color: rgb(106, 95, 150); color: rgb(36, 32, 32);">bg-purple</span></div>


<div id="mce_58" ...
would be
<div id="mce_bg-purple" ...

Thanks very much

If anybody else is interested, this is the css I used in

/administrator/templates/isis/css/custom.css
to get the attached layout

Your ids will change according to the styles you have in your dropdown.
You could use a grid instead of flex to place each div exactly in its own position.


#jform_articletext_styleselect {
min-width: 120px;
max-width: 120px;
overflow: hidden;
}
#menu_jform_articletext_jform_articletext_styleselect_menu {
width: 80% !important;
}
#menu_jform_articletext_jform_articletext_styleselect_menu_items {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-flow: column wrap;
flex-flow: column wrap;
overflow: scroll;
}
#menu_jform_articletext_jform_articletext_styleselect_menu_items > div {
-webkit-box-flex: 0;
-ms-flex: 0 0 50px;
flex: 0 0 50px;
}
#mce_104 {
display: none;
}
#mce_35::before,
#mce_41::before {
color: white;
background: grey;
display: block;
padding: 3px;
border-right: 5px solid white;
}
#mce_35::before {
content: "Block Elements";
}
#mce_41::before {
content: "BG Colours";
}
#mce_41 ~ div span {
font-size: 0 !important;
}
#mce_74 ~ div span {
font-size: 13px !important;
}
more than a month ago
·
#110821
Accepted Answer
The menu item id is internal and so cannot be changed, but I have moved the menu item title to the menu div container element, so you can use that as an attribute selector, eg:


div[title="Small"].mceMenuItem::before,
div[title="bg_black"].mceMenuItem::before {
color: white;
background: grey;
display: block;
padding: 3px;
border-right: 5px solid white;
}
div[title="Small"].mceMenuItem::before {
content: "Block Elements";
}
div[title="bg_black"].mceMenuItem::before {
content: "BG Colours";
}


Please try JCE Pro 2.9.23 Beta 3 - https://www.joomlacontenteditor.net/downloads/editor/pro/development

Just because you're not paranoid doesn't mean everybody isn't out to get you.

more than a month ago
·
#110824
Perfect! Brilliant, thanks very much.
Suburb support as always :)
saraheagle selected the reply #110821 as the answer for this post — 5 months ago
  • Page :
  • 1
There are no replies made for this post yet.
Be one of the first to reply to this post!