• 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
9th August 2022
02:38 Low Tide ( 1.67m )
09:44 High Tide ( 4.32m )
15:10 Low Tide ( 1.73m )
22:13 High Tide ( 4.53m )

Tide times from tidetimes.org.uk

Tide Times & Heights for Northney on
9th August 2022
02:47 Low Tide ( 1.11m )
09:54 High Tide ( 4.08m )
15:15 Low Tide ( 1.16m )
22:14 High Tide ( 4.33m )
WordPress version:6.0.1
Gutenberg version:13.7.3

[clone]

[cloned]