WordPress.org

Ready to get started?Download WordPress

Forums

Gravity Forms WYSIWYG
CSS Stylesheet (7 posts)

  1. hittheroadjack
    Member
    Posted 2 years ago #

    Hi and thanks for this great addon.
    It works for me close to perfect - one exception: the text area has no background color defined.
    What css stylesheet is used for this - the addon does not come with its own?

    http://wordpress.org/extend/plugins/gravity-forms-wysiwyg/

  2. bradvin
    Member
    Plugin Author

    Posted 2 years ago #

    Hi there

    I think your theme's css is overriding the textarea's background colour.
    You might need to add some custom CSS to your theme to take this into account, as there is no CSS added by the plugin

  3. hittheroadjack
    Member
    Posted 2 years ago #

    Hi bradvin,
    this is what Firebug says:

    <td class="mceIframeContainer mceFirst mceLast">
    <iframe id="input_20_19_ifr" frameborder="0" src="javascript:""" allowtransparency="true" title="Textfeld mit Formatierungsmöglichkeiten Drücke ALT + F10 für die Werkzeugleiste. Drücke ALT + 0 für die Hilfe." style="width: 100%; height: 156px; display: block;">
    </td>
    for the rich text area. It seems that transparency is explicitly allowed. But I cannot find out where the class "mceIframeContainer" is coming from. Any idea? It is not the tinyMCE default skin.
    Otherwise, I have to override it again at the end of my stylesheet again for td, this class and iframe - but no idea what this will do to the rest of my site.
    Also, in the GF_wysiwyg_class.php file, you hand over an editor_class=>'frontend' to the wp-editor. Afaik, this is an extra css class, but where does it come from and what does it do?

  4. hittheroadjack
    Member
    Posted 2 years ago #

    Forgot one thing to mention: it is only in visual mode where the text area is transparent - in HTML mode the background is opaque and kind of white.
    Tried to override '<iframe>' and '<textarea>' in my theme's stylesheet, but to no avail.
    But finally, I found this article Link and that did the job for now. I just wanted the tranparent backgroud go away.
    And another one: the popup window under the 'Link' button is coming up with white letters on light-light-grey background - almost impossible to read.
    I believe, it would be very helpful to know what CSS stylesheet is defining all this in order to be able to change it according to local requirements.

  5. hittheroadjack
    Member
    Posted 2 years ago #

    From what I found out so far, it is the /wp-includes/css/editor-buttons.css where most of the styling is coming from.
    And most classes can be overridden by your e.g. style.css and some of them cannot -like i.e.'.quicktags-toolbar, .wp_themeSkin tr.mceFirst td.mceToolbar' . Still testing, maybe I'll find out why not and post it here.

  6. hittheroadjack
    Member
    Posted 2 years ago #

    Kept on testing some things and came across another small problem:
    when I try to show my form containing the editor textarea in a Fancybox like described here no buttons are shown in the editor menu toolbar. Looks like a conflict of javascripts/jquery.
    Not a big issue because the form displays o.k. on a normal page - just a would-have-been-nice feature.

  7. hittheroadjack
    Member
    Posted 2 years ago #

    The css styles can be overridden using '!important' in your own style.css or editor-style.css.
    Now, everything works fine with my intended use case.
    Also tested it in conjunction with the TinyMCEAdvanced Plugin and worked nicely.

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic