Simple Banner - Version 2.9.0

Version Description

  • Added close button and settings.
  • Add .simple-banner-button class to allow custom close button styles.
  • Preview banner now scrolls with you down the page.
  • Updated documentation regarding cookies.
  • Other bug fixes.
Download this release

Release Info

Developer rpetersen29
Plugin Icon 128x128 Simple Banner
Version 2.9.0
Comparing to
See all releases

Code changes from version 2.8.0 to 2.9.0

Files changed (4) hide show
  1. readme.txt +28 -2
  2. simple-banner.css +16 -1
  3. simple-banner.js +68 -11
  4. simple-banner.php +176 -35
readme.txt CHANGED
@@ -3,8 +3,8 @@ Contributors: rpetersen29
3
  Donate link: https://www.paypal.me/rpetersenDev
4
  Tags: banner, banners, simple, announcement, announcements, cta, notification, bar, bars, free, hello bar, hellobar, pro
5
  Requires at least: 3.0.1
6
- Tested up to: 5.5.4
7
- Stable tag: 2.8.0
8
  License: GPLv2 or later
9
  License URI: http://www.gnu.org/licenses/gpl-2.0.html
10
 
@@ -76,6 +76,18 @@ In the meantime you can use the following custom JavaScript to disable on your h
76
 
77
  Yes, but you should look through the support topics before you decide if you need the pro version.
78
 
 
 
 
 
 
 
 
 
 
 
 
 
79
  = How do I disable the banner in my posts? =
80
 
81
  This feature is being actively developed, in the meantime you can use this custom JavaScript:
@@ -106,6 +118,13 @@ Set your banner position to <code>relative</code> and try this in 'Website Custo
106
 
107
  == Changelog ==
108
 
 
 
 
 
 
 
 
109
  = 2.8.0 =
110
  * Add `.simple-banner-text` class to allow custom text styles. Removed text from page source code when disabled.
111
 
@@ -231,6 +250,13 @@ Set your banner position to <code>relative</code> and try this in 'Website Custo
231
 
232
  == Upgrade Notice ==
233
 
 
 
 
 
 
 
 
234
  = 2.8.0 =
235
  * Add `.simple-banner-text` class to allow custom text styles. Removed text from page source code when disabled.
236
 
3
  Donate link: https://www.paypal.me/rpetersenDev
4
  Tags: banner, banners, simple, announcement, announcements, cta, notification, bar, bars, free, hello bar, hellobar, pro
5
  Requires at least: 3.0.1
6
+ Tested up to: 5.6.0
7
+ Stable tag: 2.9.0
8
  License: GPLv2 or later
9
  License URI: http://www.gnu.org/licenses/gpl-2.0.html
10
 
76
 
77
  Yes, but you should look through the support topics before you decide if you need the pro version.
78
 
79
+ = Does this plugin use cookies =
80
+
81
+ Yes, they are used only if you enable the close button. These cookies fall under the category of "strictly necessary cookies" and do not need consent from the user, more information <a target="_blank" href="https://gdpr.eu/cookies/">here</a>.
82
+ If cookies are disabled on the user's browser, the banners close button expiration setting will not work and the banner will show on each refresh.
83
+
84
+ = How do I re-enable my banner after I hit the close button =
85
+
86
+ You can clear your browser's cookies or in the browser's console you can execute:
87
+
88
+ `document.cookie = "simplebannerclosed=; expires=Thu, 01 Jan 1970 00:00:00 UTC;";
89
+ `
90
+
91
  = How do I disable the banner in my posts? =
92
 
93
  This feature is being actively developed, in the meantime you can use this custom JavaScript:
118
 
119
  == Changelog ==
120
 
121
+ = 2.9.0 =
122
+ * Added close button and settings.
123
+ * Add `.simple-banner-button` class to allow custom close button styles.
124
+ * Preview banner now scrolls with you down the page.
125
+ * Updated documentation regarding cookies.
126
+ * Other bug fixes.
127
+
128
  = 2.8.0 =
129
  * Add `.simple-banner-text` class to allow custom text styles. Removed text from page source code when disabled.
130
 
250
 
251
  == Upgrade Notice ==
252
 
253
+ = 2.9.0 =
254
+ * Added close button and settings.
255
+ * Add `.simple-banner-button` class to allow custom close button styles.
256
+ * Preview banner now scrolls with you down the page.
257
+ * Updated documentation regarding cookies.
258
+ * Other bug fixes.
259
+
260
  = 2.8.0 =
261
  * Add `.simple-banner-text` class to allow custom text styles. Removed text from page source code when disabled.
262
 
simple-banner.css CHANGED
@@ -8,5 +8,20 @@
8
 
