ALB Block Theme Type 1 Banner

Description

ALB Block Theme Type 1 Banner is a WordPress block type plug-in that is highly customizable and used for both site editing and blog post editing. This block enables users to display a banner image of full width on their WordPress sites and blog posts. On top of the banner image, users may add other child-blocks, such as ALB Theme Text Blocks, WordPress core paragraph, buttons, and even post titles, which is dynamically pulled in from database. Users are also provided a way to adjust the position of those child-blocks.

One of the important features of this block plug-in is that users can also upload different images for different screen sizes such as smart phones, tablets, desktops, and wide desktops. In addition, this plug-in knows to load an appropriate version of image according to the screen size and screen density of devices of the viewers of your websites. For example, your viewers’ smart phones will NOT load the banner image of desktop version or tablet version, but mobile version only. This way, your viewers have managed to avoid loading unnecessary data and it is of great help especially if they are operating on limited data plans. In fact, throughout the development of our any digital product, it is our top priority to help end users avoid loading unnecessary and redundant data and resources.

After inserting the banner block with post editor or site editor, users may adjust the banner height and which portion of the image to display. For instance, if users want to display full image, they can set the Banner Image Type to Full Image. Of course, you may choose other Banner Image Type and rest assured that the image will be displayed gracefully without unreasonable distortion. The part of image to be displayed can be adjusted with the options Image Horizontal Position and Image Vertical Position.

Another cool feature of ALB Block Theme Type 1 Banner is that users are granted options to adjust the “background light” of the banner image by modifying the Background Color and Image Opacity.

Last but not least, users may use this banner block anywhere in their site templates, post templates (and page templates), and individual blog posts and pages. The flexibility described above, however, has come with a cost, which is the fact that users have to take care of over 40 parameters. Yet you don’t worry about the complexity. You can simply start with one of 2 samples, on top of which you can fine tune other parameters. So, we have provided two buttons under Basic Settings panel that read Try Sample 1 and Try Sample 2.

Please be reminded to test your websites for different screen widths ranging from 639px to 1381px. Enjoy building your website!

Screenshots

  • Editor's screen, Try Sample button
  • Viewer's screen
  • Unreasonably distorted banner image (Mobile)
  • Gracefully displayed banner image (Mobile)
  • Toggle button to remove top margin / padding
  • Theme twentytwentythree tips (Part 1/2)
  • Theme twentytwentythree tips (Part 2/2)

Blocks

This plugin provides 1 block.

  • ALB Block Theme Type 1 Banner Highly customizable banner block, develeped by Max (DELIHUI) from albedu.org. Works independantly and with ALB Theme button block and text block.

FAQ

Tips for users of the theme twentytwentytwo

  • If you insert this block after another block, you might find a top margin above it.
  • You may remove / add this top margin with a toggle button provided at the toolbar. (Please see the screenshot. )
  • You may put this banner block inside the Group block, which is one of WordPress core block, to make it take up the full-width of the web page / blog post.

Tips for users of the theme twentytwentythree

  • If you are using the WorePress twentytwentythree, you might see a top padding on the entire page. To remove that top padding you can do it either at global scope, or at block post (or template) scope.
  • To remove / add the top padding from / to every page and blog posts, you need to click the Styles button, then click the Layout button, and adjust the top padding. If you cannot see the textbox to input the top padding value, please simply click the toggle button. Please know that this is one of the WordPress core features, not specific to ALB Block Theme Type 1 Banner. (Please see the screenshot. )
  • Alternatively, you can remove / add the top padding from a certain template, blog post or page, simply by clicking a toggle button provided at the toolbar. (Please see the screenshot. )
  • You may put this banner block inside the Group block, which is one of WordPress core block, to make it take up the full-width of the web page / blog post.

More tips

We post video tutorials or/and blog posts to help with our users’ various needs. We will even develop and publish new products if necessary. Please stay tuned.

Reviews

There are no reviews for this plugin.

Contributors & Developers

“ALB Block Theme Type 1 Banner” is open source software. The following people have contributed to this plugin.

Contributors

Changelog

1.0.0

  • Initial commit

1.0.2

  • Bug fix
  • Tested up to WordPress Version 6.2
  • Added support for more child blocks