Home>Support>Special header format on specific widget content

Special header format on specific widget content

By zkagen, 9 years ago. Last reply by zkagen, 9 years ago.

Hi,

I would like to be able to do some special header formatting on specific PB widgets.

I have tried the following:

PB > Widget Styles Attributes > CSS Styles >

.entry-content h1 {font-size: 2em;}

But nothing happens. Se URL below.

Any idea why?

URL: http://wptest01.zkagen-marketing.dk/indholds-side-2/

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 9 years, 8 months ago Andrew Misplon
    Hi, I Work Here

    Hi Hans

    Try inspecting the source using your browser’s developer tool. CSS Styles adds inline styles to the div in question, so it’s not possible to insert an entire selector, you can only insert properties like:

    font-size: 2em;

    But that would then apply to entire div and not just the header.

    This is what your source currently looks like:

    <div style=".entry-content h1 {font-size: 2em;};" class="panel-widget-style">

    Rather apply a row class under the Attributes tab when editing the row, you can then target what you need from there.

    Say your row class is:

    my-row-class

    Then under Appearance > Custom CSS you can use that class:

    .my-row-class .textwidget h1 {
font-size: 2em;
}

    Using your browser’s developer tool to inspect the source code and CSS is really the key to seeing what’s happening and making adjustments.

  2. 9 years, 8 months ago zkagen

    Hi Andrew,

    Thanks for your explanation, it is highly appreciated.

    HC

  3. 9 years, 8 months ago Andrew Misplon
    Hi, I Work Here

    No problem, hope that gets you going.

  4. 9 years, 8 months ago zkagen

    BTW, does this also work with Widget Styles > Attributes, or is it only in Row Style > Attributes ?

  5. 9 years, 8 months ago Andrew Misplon
    Hi, I Work Here

    Exactly the same principles apply. With widget attributes your class is getting added at the widget level, with row attributes your class is being added a bit higher, to the row. Try adding both, inspect the source, you can then see where they are being added.

  6. 9 years, 8 months ago zkagen

    Awesome :-)

    Thanks!

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More