9
  .simple-banner .simple-banner-text {
10
  font-weight: 700;
11
- padding: 10px;
12
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
8
 
9
  .simple-banner .simple-banner-text {
10
  font-weight: 700;
11
+ padding: 10px 20px;
12
  }
13
+
14
+ .simple-banner .simple-banner-button {
15
+ border: none;
16
+ background-color: transparent;
17
+ padding: 0 5px;
18
+ margin: 0 10px;
19
+ text-align: center;
20
+ text-decoration: none;
21
+ position: absolute;
22
+ transform: translate(0%, -50%);
23
+ right: 0;
24
+ top: 50%;
25
+ font-size: 16px;
26
+ cursor: pointer;
27
+ }
simple-banner.js CHANGED
@@ -1,10 +1,14 @@
1
  jQuery(document).ready(function ($) {
 
 
 
2
  if (scriptParams.simple_banner_text != "") {
3
- // Banner text is set to "" if disabled so this extra `!scriptParams.in_array` is unnecessary,
4
- // Leaving in for potential backwards compatibility issues, revisit when testing is done.
5
- if (!scriptParams.pro_version_enabled || (scriptParams.pro_version_enabled && !scriptParams.in_array)) {
6
  if (!scriptParams.wp_body_open || !scriptParams.wp_body_open_enabled) {
7
- $('<div id="simple-banner" class="simple-banner"><div class="simple-banner-text"><span>' + scriptParams.simple_banner_text + '</span></div></div>')
 
 
 
8
  .prependTo('body');
9
  }
10
 
@@ -18,18 +22,71 @@ jQuery(document).ready(function ($) {
18
  $('head').append('<style type="text/css" media="screen">.simple-banner{margin-right:-' + bodyPaddingRight + ';padding-right:' + bodyPaddingRight + ';}</style>');
19
  }
20
  }
 
 
 
 
 
 
 
 
 
 
 
 
21
  }
22
 
23
- // Add scrolling class
24
- window.onscroll = function() {scrollClass()};
25
- function scrollClass() {
26
- var scroll = document.documentElement.scrollTop;
 
 
 
 
 
 
 
 
 
 
27
 
28
- if (scroll > $("#simple-banner").height()) {
29
- $("#simple-banner").addClass("simple-banner-scrolling");
 
 
 
 
 
30
  } else {
31
- $("#simple-banner").removeClass("simple-banner-scrolling");
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
32
  }
 
33
  }
34
 
35
  // Debug Mode
1
  jQuery(document).ready(function ($) {
2
+ // Banner text is set to "" if disabled so this extra `!scriptParams.disabled_on_current_page` is unnecessary,
3
+ // Leaving in for potential backwards compatibility issues, revisit when testing is done.
4
+ var simpleBannerVisible = !scriptParams.pro_version_enabled || (scriptParams.pro_version_enabled && !scriptParams.disabled_on_current_page);
5
  if (scriptParams.simple_banner_text != "") {
6
+ if (simpleBannerVisible) {
 
 
7
  if (!scriptParams.wp_body_open || !scriptParams.wp_body_open_enabled) {
8
+ var closeButton = scriptParams.close_button_enabled ? '<button id="simple-banner-close-button" class="simple-banner-button">&#x2715;</button>' : '';
9
+ $('<div id="simple-banner" class="simple-banner"><div class="simple-banner-text"><span>'
10
+ + scriptParams.simple_banner_text
11
+ + '</span></div>' + closeButton + '</div>')
12
  .prependTo('body');
13
  }
14
 
22
  $('head').append('<style type="text/css" media="screen">.simple-banner{margin-right:-' + bodyPaddingRight + ';padding-right:' + bodyPaddingRight + ';}</style>');
23
  }
24
  }
25
+
26
+ // Add scrolling class
27
+ window.onscroll = function() {scrollClass()};
28
+ function scrollClass() {
29
+ var scroll = document.documentElement.scrollTop;
30
+
31
+ if (scroll > $("#simple-banner").height()) {
32
+ $("#simple-banner").addClass("simple-banner-scrolling");
33
+ } else {
34
+ $("#simple-banner").removeClass("simple-banner-scrolling");
35
+ }
36
+ }
37
  }
38
 
39
+
40
+ // Add close button function to close button and close if cookie found
41
+ if (simpleBannerVisible) {
42
+ var sbCookie = "simplebannerclosed";
43
+ if (scriptParams.close_button_enabled){
44
+ if (getCookie(sbCookie) === "true") {
45
+ closeBanner();
46
+ } else {
47
+ var expiration = parseInt(scriptParams.close_button_expiration) || 30;
48
+ document.getElementById("simple-banner-close-button").onclick = function() {
49
+ closeBanner();
50
+ setCookie(sbCookie, "true", expiration);
51
+ };
52
+ }
53
 
54
+ function closeBanner() {
55
+ if (!scriptParams.keep_site_custom_css && document.getElementById('simple-banner-site-custom-css')) document.getElementById('simple-banner-site-custom-css').remove();
56
+ if (!scriptParams.keep_site_custom_js && document.getElementById('simple-banner-site-custom-js')) document.getElementById('simple-banner-site-custom-js').remove();
57
+ if (document.getElementById('simple-banner-header-margin')) document.getElementById('simple-banner-header-margin').remove();
58
+ if (document.getElementById('simple-banner-header-padding')) document.getElementById('simple-banner-header-padding').remove();
59
+ if (document.getElementById('simple-banner')) document.getElementById('simple-banner').remove();
60
+ }
61
  } else {
62
+ // disable cookie if it exists
63
+ if (getCookie(sbCookie) === "true") {
64
+ document.cookie = "simplebannerclosed=true; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
65
+ }
66
+ }
67
+ }
68
+
69
+ // Cookie Getter/Setter
70
+ function setCookie(cname,cvalue,exdays) {
71
+ var d = new Date();
72
+ d.setTime(d.getTime() + (exdays*24*60*60*1000));
73
+ var expires = "expires=" + d.toGMTString();
74
+ document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
75
+ }
76
+ function getCookie(cname) {
77
+ var name = cname + "=";
78
+ var decodedCookie = decodeURIComponent(document.cookie);
79
+ var ca = decodedCookie.split(';');
80
+ for(var i = 0; i < ca.length; i++) {
81
+ var c = ca[i];
82
+ while (c.charAt(0) == ' ') {
83
+ c = c.substring(1);
84
+ }
85
+ if (c.indexOf(name) == 0) {
86
+ return c.substring(name.length, c.length);
87
+ }
88
  }
89
+ return "";
90
  }
91
 
92
  // Debug Mode
simple-banner.php CHANGED
@@ -3,16 +3,16 @@
3
  * Plugin Name: Simple Banner
4
  * Plugin URI: https://github.com/rpetersen29/simple-banner
5
  * Description: Display a simple banner at the top of your website.
6
- * Version: 2.8.0
7
  * Author: Ryan Petersen
8
  * Author URI: http://rpetersen29.github.io/
9
  * License: GPL2
10
  *
11
  * @package Simple Banner
12
- * @version 2.8.0
13
  * @author Ryan Petersen <rpetersen.dev@gmail.com>
14
  */
15
- define ('VERSION', '2.8.0');
16
 
17
  register_activation_hook( __FILE__, 'simple_banner_activate' );
18
  function simple_banner_activate() {
@@ -25,16 +25,18 @@ function simple_banner() {
25
  wp_register_style('simple-banner-style', plugin_dir_url( __FILE__ ) .'simple-banner.css', '', VERSION);
26
  wp_enqueue_style('simple-banner-style');
27
  // Set Script parameters
28
- $in_disabled_array = in_array(get_the_ID(), explode(",", get_option('disabled_pages_array')));
 
29
  $script_params = array(
30
  // script specific parameters
 
31
  'hide_simple_banner' => get_option('hide_simple_banner'),
32
  'simple_banner_position' => get_option('simple_banner_position'),
33
  'header_margin' => get_option('header_margin'),
34
  'header_padding' => get_option('header_padding'),
35
  'simple_banner_text' => get_option('simple_banner_text'),
36
  'pro_version_enabled' => get_option('pro_version_enabled'),
37
- 'in_array' => $in_disabled_array,
38
  // debug specific parameters
39
  'debug_mode' => get_option('debug_mode'),
40
  'id' => get_the_ID(),
@@ -43,16 +45,19 @@ function simple_banner() {
43
  'simple_banner_color' => get_option('simple_banner_color'),
44
  'simple_banner_text_color' => get_option('simple_banner_text_color'),
45
  'simple_banner_link_color' => get_option('simple_banner_link_color'),
46
- 'simple_banner_text' => $in_disabled_array ? "" : get_option('simple_banner_text'),
47
  'simple_banner_custom_css' => get_option('simple_banner_custom_css'),
48
  'simple_banner_scrolling_custom_css' => get_option('simple_banner_scrolling_custom_css'),
49
  'simple_banner_text_custom_css' => get_option('simple_banner_text_custom_css'),
 
50
  'site_custom_css' => get_option('site_custom_css'),
51
  'keep_site_custom_css' => get_option('keep_site_custom_css'),
52
  'site_custom_js' => get_option('site_custom_js'),
53
  'keep_site_custom_js' => get_option('keep_site_custom_js'),
54
  'wp_body_open_enabled' => get_option('wp_body_open_enabled'),
55
- 'wp_body_open' => function_exists( 'wp_body_open' )
 
 
56
  );
57
  // Enqueue the script
58
  wp_register_script('simple-banner-script', plugin_dir_url( __FILE__ ) . 'simple-banner.js', array( 'jquery' ), VERSION);
@@ -66,8 +71,18 @@ if ( function_exists( 'wp_body_open' ) && get_option('wp_body_open_enabled') ) {
66
  }
67
  function simple_banner_body_open() {
68
  // if not disabled use wp_body_open
69
- if (!in_array(get_the_ID(), explode(",", get_option('disabled_pages_array')))) {
70
- echo '<div id="simple-banner" class="simple-banner"><div class="simple-banner-text"><span>' . get_option('simple_banner_text') . '</span></div></div>';
 
 
 
 
 
 
 
 
 
 
71
  }
72
  }
73
 
@@ -75,23 +90,30 @@ function simple_banner_body_open() {
75
  add_action( 'wp_head', 'simple_banner_custom_color');
76
  function simple_banner_custom_color()
77
  {
 
 
78
  $disabled_pages = get_option('disabled_pages_array');
79
  $disabled_on_current_page = !empty($disabled_pages) && in_array(get_the_ID(), explode(',', $disabled_pages));
80
  $banner_is_disabled = $disabled_on_current_page || get_option('hide_simple_banner') == "yes";
81
- if ($banner_is_disabled){
 
82
  echo '<style type="text/css" media="screen">.simple-banner{display:none;}</style>';
83
  }
84
 
85
- if (!$banner_is_disabled && get_option('header_margin') != ""){
86
- echo '<style type="text/css" media="screen">header{margin-top:' . get_option('header_margin') . ';}</style>';
87
  }
88
 
89
- if (!$banner_is_disabled && get_option('header_padding') != ""){
90
- echo '<style type="text/css" media="screen">header{padding-top:' . get_option('header_padding') . ';}</style>';
91
  }
92
 
93
  if (get_option('simple_banner_position') != ""){
94
- echo '<style type="text/css" media="screen">.simple-banner{position:' . get_option('simple_banner_position') . ';}</style>';
 
 
 
 
95
  }
96
 
97
  if (get_option('simple_banner_font_size') != ""){
@@ -128,14 +150,18 @@ function simple_banner_custom_color()
128
  echo '<style type="text/css" media="screen">.simple-banner .simple-banner-text{'. get_option('simple_banner_text_custom_css') . '}</style>';
129
  }
130
 
131
- $remove_site_custom_css = $banner_is_disabled && get_option('keep_site_custom_css') == "";
 
 
 
 
132
  if (!$remove_site_custom_css && get_option('site_custom_css') != "" && get_option('pro_version_enabled')) {
133
- echo '<style type="text/css" media="screen">'. get_option('site_custom_css') . '</style>';
134
  }
135
 
136
- $remove_site_custom_js = $banner_is_disabled && get_option('keep_site_custom_js') == "";
137
  if (!$remove_site_custom_js && get_option('site_custom_js') != "" && get_option('pro_version_enabled')) {
138
- echo '<script type="text/javascript">'. get_option('site_custom_js') . '</script>';
139
  }
140
  }
141
 
@@ -183,6 +209,7 @@ function simple_banner_settings() {
183
  register_setting( 'simple-banner-settings-group', 'simple_banner_custom_css' );
184
  register_setting( 'simple-banner-settings-group', 'simple_banner_scrolling_custom_css' );
185
  register_setting( 'simple-banner-settings-group', 'simple_banner_text_custom_css' );
 
186
  register_setting( 'simple-banner-settings-group', 'simple_banner_position' );
187
  register_setting( 'simple-banner-settings-group', 'header_margin' );
188
  register_setting( 'simple-banner-settings-group', 'header_padding' );
@@ -196,6 +223,8 @@ function simple_banner_settings() {
196
  register_setting( 'simple-banner-settings-group', 'keep_site_custom_js' );
197
  register_setting( 'simple-banner-settings-group', 'debug_mode' );
198
  register_setting( 'simple-banner-settings-group', 'wp_body_open_enabled' );
 
 
199
  }
200
 
201
  function simple_banner_settings_page() {
@@ -208,6 +237,10 @@ function simple_banner_settings_page() {
208
  }
209
  ?>
210
 
 
 
 
 
211
  <div class="wrap">
212
  <div style="display: flex;justify-content: space-between;">
213
  <h2>Simple Banner Settings</h2>
@@ -220,16 +253,18 @@ function simple_banner_settings_page() {
220
  <br />e.g. <code>This is a &lt;a href=&#34;http:&#47;&#47;www.wordpress.com&#34;&gt;Link to Wordpress&lt;&#47;a&gt;</code>.</p>
221
 
222
  <!-- Preview Banner -->
223
- <div id="preview_banner" class="simple-banner" style="width: 100%;text-align: center;">
224
- <div id="preview_banner_text" class="simple-banner-text" style="font-weight: 700;padding: 10px;">
225
- <span>This is what your banner will look like with a <a href="/">link</a>.</span>
 
 
226
  </div>
227
  </div>
228
  <br>
229
  <span><b>*Note: Font and text styles subject to change based on chosen theme CSS.</b></span>
230
 
231
  <!-- Settings Form -->
232
- <form method="post" action="options.php">
233
  <?php settings_fields( 'simple-banner-settings-group' ); ?>
234
  <?php do_settings_sections( 'simple-banner-settings-group' ); ?>
235
 
@@ -250,6 +285,36 @@ function simple_banner_settings_page() {
250
  <!-- -->
251
  </td>
252
  </tr>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
253
  <!-- Font Size -->
254
  <tr valign="top">
255
  <th scope="row">
@@ -315,16 +380,20 @@ function simple_banner_settings_page() {
315
  <tr valign="top">
316
  <th scope="row">
317
  Simple Banner Custom CSS
318
- <br><span style="font-weight:400;">CSS will be applied directly to the <code>simple-banner</code> class, the <code>simple-banner-scrolling</code> class for scrolling styles, and the <code>simple-banner-text</code> class for text specific styles.</span>
319
- <br><span style="font-weight:400;color:red;">Be very careful, bad CSS can break the banner.</span>
 
 
 
 
 
 
 
 
 
320
  </th>
321
  <td>
322
  <div style="display:flex">
323
- <div style="flex-grow:1;">
324
- <div>.simple-banner {</div>
325
- <textarea id="simple_banner_custom_css" class="code" style="height: 150px;width: 90%;" name="simple_banner_custom_css"><?php echo get_option('simple_banner_custom_css'); ?></textarea>
326
- <div>}</div>
327
- </div>
328
  <div style="flex-grow:1;">
329
  <div>.simple-banner-scrolling {</div>
330
  <textarea id="simple_banner_scrolling_custom_css" class="code" style="height: 150px;width: 90%;" name="simple_banner_scrolling_custom_css"><?php echo get_option('simple_banner_scrolling_custom_css'); ?></textarea>
@@ -335,6 +404,11 @@ function simple_banner_settings_page() {
335
  <textarea id="simple_banner_text_custom_css" class="code" style="height: 150px;width: 90%;" name="simple_banner_text_custom_css"><?php echo get_option('simple_banner_text_custom_css'); ?></textarea>
336
  <div>}</div>
337
  </div>
 
 
 
 
 
338
  </div>
339
  </td>
340
  </tr>
@@ -345,6 +419,9 @@ function simple_banner_settings_page() {
345
  <br><span style="font-weight:400;">Change the <code>position</code> value of your banner. More information <a target="_blank" href="https://www.w3schools.com/cssref/pr_class_position.asp">here</a></span>
346
  </th>
347
  <td style="vertical-align:top;">
 
 
 
348
  <!-- -->
349
  <input type="radio" id="static" name="simple_banner_position" value="static" <?php echo ((get_option('simple_banner_position') == 'static') ? 'checked' : '' ); ?>>
350
  <label for="static"><strong>static:</strong> <span>Default value. Elements render in order, as they appear in the document flow</span></label><br>
@@ -377,7 +454,7 @@ function simple_banner_settings_page() {
377
  <th scope="row">
378
  Header Top Margin
379
  <br><span style="font-weight:400;">Apply margin to the top of your theme header</span>
380
- <br><span style="font-weight:400;color:red;">Will be disabled if banner is hidden or disabled</span>
381
  </th>
382
  <td style="vertical-align:top;">
383
  <input type="text" id="header_margin" name="header_margin" placeholder="margin-top"
@@ -390,7 +467,7 @@ function simple_banner_settings_page() {
390
  <th scope="row">
391
  Header Top Padding
392
  <br><span style="font-weight:400;">Apply padding to the top of your theme header</span>
393
- <br><span style="font-weight:400;color:red;">Will be disabled if banner is hidden or disabled</span>
394
  </th>
395
  <td style="vertical-align:top;">
396
  <input type="text" id="header_padding" name="header_padding" placeholder="padding-top"
@@ -549,7 +626,7 @@ function simple_banner_settings_page() {
549
  </tr>
550
  <tr valign="top">
551
  <th scope="row" style="padding-top:0;">
552
- Keep CSS if banner is hidden or disabled?
553
  </th>
554
  <td style="padding-top:0;">
555
  <?php
@@ -580,7 +657,7 @@ function simple_banner_settings_page() {
580
  </tr>
581
  <tr valign="top">
582
  <th scope="row" style="padding-top:0;">
583
- Keep JS if banner is hidden or disabled?
584
  </th>
585
  <td style="padding-top:0;">
586
  <?php
@@ -620,19 +697,62 @@ function simple_banner_settings_page() {
620
 
621
  <!-- Script to apply styles to Preview Banner -->
622
  <script type="text/javascript">
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
623
  var style_font_size = document.createElement('style');
624
  var style_background_color = document.createElement('style');
625
  var style_link_color = document.createElement('style');
626
  var style_text_color = document.createElement('style');
 
 
627
  var style_custom_css = document.createElement('style');
628
  var style_custom_text_css = document.createElement('style');
 
629
 
630
  // Banner Text
631
- document.getElementById('preview_banner_text').innerHTML = document.getElementById('simple_banner_text').value != "" ? '<span>'+document.getElementById('simple_banner_text').value+'</span>' : '<span>This is what your banner will look like with a <a href="/">link</a>.</span>';
 
 
632
  document.getElementById('simple_banner_text').onchange=function(e){
633
  document.getElementById('preview_banner_text').innerHTML = e.target.value != "" ? '<span>'+e.target.value+'</span>' : '<span>This is what your banner will look like with a <a href="/">link</a>.</span>';
634
  };
635
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
636
  // Font Size
637
  style_font_size.type = 'text/css';
638
  style_font_size.id = 'preview_banner_font_size'
@@ -774,6 +894,27 @@ function simple_banner_settings_page() {
774
  document.getElementsByTagName('head')[0].appendChild(style_dynamic);
775
  };
776
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
777
  // Permissions
778
  document.getElementById('simple_banner_pro_permissions').onclick=function(e){
779
  let permissionsArray = [];
3
  * Plugin Name: Simple Banner
4
  * Plugin URI: https://github.com/rpetersen29/simple-banner
5
  * Description: Display a simple banner at the top of your website.
6
+ * Version: 2.9.0
7
  * Author: Ryan Petersen
8
  * Author URI: http://rpetersen29.github.io/
9
  * License: GPL2
10
  *
11
  * @package Simple Banner
12
+ * @version 2.9.0
13
  * @author Ryan Petersen <rpetersen.dev@gmail.com>
14
  */
15
+ define ('VERSION', '2.9.0');
16
 
17
  register_activation_hook( __FILE__, 'simple_banner_activate' );
18
  function simple_banner_activate() {
25
  wp_register_style('simple-banner-style', plugin_dir_url( __FILE__ ) .'simple-banner.css', '', VERSION);
26
  wp_enqueue_style('simple-banner-style');
27
  // Set Script parameters
28
+ $disabled_pages = get_option('disabled_pages_array');
29
+ $disabled_on_current_page = !empty($disabled_pages) && in_array(get_the_ID(), explode(',', $disabled_pages));
30
  $script_params = array(
31
  // script specific parameters
32
+ 'version' => VERSION,
33
  'hide_simple_banner' => get_option('hide_simple_banner'),
34
  'simple_banner_position' => get_option('simple_banner_position'),
35
  'header_margin' => get_option('header_margin'),
36
  'header_padding' => get_option('header_padding'),
37
  'simple_banner_text' => get_option('simple_banner_text'),
38
  'pro_version_enabled' => get_option('pro_version_enabled'),
39
+ 'disabled_on_current_page' => $disabled_on_current_page,
40
  // debug specific parameters
41
  'debug_mode' => get_option('debug_mode'),
42
  'id' => get_the_ID(),
45
  'simple_banner_color' => get_option('simple_banner_color'),
46
  'simple_banner_text_color' => get_option('simple_banner_text_color'),
47
  'simple_banner_link_color' => get_option('simple_banner_link_color'),
48
+ 'simple_banner_text' => $disabled_on_current_page ? "" : get_option('simple_banner_text'),
49
  'simple_banner_custom_css' => get_option('simple_banner_custom_css'),
50
  'simple_banner_scrolling_custom_css' => get_option('simple_banner_scrolling_custom_css'),
51
  'simple_banner_text_custom_css' => get_option('simple_banner_text_custom_css'),
52
+ 'simple_banner_button_css' => get_option('simple_banner_button_css'),
53
  'site_custom_css' => get_option('site_custom_css'),
54
  'keep_site_custom_css' => get_option('keep_site_custom_css'),
55
  'site_custom_js' => get_option('site_custom_js'),
56
  'keep_site_custom_js' => get_option('keep_site_custom_js'),
57
  'wp_body_open_enabled' => get_option('wp_body_open_enabled'),
58
+ 'wp_body_open' => function_exists('wp_body_open'),
59
+ 'close_button_enabled' => get_option('close_button_enabled'),
60
+ 'close_button_expiration' => get_option('close_button_expiration'),
61
  );
62
  // Enqueue the script
63
  wp_register_script('simple-banner-script', plugin_dir_url( __FILE__ ) . 'simple-banner.js', array( 'jquery' ), VERSION);
71
  }
72
  function simple_banner_body_open() {
73
  // if not disabled use wp_body_open
74
+ $disabled_pages = get_option('disabled_pages_array');
75
+ $close_button_enabled = get_option('close_button_enabled');
76
+ $disabled_on_current_page = !empty($disabled_pages) && in_array(get_the_ID(), explode(',', $disabled_pages));
77
+ $closed_cookie = $close_button_enabled && isset($_COOKIE["simplebannerclosed"]);
78
+ $closed_button = get_option('close_button_enabled') ? '<button id="simple-banner-close-button" class="simple-banner-button">&#x2715;</button>' : '';
79
+
80
+ if (!$disabled_on_current_page && !$closed_cookie) {
81
+ echo '<div id="simple-banner" class="simple-banner"><div class="simple-banner-text"><span>'
82
+ . get_option('simple_banner_text')
83
+ . '</span></div>'
84
+ . $closed_button
85
+ . '</div>';
86
  }
87
  }
88
 
90
  add_action( 'wp_head', 'simple_banner_custom_color');
91
  function simple_banner_custom_color()
92
  {
93
+ $closed_cookie = get_option('close_button_enabled') && isset($_COOKIE["simplebannerclosed"]);
94
+
95
  $disabled_pages = get_option('disabled_pages_array');
96
  $disabled_on_current_page = !empty($disabled_pages) && in_array(get_the_ID(), explode(',', $disabled_pages));
97
  $banner_is_disabled = $disabled_on_current_page || get_option('hide_simple_banner') == "yes";
98
+
99
+ if ($banner_is_disabled || $closed_cookie){
100
  echo '<style type="text/css" media="screen">.simple-banner{display:none;}</style>';
101
  }
102
 
103
+ if (!$banner_is_disabled && !$closed_cookie && get_option('header_margin') != ""){
104
+ echo '<style id="simple-banner-header-margin" type="text/css" media="screen">header{margin-top:' . get_option('header_margin') . ';}</style>';
105
  }
106
 
107
+ if (!$banner_is_disabled && !$closed_cookie && get_option('header_padding') != ""){
108
+ echo '<style id="simple-banner-header-padding" type="text/css" media="screen">header{padding-top:' . get_option('header_padding') . ';}</style>';
109
  }
110
 
111
  if (get_option('simple_banner_position') != ""){
112
+ if (get_option('simple_banner_position') == 'footer'){
113
+ echo '<style type="text/css" media="screen">.simple-banner{position:fixed;bottom:0;}</style>';
114
+ } else {
115
+ echo '<style type="text/css" media="screen">.simple-banner{position:' . get_option('simple_banner_position') . ';}</style>';
116
+ }
117
  }
118
 
119
  if (get_option('simple_banner_font_size') != ""){
150
  echo '<style type="text/css" media="screen">.simple-banner .simple-banner-text{'. get_option('simple_banner_text_custom_css') . '}</style>';
151
  }
152
 
153
+ if (get_option('simple_banner_button_css') != ""){
154
+ echo '<style type="text/css" media="screen">.simple-banner .simple-banner-button{'. get_option('simple_banner_button_css') . '}</style>';
155
+ }
156
+
157
+ $remove_site_custom_css = ($banner_is_disabled || $closed_cookie) && get_option('keep_site_custom_css') == "";
158
  if (!$remove_site_custom_css && get_option('site_custom_css') != "" && get_option('pro_version_enabled')) {
159
+ echo '<style id="simple-banner-site-custom-css" type="text/css" media="screen">'. get_option('site_custom_css') . '</style>';
160
  }
161
 
162
+ $remove_site_custom_js = ($banner_is_disabled || $closed_cookie) && get_option('keep_site_custom_js') == "";
163
  if (!$remove_site_custom_js && get_option('site_custom_js') != "" && get_option('pro_version_enabled')) {
164
+ echo '<script id="simple-banner-site-custom-js" type="text/javascript">'. get_option('site_custom_js') . '</script>';
165
  }
166
  }
167
 
209
  register_setting( 'simple-banner-settings-group', 'simple_banner_custom_css' );
210
  register_setting( 'simple-banner-settings-group', 'simple_banner_scrolling_custom_css' );
211
  register_setting( 'simple-banner-settings-group', 'simple_banner_text_custom_css' );
212
+ register_setting( 'simple-banner-settings-group', 'simple_banner_button_css' );
213
  register_setting( 'simple-banner-settings-group', 'simple_banner_position' );
214
  register_setting( 'simple-banner-settings-group', 'header_margin' );
215
  register_setting( 'simple-banner-settings-group', 'header_padding' );
223
  register_setting( 'simple-banner-settings-group', 'keep_site_custom_js' );
224
  register_setting( 'simple-banner-settings-group', 'debug_mode' );
225
  register_setting( 'simple-banner-settings-group', 'wp_body_open_enabled' );
226
+ register_setting( 'simple-banner-settings-group', 'close_button_enabled' );
227
+ register_setting( 'simple-banner-settings-group', 'close_button_expiration' );
228
  }
229
 
230
  function simple_banner_settings_page() {
237
  }
238
  ?>
239
 
240
+ <style type="text/css" id="settings_stylesheet">
241
+ .simple-banner-settings-form th {width: 30%;}
242
+ </style>
243
+
244
  <div class="wrap">
245
  <div style="display: flex;justify-content: space-between;">
246
  <h2>Simple Banner Settings</h2>
253
  <br />e.g. <code>This is a &lt;a href=&#34;http:&#47;&#47;www.wordpress.com&#34;&gt;Link to Wordpress&lt;&#47;a&gt;</code>.</p>
254
 
255
  <!-- Preview Banner -->
256
+ <div id="preview_banner_container" style="min-height: 40px;">
257
+ <div id="preview_banner" class="simple-banner" style="width: 100%;text-align: center;">
258
+ <div id="preview_banner_text" class="simple-banner-text" style="font-weight: 700;padding: 10px;">
259
+ <span>This is what your banner will look like with a <a href="/">link</a>.</span>
260
+ </div>
261
  </div>
262
  </div>
263
  <br>
264
  <span><b>*Note: Font and text styles subject to change based on chosen theme CSS.</b></span>
265
 
266
  <!-- Settings Form -->
267
+ <form class="simple-banner-settings-form" method="post" action="options.php">
268
  <?php settings_fields( 'simple-banner-settings-group' ); ?>
269
  <?php do_settings_sections( 'simple-banner-settings-group' ); ?>
270
 
285
  <!-- -->
286
  </td>
287
  </tr>
288
+ <!-- Close Button -->
289
+ <tr valign="top">
290
+ <th scope="row">
291
+ Close button enabled
292
+ <br>
293
+ <span style="font-weight:400;">
294
+ This feature uses strictly necessary cookies which do not require consent from users per <a href="https://gdpr.eu/cookies/">GDPR</a> guidelines
295
+ </span>
296
+ </th>
297
+ <td>
298
+ <?php
299
+ $checked = get_option('close_button_enabled') ? 'checked ' : '';
300
+ echo '<input type="checkbox" id="close_button_enabled" '. $checked . ' name="close_button_enabled" />';
301
+ ?>
302
+ </td>
303
+ </tr>
304
+ <!-- Close Button -->
305
+ <tr valign="top">
306
+ <th scope="row">
307
+ Close button expiration
308
+ <br>
309
+ <span style="font-weight:400;">
310
+ The amount of days until the close button action will be expire. Default is 30.
311
+ </span>
312
+ </th>
313
+ <td>
314
+ <input type="number" min="1" max="30" id="close_button_expiration" name="close_button_expiration"
315
+ value="<?php echo esc_attr( get_option('close_button_expiration') ); ?>" />
316
+ </td>
317
+ </tr>
318
  <!-- Font Size -->
319
  <tr valign="top">
320
  <th scope="row">
380
  <tr valign="top">
381
  <th scope="row">
382
  Simple Banner Custom CSS
383
+ </th>
384
+ <td>
385
+ <span style="font-weight:400;">CSS will be applied directly to the <code>simple-banner</code> class, the <code>simple-banner-scrolling</code> class for scrolling styles, the <code>simple-banner-text</code> class for text specific styles, and the <code>simple-banner-button</code> class for close button specific styles.</span>
386
+ <span style="font-weight:400;color:red;">Be very careful, bad CSS can break the banner.</span>
387
+ </td>
388
+ </tr>
389
+ <tr valign="top">
390
+ <th scope="row" style="font-weight:400;">
391
+ <div>.simple-banner {</div>
392
+ <textarea id="simple_banner_custom_css" class="code" style="height: 150px;width: 90%;" name="simple_banner_custom_css"><?php echo get_option('simple_banner_custom_css'); ?></textarea>
393
+ <div>}</div>
394
  </th>
395
  <td>
396
  <div style="display:flex">
 
 
 
 
 
397
  <div style="flex-grow:1;">
398
  <div>.simple-banner-scrolling {</div>
399
  <textarea id="simple_banner_scrolling_custom_css" class="code" style="height: 150px;width: 90%;" name="simple_banner_scrolling_custom_css"><?php echo get_option('simple_banner_scrolling_custom_css'); ?></textarea>
404
  <textarea id="simple_banner_text_custom_css" class="code" style="height: 150px;width: 90%;" name="simple_banner_text_custom_css"><?php echo get_option('simple_banner_text_custom_css'); ?></textarea>
405
  <div>}</div>
406
  </div>
407
+ <div style="flex-grow:1;">
408
+ <div>.simple-banner-button {</div>
409
+ <textarea id="simple_banner_button_css" class="code" style="height: 150px;width: 90%;" name="simple_banner_button_css"><?php echo get_option('simple_banner_button_css'); ?></textarea>
410
+ <div>}</div>
411
+ </div>
412
  </div>
413
  </td>
414
  </tr>
419
  <br><span style="font-weight:400;">Change the <code>position</code> value of your banner. More information <a target="_blank" href="https://www.w3schools.com/cssref/pr_class_position.asp">here</a></span>
420
  </th>
421
  <td style="vertical-align:top;">
422
+ <!-- -->
423
+ <input type="radio" id="footer" name="simple_banner_position" value="footer" <?php echo ((get_option('simple_banner_position') == 'footer') ? 'checked' : '' ); ?>>
424
+ <label for="footer"><strong>footer:</strong> <span>The banner is fixed on the bottom of the window</span></label><br>
425
  <!-- -->
426
  <input type="radio" id="static" name="simple_banner_position" value="static" <?php echo ((get_option('simple_banner_position') == 'static') ? 'checked' : '' ); ?>>
427
  <label for="static"><strong>static:</strong> <span>Default value. Elements render in order, as they appear in the document flow</span></label><br>
454
  <th scope="row">
455
  Header Top Margin
456
  <br><span style="font-weight:400;">Apply margin to the top of your theme header</span>
457
+ <br><span style="font-weight:400;color:red;">Will be disabled if banner is hidden, disabled, or closed</span>
458
  </th>
459
  <td style="vertical-align:top;">
460
  <input type="text" id="header_margin" name="header_margin" placeholder="margin-top"
467
  <th scope="row">
468
  Header Top Padding
469
  <br><span style="font-weight:400;">Apply padding to the top of your theme header</span>
470
+ <br><span style="font-weight:400;color:red;">Will be disabled if banner is hidden, disabled, or closed</span>
471
  </th>
472
  <td style="vertical-align:top;">
473
  <input type="text" id="header_padding" name="header_padding" placeholder="padding-top"
626
  </tr>
627
  <tr valign="top">
628
  <th scope="row" style="padding-top:0;">
629
+ Keep CSS if banner is hidden, disabled, or closed?
630
  </th>
631
  <td style="padding-top:0;">
632
  <?php
657
  </tr>
658
  <tr valign="top">
659
  <th scope="row" style="padding-top:0;">
660
+ Keep JS if banner is hidden, disabled, or closed?
661
  </th>
662
  <td style="padding-top:0;">
663
  <?php
697
 
698
  <!-- Script to apply styles to Preview Banner -->
699
  <script type="text/javascript">
700
+ // Simple Banner Default Stylesheet
701
+ var simple_banner_css = document.createElement('link');
702
+ simple_banner_css.id = 'simple-banner-stylesheet';
703
+ simple_banner_css.rel = 'stylesheet';
704
+ simple_banner_css.href = "<?php echo plugin_dir_url( __FILE__ ) .'simple-banner.css' ?>";
705
+ document.getElementsByTagName('head')[0].appendChild(simple_banner_css);
706
+
707
+ // Fixed Preview Banner on scroll
708
+ window.onscroll = function() {fixedBanner()};
709
+ function fixedBanner() {
710
+ var elementContainer = document.getElementById('preview_banner_container');
711
+ var elementTarget = document.getElementById('preview_banner');
712
+ if (window.scrollY > (elementContainer.offsetTop)) {
713
+ elementTarget.style.position = 'fixed';
714
+ elementTarget.style.width = '83.671%';
715
+ elementTarget.style.top = '40px';
716
+ } else {
717
+ elementTarget.style.position = 'relative';
718
+ elementTarget.style.width = '100%';
719
+ elementTarget.style.top = '0';
720
+ }
721
+ }
722
+
723
  var style_font_size = document.createElement('style');
724
  var style_background_color = document.createElement('style');
725
  var style_link_color = document.createElement('style');
726
  var style_text_color = document.createElement('style');
727
+ // TODO: Add close color with UI updates
728
+ // var style_close_color = document.createElement('style');
729
  var style_custom_css = document.createElement('style');
730
  var style_custom_text_css = document.createElement('style');
731
+ var style_custom_button_css = document.createElement('style');
732
 
733
  // Banner Text
734
+ document.getElementById('preview_banner_text').innerHTML = document.getElementById('simple_banner_text').value != "" ?
735
+ '<span>'+document.getElementById('simple_banner_text').value+'</span>' :
736
+ '<span>This is what your banner will look like with a <a href="/">link</a>.</span>';
737
  document.getElementById('simple_banner_text').onchange=function(e){
738
  document.getElementById('preview_banner_text').innerHTML = e.target.value != "" ? '<span>'+e.target.value+'</span>' : '<span>This is what your banner will look like with a <a href="/">link</a>.</span>';
739
  };
740
 
741
+ // Close Button
742
+ var closeButton = '<button id="simple-banner-close-button" class="simple-banner-button">✕</button>';
743
+ var closeButtonChecked = document.getElementById('close_button_enabled').checked;
744
+ var closeButtonInitialValue = closeButtonChecked ? closeButton : '';
745
+ document.getElementById('preview_banner').innerHTML = document.getElementById('preview_banner').innerHTML + closeButtonInitialValue;
746
+ document.getElementById('close_button_enabled').onchange=function(e){
747
+ var str = document.getElementById('preview_banner').innerHTML;
748
+ if (e.target.checked) {
749
+ document.getElementById('preview_banner').innerHTML = str + closeButton;
750
+ } else {
751
+ var res = str.replace(closeButton, '');
752
+ document.getElementById('preview_banner').innerHTML = res;
753
+ }
754
+ };
755
+
756
  // Font Size
757
  style_font_size.type = 'text/css';
758
  style_font_size.id = 'preview_banner_font_size'
894
  document.getElementsByTagName('head')[0].appendChild(style_dynamic);
895
  };
896
 
897
+ // Custom Button CSS
898
+ style_custom_button_css.type = 'text/css';
899
+ style_custom_button_css.id = 'preview_banner_custom_button_stylesheet'
900
+ style_custom_button_css.appendChild(document.createTextNode('.simple-banner .simple-banner-button{'+document.getElementById('simple_banner_button_css').value+'}'));
901
+ document.getElementsByTagName('head')[0].appendChild(style_custom_button_css);
902
+
903
+ document.getElementById('simple_banner_button_css').onchange=function(){
904
+ var child = document.getElementById('preview_banner_custom_button_stylesheet');
905
+ if (child){child.innerText = "";child.id='';}
906
+
907
+ var style_dynamic = document.createElement('style');
908
+ style_dynamic.type = 'text/css';
909
+ style_dynamic.id = 'preview_banner_custom_button_stylesheet';
910
+ style_dynamic.appendChild(
911
+ document.createTextNode(
912
+ '.simple-banner .simple-banner-button{'+document.getElementById('simple_banner_button_css').value+'}'
913
+ )
914
+ );
915
+ document.getElementsByTagName('head')[0].appendChild(style_dynamic);
916
+ };
917
+
918
  // Permissions
919
  document.getElementById('simple_banner_pro_permissions').onclick=function(e){
920
  let permissionsArray = [];