Style structure of WP Forms – FSE Themes

  • Resolved hebhansen

    (@hebhansen)


    2 weeks, 5 days ago

    Hi Forms

    Can you advise me how to approach this best? My theme is TT4 child theme. I am trying to tap into the “new” WordPress styling structure using theme.json. For legacy plugins I try to use TT4 variables in custom css for color, font-size etc.

    In inspector I see a number of these variables for WP Forms, such as a color palette and some other goodies. So to do this right and use WP Core Button fx in WP forms, so that styles update with new theme, how do I do this best?

    Do you have a theme.json for WP forms. Where can I find it, or how are you creating these variables? Can I copy these into my child theme.json and edit them. Will that overwrite your styles?

    I will dig into all fields, but for now that button not abiding to theme, really barthers me.

    Let me know your thoughts. Thx

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Support Ralden Souza

    (@rsouzaam)

    Hi @hebhansen,

    Thank you for reaching out!

    Currently, WPForms isn’t compatible with Gutenberg block API version 3. However, our team is actively working on adding support for the new API, which will allow customization of the widget using a theme.json file and variables.

    I apologize for any inconvenience this may cause in the meantime, and we appreciate your patience as we work on this enhancement. I hope we can offer this support soon.

    Thanks!

    Thread Starter hebhansen

    (@hebhansen)

    API version 3 do you mean Schema Version 3 or?

    So you are compatible with Schema 2? And have theme.json in place there?

    let me ask again. In my inspector I see a lot of variables for WP Forms declared! A full color palette and much more. Where are these coming from?

    if I style your button to behave as core button, what is the css to do so?

    Thread Starter hebhansen

    (@hebhansen)

    This is what I mean

    Please consider to adhere to theme colors, buttons, fields, shadows, outline, border design vs. designing own style. That way WP Forms adapts when a theme upgrades. IMHO it makes no sence that a plugin tries to be a theme. Also it is code in exess…

    Plugin Support Ralden Souza

    (@rsouzaam)

    Hi @hebhansen,

    Thanks for your follow-up questions!

    For details on API version 3, you can check them out here. Currently, WPForms Lite doesn’t include a theme.json file.

    The variables you’re seeing are available only for WPForms Lite. If you’d like WPForms buttons to match core buttons, you can copy the CSS class from core and add it to the form builder to apply the styles. I’d recommend getting more details from some files, like plugins/wpforms-lite/src/Frontend/CSSVars.php and plugins/wpforms-lite/src/Integrations/Gutenberg/FormSelector.php.

    Just as a note, WPForms Lite isn’t designed to function as a theme; the variables are part of our Form Themes feature, which uses modern markup to help users easily style their forms.

    Hope this helps!

Viewing 4 replies - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.