Flexible Spacer Block

설명

Flexible Spacer Block switches the height of the spacer according to the device screen width (breakpoints).
This block has two variable breakpoints, and you can adjust the height of the spacer for smartphones, tablets, and desktops respectively.
The height of the spacers can be changed individually or in batches.
Also available to set “negative space (negative margin)” instead of the normal space.
And this block supports transform from and to core spacer block.

About negative space

Negative space” narrows the margins both blocks above and below the spacer, and it is also possible to overlap the blocks.
If unintended overlap occurs, add a CSS class named “fsb-style-show-front” to the block you want to show in the front.
To apply the CSS class to the block, click on the block on WordPress editor, and check the block settings on the right for the Advanced setting ,then enter the CSS class.

Resources

Image for screenshot

License: CC0 Public Domain
Source: https://pxhere.com/ja/photo/245

스크린샷

  • On Block Editor
  • Setting page
  • Negative space example
  • Negative space example

블록

이 플러그인은 1(을)를 제공합니다.

  • Flexible Spacer Add white space between blocks and customize its height for each device.

설치

  1. Upload the flexible-spacer-block folder to the /wp-content/plugins/ directory.
  2. Activate the plugin through the \’Plugins\’ menu in WordPress.

FAQ

What filters can I use?

You can find a list of the available filters in the Github readme.

후기

2022년 10월 19일
I wish more people would release single, useful blocks like this instead of all those copy cat collections. Who really needs 5 accordion blocks? Only other thing I'd like to see in this is a way to set default initial heights like 75px desktop | 50px tablet | 25px phone etc. I was actually looking for a way to set a default height for the core spacer block when I stumbled on this.
2022년 4월 23일
Thank you very much for creating this awesome plugin. Love the plugin's simplicity and ease of use!
2021년 7월 20일
I had a problem with the standard Spacer Block, wherein it breaks the format in mobile in our website. With Flexible Spacer, I can designate the size of the space per mobile device! Awesome, thank you for developing this plugin.
2021년 1월 28일
スペーサーだけに絞ったブロック、とてもありがたいです。 UIもわかりやすく、使いやすいと思います。 素晴らしい!!!
모든 7 평가 읽기

기여자 & 개발자

“Flexible Spacer Block”(은)는 오픈 소스 소프트웨어입니다. 다음의 사람들이 이 플러그인에 기여하였습니다.

기여자

“Flexible Spacer Block”(이)가 1(으)로 번역되었습니다. 기여해 주셔서 번역자님께 감사드립니다.

자국어로 “Flexible Spacer Block”(을)를 번역하세요.

개발에 관심이 있으십니까?

코드 탐색하기는, SVN 저장소를 확인하시거나, 개발 기록RSS로 구독하세요.

변경이력

2.3.0

  • Tested to WordPress 6.5
  • Enhancement: Polish block style
  • Enhancement: Polish settings page style
  • Fix: Remove unnecessary CSS class
  • Drop support for WordPress 6.2

2.2.0

  • Tested to WordPress 6.4
  • Drop support for WordPress 6.0, 6.1

2.1.0

  • Tested to WordPress 6.3
  • Add: unit support
  • Drop support for WordPress5.9
  • Drop support for PHP7.3

2.0.0

  • Tested to WordPress 6.2
  • Feature: Add default values setting
  • Enhancement: Remove focus style for unit elements on the setting page
  • Enhancement: Improve error messages on the setting page
  • Fix: Responsive Setting value is empty for certain operations
  • Fix: grammer in the setting page

1.4.1

  • Clean: Remove files not needed for the release

1.4.0

  • Tested to WordPress 6.1
  • Drop support for WordPress 5.6 through 5.8
  • Fix: Not converting correctly from core spacer block
  • Enhancement: Polish style in the setting page

1.3.0

  • Tested to WordPress 6.0
  • Update: Minify inline styles
  • Add: filter hooks
  • Update: block icon
  • Update: author name
  • Fix: CSS files are not loaded in the iframe editor on WordPress 6.0

1.2.3

  • Change: Ensure minimum height of the block
  • Change: Minimum value of the spacer
  • Fix: Unable to change the height of spacer in WordPress 5.9.1

1.2.2

  • Clean: Remove unnecessary file included in the release

1.2.1

  • Fix: Wrong text domain

1.2.0

  • Tested to WordPress 5.9
  • Add: Block control to change responsive view
  • Change: Scripts handle name
  • Change: dashicons to @wordpress/icons
  • Remove: load_plugin_textdomain function

1.1.9

  • Clean: Update npm packages and run a lint check

1.1.8

  • Clean: Update npm packages
  • Remove: Bundled language files

1.1.7

  • Tested to WordPress 5.8
  • Clean: Update npm packages

1.1.6

  • Fix: build script error
  • Fix: README.md screenshot

1.1.5

  • Tested to WordPress 5.7
  • Clean: Update deploy flow (github actions)
  • Clean: Update npm packages and organize development env

1.1.4

  • Tested to PHP 8

1.1.3

  • Fix: Problem about plugin configuration values are not deleted upon uninstallation

1.1.2

  • Fix: Problem about uninstallation error in PHP 8

1.1.1

  • Add: Description about negative space

1.1.0

  • Add: Negative space setting

1.0.0

  • Initial release