Adding classname to custom blocks

  • Resolved culturecorp

    (@culturecorp)


    5 years, 7 months ago

    How can I get the classname assignment from the page editor (Right sidebar => Advanced => Additional CSS Class) to populate inside of a custom block?

    Example:

    <section class=”column-section [CLASSNAME WOULD GO HERE]” style=”background-image: url(<?php block_field(‘background-one’) ?>), url(<?php block_field(‘background-two’) ?>); background-color: <?php block_field(‘background-color’) ?>”>
    … blah blah
    </section>

    • This topic was modified 5 years, 7 months ago by culturecorp.
Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author Ryan Kienstra

    (@ryankienstra)

    How To Output An Additional Class

    Hi @culturecorp,
    Thanks for asking. Like you mentioned, you can enter an “Additional CSS Class”:

    https://cldup.com/mJXA5AVfN9.png

    And in the template, you can use block_value( 'className' ) to get the value:

    <section class=”column-section <?php echo esc_attr( block_value( 'className' ) ); ?>">

    Or block_field( 'className' ) to echo it:
    <section class=”column-section <?php block_field( 'className' ); ?>">

    Let me know how this works for you, and have a great weekend.

    • This reply was modified 5 years, 7 months ago by Ryan Kienstra.

    @ryankienstra I tried this solution on the site I’m working on. It works properly for displaying the blocks in the frontend. However, when entering a value in the custom class field and then deselecting the block to enter preview mode, I get: “Error loading block: Invalid parameter(s): atrributes”

    Plugin Author Ryan Kienstra

    (@ryankienstra)

    Hi @eriktdesign,
    Thanks, you’re right about that. We’re working on a fix for that in:

    https://github.com/getblocklab/block-lab/issues/253

    In the best case, a fix would be released this coming week. But you can see the progress in that issue.

    Have a great weekend.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Adding classname to custom blocks’ is closed to new replies.