• PayPal button block in oik v4.8.0

    I’m getting ready to release oik v4.8.0 to the general public.

    This version contains a new block called PayPal button. It implements the logic of the paypal shortcode as a block.

    I wrote this post to test whether or not the block requires any styling. On oik-plugins I’d found that I needed to remove the border being applied to input controls. In this site it was also necessary to prevent images stretching to fill 100% width.

    I realised I needed some CSS applied to the block.

    • I implemented this in the block’s style.scss file.
    • For CSS specificity this required the HTML for the button to be wrapped using get_block_wrapper_attributes().
    • This entailed a co-requisite change to block.json to set supports.className to true.
    • And to ensure the style-paypal.css file is enqueued when the PayPal button block is used.
    /* Remove the border from around a PayPal button. */
    .wp-block-oik-paypal form input[type="image"] {
      border: none;
      width: auto;
    }


    Published:

    Last updated:

    April 8, 2022

Categories

Tide times from tidetimes.org.uk

Tide Times & Heights for Langstone Harbour on
3rd December 2022
00:14 Low Tide ( 1.63m )
07:48 High Tide ( 4.37m )
12:45 Low Tide ( 1.66m )
20:18 High Tide ( 4.16m )

Tide times from tidetimes.org.uk

Tide Times & Heights for Northney on
3rd December 2022
00:18 Low Tide ( 1.32m )
07:51 High Tide ( 4.25m )
12:53 Low Tide ( 1.42m )
20:22 High Tide ( 4.03m )
WordPress version:6.1.1
Gutenberg version:14.6.0

Summary file