Primary color issue

I have run in to a slight problem that I think needs CSS in some fashion. For as much as the default primary color of orange is nice, it does not display well when showing links. For this reason alone, I changed it to blue (#0000ff) and now links look like links.

However, for a new plugin I am developing, it introduces a new problem: when allowing the user to make an entry via TinyMCE, when you hover over an edit icon or make a selection from a pull-down (i.e. change font), this blue makes it nearly impossible to see what you are hovered over.

There seems to be 2 choices for me to make:

  • Choice #1: Change the primary color back to orange. What I would need to do for this choice to work for me is to then add CSS to display the linked text as blue (maybe even adding underlines). I’m not real crazy about this option because if the orange text appears somewhere else later on that is not a link then I have to make yet another CSS change.

  • Choice #2: Change the hover color on the TinyMCE editor to orange (which looks really nice in this case).

Could you tell me what CSS I need for both choices? Equally important, what choice would you advise?

PS: If I purchase Astrid Pro, do I have more control over this without custom CSS?

Hello there,

Please share a link to your page, so I can inspect your custom plugin’s TinyMCE editor.

Regards,
Kharis

Hi Kharis,

While I normally would not mind you seeing the site, the site is a staging area and has no users — consequently, you would not be able to see the editor in this context since you would not be logged in. The risk to adding a user so you can inspect it can be done, but you would have to promise to not actually try to create anything as we are currently trying to fix an infinite loop problem. It is also possible that the editor will change as there is a widget problem and that means I would have to setup the widget for your inspection which, in turn, means that we would have to schedule a time when you would inspect.

Also, if you agree to not create anything, how do I send you credentials privately?

The problem does not happen on the back end, only the front end. If you can suggest a plugin I can add for front end user editing, I can add it to another staging site I have and then you could access it.

Rob->

By the way, a fresh install of WP with the default WP theme shows that the hover area in the editor is showing the theme’s primary color which is a dark gray when used on the front end. I have seen sites that change this to a box outline instead of a color and I scratch my head wondering why that would not be something all themes do as it is the least obstructive and best user experience.

Hello there,

I am sorry for the long delay. To message me privately, click on my avatar in the left of my name above reply content. Then hit the “Message” button.

Regards,
Kharis

After reading more about TinyMCE, in TinyMCE Advanced there is an ability to add my own CSS for how TinyMCE displays (using their skin generator). In TinyMCE settings, it indicates:

My question: What folder do I need to create “editor_style.css” in so that TinyMCE Advanced will detect it as a part of the theme? I think then I can write CSS that will overcome this issue.

Hello there,

Try adding this code to your child theme’s functions.

Regards,
Kharis

I don’t have a child theme and would prefer to not incorporate a coded solution. The message indicates that I just need to create the editor_style.css to my theme or child theme.

Where would I create this style sheet in the Astrid theme folders?

Hello there,

It should be in the same place where the main stylesheet (style.css) resides.

Regards,
Kharis

I added editor_style.css in the same folder as styles.css inside Astrid, then added the CSS from a skin I exported at skins.tinymce.com — but, the theme seems to override what is there. I then looked in Google Developer to see the CSS being used and wrote that in the Custom CSS which fixed all but 1 issue.

I’m not exactly back to square 1, but I’m still not at a 100% solution. Is there a way to contact a manager or owner of aThemes? I have a proposal concerning my new plugin I would like to discuss.

Hello there,

You can simply write your proposal in a new topic, so that I’ll assign it to @charlie.

Regards,
Kharis