website.tld
↳ wp-content
↳ plugins
↳ notification-bar
↳ notification-bar.php
<?php
/*
Plugin Name: Notification Bar
Plugin URI: https://fixupfox.com/
Description: Display a notification for
visitors on the frontend of your site!
Version: 1.0
Author: wolfpaw
Author URI: https://davidwolfpaw.com/
*/
/**
* Creates a link to the settings page under
* the WordPress Settings in the dashboard
*/
add_action( 'admin_menu', 'wnb_general_settings_page' );
function wnb_general_settings_page() {
add_submenu_page(
'options-general.php',
__( 'Notification Bar', 'notification-bar' ),
__( 'Notification Bar', 'notification-bar' ),
'manage_options',
'notification_bar',
'wnb_render_settings_page'
);
}
//* Creates the settings page
function wnb_render_settings_page() {
?>
<!-- Create a header in the default WordPress 'wrap' container -->
<div class="wrap">
<h2>
<?php esc_html_e( 'Notification Bar Settings', 'notification-bar' ); ?>
</h2>
<form method="post" action="options.php">
<?php
// Get settings for the plugin to display
settings_fields( 'wnb_general_settings' );
do_settings_sections( 'wnb_general_settings' );
// Form submit button
submit_button();
?>
</form>
</div><!-- /.wrap -->
<?php
}
/**
* Creates settings for the plugin
*/
add_action( 'admin_init', 'wnb_initialize_settings' );
function wnb_initialize_settings() {
add_settings_section(
// ID used to identify this section and with which to register options
'general_section',
// Title to be displayed on the administration page
__( 'General Settings', 'notification-bar' ),
// Callback used to render the description of the section
'general_settings_callback',
// Page on which to add this section of options
'wnb_general_settings'
);
add_settings_field(
// ID used to identify this field
'notification_text',
// Title to be displayed for this field
__( 'Notification Text', 'notification-bar' ),
// The function that creates this field
'text_input_callback',
// The page that this setting goes under
'wnb_general_settings',
// The section that this setting goes under
'general_section',
// Arguments that describe this field
array(
'label_for' => 'notification_text',
'option_group' => 'nb_general_settings',
'option_id' => 'notification_text',
)
);
add_settings_field(
'display_location',
__( 'Where will the notification bar display?', 'notification-bar' ),
'radio_input_callback',
'wnb_general_settings',
'general_section',
array(
'label_for' => 'display_location',
'option_group' => 'nb_general_settings',
'option_id' => 'display_location',
'option_description' => 'Display notification bar
on bottom of the site',
'radio_options' => array(
'display_none' => 'Do not display notification bar',
'display_top' => 'Display notification bar on the
top of the site',
'display_bottom' => 'Display notification bar on the
bottom of the site',
),
)
);
// Register the settings to the field section
register_setting(
'wnb_general_settings',
'nb_general_settings'
);
}
/**
* Displays the header of the general settings
*/
function general_settings_callback() {
esc_html_e( 'Notification Bar Settings', 'notification-bar' );
}
/**
* Text Input Callbacks
*/
function text_input_callback( $text_input ) {
// Get arguments from setting
$option_group = $text_input['option_group'];
$option_id = $text_input['option_id'];
$option_name = "{$option_group}[{$option_id}]";
// Get existing option from database
$options = get_option( $option_group );
$option_value =
isset( $options[ $option_id ] ) ? $options[ $option_id ] : '';
// Render the output
echo "<input type='text' size='50' id='{$option_id}'
name='{$option_name}' value='{$option_value}' />";
}
function radio_input_callback( $radio_input ) {
// Get arguments from setting
$option_group = $radio_input['option_group'];
$option_id = $radio_input['option_id'];
$radio_options = $radio_input['radio_options'];
$option_name = "{$option_group}[{$option_id}]";
// Get existing option from database
$options = get_option( $option_group );
$option_value =
isset( $options[ $option_id ] ) ? $options[ $option_id ] : '';
// Render the output
$input = '';
foreach ( $radio_options as $radio_option_id => $radio_option_value ) {
$input .= "<input type='radio' id='{$radio_option_id}'
name='{$option_name}' value='{$radio_option_id}' "
. checked( $radio_option_id, $option_value, false ) . ' />';
$input .= "<label for='{$radio_option_id}'>{$radio_option_value}</label><br />";
}
echo $input;
}
/**
* Displays the notification bar on the frontend of the site
*/
add_action( 'wp_footer', 'wnb_display_notification_bar' );
function wnb_display_notification_bar() {
if ( null !== get_option( 'nb_general_settings' ) ) {
$options = get_option( 'nb_general_settings' );
?>
<div class="notification-bar
<?php echo $options['display_location']; ?>">
<div class="notification-text">
<?php echo $options['notification_text']; ?>
</div>
</div>
<?php
}
}
/**
* Loads plugin scripts and styles
*/
add_action( 'wp_enqueue_scripts', 'wnb_scripts' );
function wnb_scripts() {
wp_enqueue_style(
'notification-bar-css',
plugin_dir_url( __FILE__ ) . 'notification-bar.css',
array(),
'1.0.0'
);
}
.notification-bar {
position: relative;
width: 100%;
background: #000;
color: #FFFFFF;
text-align: center;
}
.notification-bar.display_top {
top: 0;
position: absolute;
}
.notification-bar.display_bottom {
bottom: 0;
position: relative;
}
.notification-text {
padding: 10px
}
.admin-bar .notification-bar.display_top {
top: 46px;
}
add_settings_field(
'display_sticky',
__( 'Will the notificaton bar be sticky?', 'notification-bar' ),
'radio_input_callback',
'wnb_general_settings',
'general_section',
array(
'label_for' => 'display_sticky',
'option_group' => 'nb_general_settings',
'option_id' => 'display_sticky',
'option_description' => 'Make display sticky or not',
'radio_options' => array(
'display_sticky' => 'Make the notification bar sticky',
'display_relative' => 'Do not make the notification bar sticky',
),
)
);
// Replace in wnb_display_notification_bar function
<div class="notification-bar
<?php echo $options['display_location']; ?>
<?php echo $options['display_sticky']; ?>">
// Add to notification-bar.css
.notification-bar.display_top.display_sticky {
position: fixed;
}
.notification-bar.display_bottom.display_sticky {
bottom: 0;
position: sticky;
}
// Original Code - Settings Page
<div class="notification-bar
<?php echo $options['display_location']; ?>
<?php echo $options['display_sticky']; ?>">
<div class="notification-text">
<?php echo $options['notification_text']; ?>
</div>
// Updated Code - Customizer
<div class="notification-bar
<?php echo get_theme_mod( 'display_location' ); ?>
<?php echo get_theme_mod( 'display_sticky' ); ?>">
<div class="notification-text">
<?php echo get_theme_mod( 'notification_text' ); ?>
</div>
add_action( 'customize_register', 'wnb_customize_register' );
function wnb_customize_register( WP_Customize_Manager $wp_customize ) {
$wp_customize->add_section(
'notification_bar',
array(
'title' => __( 'Notification Bar', 'notification-bar' ),
)
);
$wp_customize->add_setting(
'display_location',
array(
'capability' => 'edit_theme_options',
'default' => 'display_none',
)
);
$wp_customize->add_control(
'display_location',
array(
'type' => 'radio',
'section' => 'notification_bar',
'label' => __( 'Display Location' ),
'description' => __( 'Choose where the notification bar is displayed' ),
'choices' => array(
'display_none' => __( 'Do not display notification bar', 'notification-bar' ),
'display_top' => __( 'Display notification bar on the top of the site', 'notification-bar' ),
'display_bottom' => __( 'Display notification bar on the bottom of the site', 'notification-bar' ),
),
)
);