• WP 5.0.3, Kadence 1.3.3, Theme Twenty Sixteen (… has Editor stylesheet)

    In Gutenberg the Accordion Title font is taken from Theme (= Merriweather)

    But in in the resulting website the Title font changes to Montserrat

Viewing 6 replies - 1 through 6 (of 6 total)
  • Hey,
    In your accordion settings have you defined a font? Would it be possible for you to send a link?

    Ben

    Thread Starter burnuser

    (@burnuser)

    Sorry, no link (it’s a local testing site)

    Settings (unchangend like installed): Font Family => Select a font family

    If I manually select a font, it is shown in Gutenberg AND Frontend.

    But I think, a manual selection should not be necessary to have a WYSIWYG result.

    Thread Starter burnuser

    (@burnuser)

    The same configuration (no manual font selection) works in Tabs without any problem.

    Hey,
    It appears that twenty sixteen styles all “button” tags with :

    button, button[disabled]:hover, button[disabled]:focus, input[type="button"], input[type="button"][disabled]:hover, input[type="button"][disabled]:focus, input[type="reset"], input[type="reset"][disabled]:hover, input[type="reset"][disabled]:focus, input[type="submit"], input[type="submit"][disabled]:hover, input[type="submit"][disabled]:focus {
        background: #1a1a1a;
        border: 0;
        border-radius: 2px;
        color: #fff;
        font-family: Montserrat, "Helvetica Neue", sans-serif;
        font-weight: 700;
        letter-spacing: 0.046875em;
        line-height: 1;
        padding: 0.84375em 0.875em 0.78125em;
        text-transform: uppercase;
    }

    But in the backend, it only targets specific core blocks. by the classes of those core blocks and not through the same methods that it targets general tags on the front end.

    .wp-block-button .wp-block-button__link {
    	font-family: Montserrat, "Helvetica Neue", sans-serif;
    	font-weight: 700;
    	letter-spacing: 0.046875em;
    	line-height: 1;
    	padding: 0.84375em 1.3125em 0.78125em;
    	text-transform: uppercase;
    }

    So I don’t see how I can fix this other than to say that very soon accordions will have default settings enabled and you will be able to define the font family default for accordion blocks so that any time you add one it will have the correct font settings to match your front end.

    You can see how this will work because we already have it set up for the tabs block. Click on the three dots on the top right corner of your editor and then click on the Kadence Blocks Controls and there you can define defaults.

    Ben

    Thread Starter burnuser

    (@burnuser)

    OK, but in Tabs also no defaults are set in my (unchanged) configuration.

    No way to code Accordion Titles like Tab Titles (which work without problem)?

    Tabs don’t use a button tag so in the frontend and backend you see the same.

    It’s not like tabs are doing something right and accordion is not, it’s simply got to do with how your theme is styling different html tags but not using that same styling in the editor.

    Ben

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Accordion Pane/Title changes font on frontend’ is closed to new replies.