Phil Ewels

A WordPress Customise Widget to add a global website banner, styled using a <a href="https://getbootstrap.com/docs/4.4/components/alerts/" rel="nofollow ugc">Bootstrap alert box</a>.
The plugin assumes that you’re already using Bootstrap, so you need to load the Bootstrap javascript and CSS separately.
<ul>
<li><a href="http://getbootstrap.com/" rel="nofollow ugc">Download Twitter Bootstrap</a></li>
<li><a href="http://www.bootstrapcdn.com/" rel="nofollow ugc">Bootstrap CDN</a> (directly link CSS and javascript files)</li>
<li><a href="https://getbootstrap.com/docs/4.4/components/alerts/" rel="nofollow ugc">Bootstrap Alerts in action</a></li>
</ul>
Once installed, you can add the alert to the correct location in your theme (for example, in <code>header.php</code> with the <code>global_bootstrap_banner()</code> function. 
For example:
<pre><code>if (function_exists('global_bootstrap_banner')){
 echo global_bootstrap_banner();
}
</code></pre>
If you prefer, you can use a shortcode instead:
<pre><code>[global-bootstrap-banner]
</code></pre>
<h4>Shortcode Options</h4>
The plugin works best when using the Customizer interface. However, if you wish you can use a shortcode and override most fields.
<ul>
<li><code>enabled</code> (default <code>true</code>)
<ul>
<li>Whether to show the banner or not.</li>
</ul>
</li>
<li><code>colour</code> (default <code>alert-primary</code>)
<ul>
<li>Bootstrap class to use for styling the alert.</li>
</ul>
</li>
<li><code>header_text</code>
<ul>
<li>Header – leave blank to skip the alert header.</li>
</ul>
</li>
<li><code>body_text</code>
<ul>
<li>Main text for the alert. You can use HTML.</li>
</ul>
</li>
<li><code>link_text</code>
<ul>
<li>Display text for a button at the bottom of the alert. Leave blank to skip.</li>
</ul>
</li>
<li><code>link_url</code>
<ul>
<li>URL for button to link to.</li>
</ul>
</li>
<li><code>link_class</code> (default <code>btn-primary</code>)
<ul>
<li>Bootstrap class to use for styling the button.</li>
</ul>
</li>
<li><code>link_new_window</code> (default <code>false</code>)
<ul>
<li>Whether to open the link in a new window or not.</li>
</ul>
</li>
<li><code>link_btn_lg</code> (default <code>false</code>)
<ul>
<li>Use the <code>btn-lg</code> class for the button (big button).</li>
</ul>
</li>
<li><code>link_btn_sm</code> (default <code>false</code>)
<ul>
<li>Use the <code>btn-sm</code> class for the button (small button).</li>
</ul>
</li>
<li><code>link_btn_block</code> (default <code>false</code>)
<ul>
<li>Use the <code>btn-block</code> class for the button (full width button).</li>
</ul>
</li>
<li><code>dismiss_btn</code> (default <code>true</code>)
<ul>
<li>Whether to show a dismiss button in the corner of the alert.</li>
</ul>
</li>
<li><code>dismiss_expiry</code> (default <code>14</code>)
<ul>
<li>How many days the dismissal cookie should last for before it is shown again.</li>
</ul>
</li>
<li><code>dismiss_id</code>
<ul>
<li>Random string to use for the dismissal cookie. Use a new one to force it to show for everyone.</li>
</ul>
</li>
<li><code>alert_before</code> (default <code><div class="global-bootstrap-banner container"></code>)
<ul>
<li>HTML to use before the alert.</li>
</ul>
</li>
<li><code>alert_after</code> (default <code></div></code>)
<ul>
<li>HTML to use after the alert.</li>
</ul>
</li>
<li><code>header_before</code> (default <code><h4 class="global-bootstrap-banner-heading alert-heading"></code>)
<ul>
<li>HTML to use before the heading.</li>
</ul>
</li>
<li><code>header_after</code> (default <code></h4></code>)
<ul>
<li>HTML to use after the heading.</li>
</ul>
</li>
<li><code>link_before</code> (default <code></code>)
<ul>
<li>HTML to use before the button.</li>
</ul>
</li>
<li><code>link_after</code> (default <code></code>)
<ul>
<li>HTML to use after the button.</li>
</ul>
</li>
</ul>
For example, a simple shortcode usage would be:
<pre><code>[global-bootstrap-banner body_text="This alert says something different"]
</code></pre>
Note that the shortcode first takes the settings from the Customizer and then overwrites these. 
So the above shortcode would show a header if it is set in the Customizer settings.
<h4>Credits</h4>
This plugin was written by <a href="https://github.com/ewels" rel="nofollow ugc">@ewels</a>.
<h4>Contributing</h4>
If you would like to contribute to this plugin, please go to the <a href="https://github.com/ewels/global-bootstrap-banner" rel="nofollow ugc">GitHub repository</a> and make a personal fork of the development version. You can then make your changes and submit a pull request. I will happily review the code and then merge when we’re both happy.

Global Bootstrap Banner

Add a global website banner using a Bootstrap alert box.

Hidekazu Ishikawa

Vektor,Inc.

DRILL LANCER

Naoki Ohashi

Tomoki Shimomura

Daiki Oshima

sysbird

mimi

kaorock72

chiakikouno

nc30

mthaichi

This is a plugin that extends Gutenberg’s blocks.
[Blocks] 
* Alert 
* Balloon 
* Border Box 
* Button 
* Classic FAQ 
* New FAQ 
* Flow 
* Heading (not recommended) 
* Icon 
* Icon Outer 
* Page Content 
* PR Blocks (not recommended) 
* PR Content (not recommended) 
* Responsive Spacer 
* Staff (not recommended) 
* Page list from ancestor 
* Slider 
* Visual Embed 
* Accordion [ Pro ] 
* Animation [ Pro ] 
* Archive list [ Pro ] 
* Blog Card [ Pro ] 
* Breadcrumb [ Pro ] 
* Button Outer [ Pro ] 
* Card [ Pro ] (not recommended) 
* Category Badge [ Pro ] 
* Child page list [ Pro ] 
* Dynamic Text ( Post Type name / Ancestor Page name ) [ Pro ] 
* Fixed Display [ Pro ] 
* Icon Card [ Pro ] (not recommended) 
* Post list [ Pro ] 
* Post list Slider [ Pro ] 
* New Badge [ Pro ] 
* Selected Post List [ Pro ] 
* Step [ Pro ] 
* Tab [ Pro ] 
* Table of Contents [ Pro ] 
* Taxonomy [ Pro ] 
* Timeline [ Pro ] 
* Grid Column [ Pro ] 
* Grid Column Card [ Pro ] 
* Outer [ Pro ]
[Extensions] 
* Hidden extension 
* Highlighter 
* Inline Font Size 
* Margin extension 
* Nowrap 
* Responsive BR 
* Columns direction 
* Custom CSS [ Pro ] 
* Link toolbar
[ Settings ] 
* Balloon 
* Custom Format [ Pro ] 
* Custom Block Style [ Pro ] 
* Common Margin 
* Load Separate 
* FAQ Block [ Pro ] 
* Custom CSS [ Pro ] 
* Block Manager 
* Block Style Manager
[ Tools ] 
* Import Export
[ Editing and correction ]
The source code of this plugin is below. 
https://github.com/vektor-inc/vk-blocks

Global Bootstrap Banner vs VK Blocks