944 lines
48 KiB
PHP
Executable File
944 lines
48 KiB
PHP
Executable File
<?php
|
|
/*
|
|
Plugin Name: PalettePro
|
|
Description: Allows customization of WordPress dashboard and login page colors.
|
|
Version: 1.1.0
|
|
Author: MohFarawati.de
|
|
Author URI: www.MohFarawati.de
|
|
*/
|
|
include 'functions.php';
|
|
// Enqueue the color picker script and styles
|
|
function palettepro_enqueue_scripts($hook)
|
|
{
|
|
if ($hook !== 'toplevel_page_palettepro') {
|
|
return;
|
|
}
|
|
wp_enqueue_style('palettepro-css', plugins_url('assets/css/css.css', __FILE__));
|
|
wp_enqueue_style('palettepro-color-picker-css', plugins_url('assets/css/color-picker.css', __FILE__));
|
|
wp_enqueue_script('palettepro-color-picker-script', plugins_url('assets/js/color-picker.js', __FILE__), array('jquery', 'wp-color-picker'), false, true);
|
|
wp_enqueue_script('palettepro-script', plugins_url('assets/js/palettepro.js', __FILE__), array('jquery', 'wp-color-picker'), false, true);
|
|
}
|
|
add_action('admin_enqueue_scripts', 'palettepro_enqueue_scripts', 999);
|
|
|
|
|
|
///////////////////////////////////////////////////////////////////////////////////////////////////////////
|
|
///////////////////////////////////////////////////////////////////////////////////////////////////////////
|
|
///////////////////////////////////////////////////////////////////////////////////////////////////////////
|
|
|
|
|
|
function pp_admin_welcome_msg()
|
|
{
|
|
$current_screen = get_current_screen();
|
|
if ($current_screen && $current_screen->base === 'dashboard') {
|
|
$dismissed = isset($_COOKIE['pp_dashboard_welcome_dismissed']);
|
|
if (!$dismissed) {
|
|
?>
|
|
<div class="pp-welcome-notice">
|
|
<div class="pp-notice-content">
|
|
<button type="button" class="pp-notice-dismiss" onclick="dismissWelcomeMessage();">
|
|
<span class="pp-screen-reader-text">X</span>
|
|
|
|
<span class="pp-close-button"></span>
|
|
</button>
|
|
<div class="pp-flex">
|
|
<div class="pp-welcome-logo">
|
|
<img src="https://picsum.photos/75/75" alt="">
|
|
</div>
|
|
|
|
<div class="pp-welcome-msg">
|
|
<h1>Welcome to My Custom Dashboard!</h1>
|
|
<p class="pp-welcome-message">This is a customized message for the dashboard.</p>
|
|
<div class="pp-welcome-menu">
|
|
<a href="#" class="pp-welcome-menu-item">Link </a>
|
|
<a href="#" class="pp-welcome-menu-item">Link </a>
|
|
<a href="#" class="pp-welcome-menu-item">Link </a>
|
|
<a href="#" class="pp-welcome-menu-item">Link </a>
|
|
<a href="#" class="pp-welcome-menu-item">Link </a>
|
|
</div>
|
|
</div>
|
|
<div class="pp-welcome-support">
|
|
<h3>Contact Support</h3>
|
|
<ul>
|
|
<li><span class="dashicons dashicons-location-alt"></span> Your Address</li>
|
|
<li><span class="dashicons dashicons-email"></span> Your Email</li>
|
|
<li><span class="dashicons dashicons-phone"></span> Your Phone Number</li>
|
|
</ul>
|
|
<button class="btn-save">Contact Us</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script>
|
|
function dismissWelcomeMessage() {
|
|
document.cookie = "pp_dashboard_welcome_dismissed=1; expires=Fri, 31 Dec 9999 23:59:59 GMT; path=/";
|
|
document.querySelector('.pp-welcome-notice').style.display = 'none';
|
|
}
|
|
</script>
|
|
<?php
|
|
}
|
|
}
|
|
}
|
|
add_action('admin_notices', 'pp_admin_welcome_msg');
|
|
|
|
///////////////////////////////////////////////////////////////////////////////////////////////////////////
|
|
////////////////////////////////// WELCOME MSG FUNCTION
|
|
///////////////////////////////////////////////////////////////////////////////////////////////////////////
|
|
|
|
function pp_admin_enqueue_scripts()
|
|
{
|
|
$current_screen = get_current_screen();
|
|
if ($current_screen && $current_screen->base === 'dashboard') {
|
|
$dismissed = isset($_COOKIE['pp_dashboard_welcome_dismissed']);
|
|
if (!$dismissed) {
|
|
wp_enqueue_script('pp-welcome-dismiss', get_template_directory_uri() . '/js/welcome-dismiss.js', array(), '1.0', true);
|
|
}
|
|
}
|
|
}
|
|
add_action('admin_enqueue_scripts', 'pp_admin_enqueue_scripts');
|
|
|
|
|
|
|
|
|
|
///////////////////////////////////////////////////////////////////////////////////////////////////////////
|
|
////////////////////////////////// Output custom CSS styles
|
|
///////////////////////////////////////////////////////////////////////////////////////////////////////////
|
|
//
|
|
function palettepro_output_styles()
|
|
{
|
|
include 'palettepro_output_styles.php';
|
|
}
|
|
add_action('admin_head', 'palettepro_output_styles');
|
|
add_action('login_head', 'palettepro_output_styles');
|
|
|
|
///////////////////////////////////////////////////////////////////////////////////////////////////////////
|
|
////////////////////////////////// Create the color customizer page
|
|
///////////////////////////////////////////////////////////////////////////////////////////////////////////
|
|
|
|
function palettepro_page()
|
|
{
|
|
// Handle form submission
|
|
if (isset($_POST['submit'])) {
|
|
|
|
|
|
// Validate and save the selected colors and border radius
|
|
|
|
/////////////////////////////////// DASHBOARD //////////////////////////////////////////////
|
|
$dashboard_background_color = sanitize_hex_color($_POST['dashboard_background_color']);
|
|
$border_radius = absint($_POST['border_radius']);
|
|
|
|
/////////////////////////////////// LEFT MENU //////////////////////////////////////////////
|
|
$left_menu_bg_color = sanitize_hex_color($_POST['left_menu_bg_color']);
|
|
$left_menu_bg_items = sanitize_hex_color($_POST['left_menu_bg_items']);
|
|
|
|
$left_menu_item_text_color = sanitize_hex_color($_POST['left_menu_item_text_color']);
|
|
$left_menu_item_bg_color = sanitize_hex_color($_POST['left_menu_item_bg_color']);
|
|
$left_menu_item_bg_hover = sanitize_hex_color($_POST['left_menu_item_bg_hover']);
|
|
$left_menu_item_text_hover = sanitize_hex_color($_POST['left_menu_item_text_hover']);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/////////////////////////////////// TOP MENU //////////////////////////////////////////////
|
|
$top_menu_bg_color = sanitize_hex_color($_POST['top_menu_bg_color']);
|
|
|
|
|
|
$logo_file = $_FILES['logo_file'];
|
|
if ($logo_file['error'] === UPLOAD_ERR_OK) {
|
|
// Upload the dashboard logo
|
|
$upload_dir = wp_upload_dir();
|
|
$logo_dir = trailingslashit($upload_dir['basedir']) . 'palettepro-logos/';
|
|
$logo_url = trailingslashit($upload_dir['baseurl']) . 'palettepro-logos/';
|
|
|
|
// Create the directory if it doesn't exist
|
|
if (!file_exists($logo_dir)) {
|
|
mkdir($logo_dir);
|
|
}
|
|
|
|
$logo_filename = $logo_file['name'];
|
|
$logo_path = $logo_dir . $logo_filename;
|
|
|
|
move_uploaded_file($logo_file['tmp_name'], $logo_path);
|
|
update_option('palettepro_logo_url', $logo_url . $logo_filename);
|
|
}
|
|
|
|
/////////////////////////////////// LOGIN PAGE //////////////////////////////////////////////
|
|
$login_bg_type = $_POST['login_bg_type'];
|
|
$login_bg_color = sanitize_hex_color($_POST['login_bg_color']);
|
|
$login_bg_gradient_start = sanitize_hex_color($_POST['login_bg_gradient_start']);
|
|
$login_bg_gradient_end = sanitize_hex_color($_POST['login_bg_gradient_end']);
|
|
|
|
$login_logo_file = $_FILES['login_logo_file'];
|
|
if ($login_logo_file['error'] === UPLOAD_ERR_OK) {
|
|
// Upload the login page logo
|
|
$upload_dir = wp_upload_dir();
|
|
$logo_dir = trailingslashit($upload_dir['basedir']) . 'palettepro-logos/';
|
|
$logo_url = trailingslashit($upload_dir['baseurl']) . 'palettepro-logos/';
|
|
|
|
// Create the directory if it doesn't exist
|
|
if (!file_exists($logo_dir)) {
|
|
mkdir($logo_dir);
|
|
}
|
|
|
|
$logo_filename = $login_logo_file['name'];
|
|
$logo_path = $logo_dir . $logo_filename;
|
|
|
|
// Move the uploaded file to the designated directory
|
|
move_uploaded_file($login_logo_file['tmp_name'], $logo_path);
|
|
|
|
// Update the login page logo URL option
|
|
update_option('palettepro_login_logo_url', $logo_url . $logo_filename);
|
|
}
|
|
|
|
/////////////////////////////////// BUTTONS //////////////////////////////////////////////
|
|
$primary_button_bg_color = sanitize_hex_color($_POST['primary_button_bg_color']);
|
|
$primary_button_hover_color = sanitize_hex_color($_POST['primary_button_hover_color']);
|
|
$secondary_button_bg_color = sanitize_hex_color($_POST['secondary_button_bg_color']);
|
|
$secondary_button_hover_color = sanitize_hex_color($_POST['secondary_button_hover_color']);
|
|
|
|
|
|
$primary_color = sanitize_hex_color($_POST['primary_color']);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
update_option('palettepro_dashboard_background_color', $dashboard_background_color);
|
|
update_option('palettepro_border_radius', $border_radius);
|
|
update_option('palettepro_top_menu_bg_color', $top_menu_bg_color);
|
|
update_option('palettepro_login_bg_type', $login_bg_type);
|
|
update_option('palettepro_login_bg_color', $login_bg_color);
|
|
update_option('palettepro_login_bg_gradient_start', $login_bg_gradient_start);
|
|
update_option('palettepro_login_bg_gradient_end', $login_bg_gradient_end);
|
|
update_option('palettepro_primary_button_bg_color', $primary_button_bg_color);
|
|
update_option('palettepro_primary_button_hover_color', $primary_button_hover_color);
|
|
update_option('palettepro_secondary_button_bg_color', $secondary_button_bg_color);
|
|
update_option('palettepro_secondary_button_hover_color', $secondary_button_hover_color);
|
|
update_option('palettepro_primary_color', $primary_color);
|
|
|
|
|
|
|
|
|
|
update_option('palettepro_left_menu_bg_color', $left_menu_bg_color);
|
|
update_option('palettepro_left_menu_bg_items', $left_menu_bg_items);
|
|
update_option('palettepro_left_menu_item_text_color', $left_menu_item_text_color);
|
|
update_option('palettepro_left_menu_item_bg_color', $left_menu_item_bg_color);
|
|
update_option('palettepro_left_menu_item_bg_hover', $left_menu_item_bg_hover);
|
|
update_option('palettepro_left_menu_item_text_hover', $left_menu_item_text_hover);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// Show the loader
|
|
echo '<div class="pp-loader"></div>';
|
|
|
|
// Refresh the page after a delay
|
|
echo '<script>setTimeout(function() {
|
|
window.location.reload();
|
|
}, 500);</script>';
|
|
|
|
// ..................................
|
|
// ..................................
|
|
|
|
} elseif (isset($_POST['reset'])) {
|
|
echo '<div class="pp-loader"></div>';
|
|
// Code to reset the options to their default values...
|
|
reset_palettepro_options();
|
|
|
|
// Refresh the page after resetting
|
|
echo '<script>setTimeout(function() {
|
|
window.location.reload();
|
|
}, 500);</script>';
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
///////////////////////////////////////////////////////////////////////////////////////////////////////////
|
|
////////////////////////////////// Retrieve the previously selected colors and border radius
|
|
///////////////////////////////////////////////////////////////////////////////////////////////////////////
|
|
$dashboard_background_color = get_option('palettepro_dashboard_background_color', '#81d742');
|
|
$border_radius = get_option('palettepro_border_radius', 0);
|
|
$logo_url = get_option('palettepro_logo_url');
|
|
$top_menu_bg_color = get_option('palettepro_top_menu_bg_color', 'red');
|
|
$login_bg_type = get_option('palettepro_login_bg_type', 'color');
|
|
$login_bg_color = get_option('palettepro_login_bg_color', '#ffffff');
|
|
$login_bg_gradient_start = get_option('palettepro_login_bg_gradient_start', '#ffffff');
|
|
$login_bg_gradient_end = get_option('palettepro_login_bg_gradient_end', '#ffffff');
|
|
$login_logo_url = get_option('palettepro_login_logo_url');
|
|
$primary_color = get_option('palettepro_primary_color', '#000000');
|
|
$primary_button_bg_color = get_option('palettepro_primary_button_bg_color', '#007cba');
|
|
$secondary_button_bg_color = get_option('palettepro_secondary_button_bg_color', '#999999');
|
|
$primary_button_hover_color = get_option('palettepro_primary_button_hover_color', '#005a8c');
|
|
$secondary_button_hover_color = get_option('palettepro_secondary_button_hover_color', '#808080');
|
|
|
|
|
|
|
|
|
|
|
|
$left_menu_bg_color = get_option('palettepro_left_menu_bg_color', 'yellow');
|
|
$left_menu_bg_items = get_option('palettepro_left_menu_bg_items', 'yellow');
|
|
|
|
$left_menu_item_text_color = get_option('palettepro_left_menu_item_text_color', 'yellow');
|
|
$left_menu_item_bg_color = get_option('palettepro_left_menu_item_bg_color', 'yellow');
|
|
$left_menu_item_bg_hover = get_option('palettepro_left_menu_item_bg_hover', 'yellow');
|
|
$left_menu_item_text_hover = get_option('palettepro_left_menu_item_text_hover', 'yellow');
|
|
|
|
|
|
|
|
|
|
?>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- ///////////////////////////////////////////////////////////////////////////////////////////////////////////
|
|
////////////////////////////////// HTML FORM
|
|
/////////////////////////////////////////////////////////////////////////////////////////////////////////// -->
|
|
|
|
<div class="pp-palettepro">
|
|
<!------------------------------------------------------------------------------
|
|
------------------- HEADER
|
|
------------------------------------------------------------------------------->
|
|
<div class="pp-head">
|
|
<div class="pp-logo">
|
|
<img src="https://picsum.photos/200" alt="logo">
|
|
</div>
|
|
<div class="pp-logoname">
|
|
<h1>PalettePro</h1>
|
|
<span>BETA</span>
|
|
<p>Unlock the Power of Customization with PalettePro: Transform Your WordPress Experience with Personalized Colors and Styling!</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pp-container">
|
|
<!------------------------------------------------------------------------------
|
|
------------------- NOTE
|
|
------------------------------------------------------------------------------->
|
|
<div class="pp-note">
|
|
<span class="dashicons dashicons-admin-site"></span>
|
|
<div class="pp-note-content">
|
|
<h4>Lorem ipsum dolor sit amet consectetur adipisicing elit.</h4>
|
|
<p>quam, aliquid eos voluptatibus iure minus maiores, quos nisi dolorum harum est excepturi impedit magni distinctio vero libero ipsa! Aperiam.</p>
|
|
|
|
</div>
|
|
</div>
|
|
<!------------------------------------------------------------------------------
|
|
------------------- START SETTINGS
|
|
------------------------------------------------------------------------------->
|
|
|
|
<form method="post" action="" enctype="multipart/form-data">
|
|
<div class="pp-form">
|
|
|
|
|
|
|
|
<div class="pp-settings">
|
|
|
|
<!------------------------------------------------------------------------------
|
|
-------------------
|
|
------------------------------------------------------------------------------->
|
|
|
|
<div class="pp-menu">
|
|
<h2> <?php
|
|
$plugin_data = get_plugin_data(__FILE__);
|
|
$plugin_version = $plugin_data['Version'];
|
|
$wordpress_version = get_bloginfo('version');
|
|
echo '<div id="pp-versiona">';
|
|
echo ' <span class="pp-plugin-versiona">palettePro ' . $plugin_version . '</span> ';
|
|
echo '</div>';
|
|
?></h2>
|
|
<a class="pp-menu-link settings-active icon-dashboard" href="#pp_general">General</a>
|
|
<a class="pp-menu-link icon-login" href="#pp_LoginPage">Login Page</a>
|
|
<a class="pp-menu-link icon-leftmenu" href="#pp_leftMenu">Left Menu</a>
|
|
<a class="pp-menu-link icon-topmenu" href="#pp_topMenu">Top Menu</a>
|
|
<a class="pp-menu-link icon-btns" href="#pp_btns">Buttons</a>
|
|
<a class="pp-menu-link icon-reset" href="#pp_reset_settings">Reset Settings</a>
|
|
</div>
|
|
</div>
|
|
<!------------------------------------------------------------------------------
|
|
------------------
|
|
------------------------------------------------------------------------------->
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<div class="pp-content">
|
|
<!------------------------------------------------------------------------------
|
|
------------------- Control Panel Customization
|
|
------------------------------------------------------------------------------->
|
|
|
|
<div id="pp_general" class="pp-card-content active">
|
|
<div class="pp-section">
|
|
<div class="pp-section-head">
|
|
<h2>Control Panel Customization</h2>
|
|
</div>
|
|
<div class="pp-section-body">
|
|
|
|
<div class="grid2">
|
|
|
|
<div class="pp-card">
|
|
<div class="pp-card-head">
|
|
<label for="dashboard-background-color">Dashboard Background</label>
|
|
</div>
|
|
|
|
<div class="pp-card-body">
|
|
<div class="pp-color-picker-wrapper">
|
|
<input type="text" name="dashboard_background_color" id="dashboard-background-color" value="<?php echo $dashboard_background_color; ?>" class="pp-color-picker" data-alpha="true">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="pp-card">
|
|
<div class="pp-card-head">
|
|
<label for="primary-color">Primary Color</label>
|
|
</div>
|
|
|
|
<div class="pp-card-body">
|
|
<div class="pp-color-picker-wrapper">
|
|
<input type="text" name="primary_color" id="primary-color" value="<?php echo $primary_color; ?>" class="pp-color-picker" data-alpha="true">
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="pp-card">
|
|
<div class="pp-card-head">
|
|
<label for="border-radius">Border Radius</label>
|
|
</div>
|
|
|
|
<div class="pp-card-body">
|
|
<div class="pp-input-wrapper">
|
|
<button onclick="changeValue('-', event)" class="pp-left">-</button>
|
|
<input type="number" name="border_radius" id="border-radius" value="<?php echo $border_radius; ?>" min="0" step="1">
|
|
<button onclick="changeValue('+', event)" class="pp-right">+</button>
|
|
|
|
</div>
|
|
<div class="pp-btns-borderradius">
|
|
<button onclick="setBorderRadius(0, event)" class="pp-borderradius-btn">0px</button>
|
|
<button onclick="setBorderRadius(5, event)" class="pp-borderradius-btn">5px</button>
|
|
<button onclick="setBorderRadius(10, event)" class="pp-borderradius-btn">10px</button>
|
|
<button onclick="setBorderRadius(15, event)" class="pp-borderradius-btn">15px</button>
|
|
<button onclick="setBorderRadius(20, event)" class="pp-borderradius-btn">20px</button>
|
|
<button onclick="setBorderRadius(25, event)" class="pp-borderradius-btn">25px</button>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pp-section-footer">
|
|
<p>Enhance your user experience by personalizing the control panel. Enjoy complete control over the color scheme, including the control panel itself, background, buttons, and border radius.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!------------------------------------------------------------------------------
|
|
------------------- Login Customization
|
|
------------------------------------------------------------------------------->
|
|
|
|
<div id="pp_LoginPage" class="pp-card-content">
|
|
<div class="pp-section">
|
|
<div class="pp-section-head">
|
|
<h2>Login Customization</h2>
|
|
</div>
|
|
<div class="pp-section-body">
|
|
<div class="grid1">
|
|
|
|
|
|
|
|
|
|
|
|
<div class="pp-card">
|
|
<div class="pp-card-head">
|
|
<label>Login Background color</label>
|
|
</div>
|
|
|
|
<div class="pp-card-body-login">
|
|
<div class="pp-radio-group">
|
|
<input type="radio" name="login_bg_type" value="color" id="login-bg-color-radio" <?php checked($login_bg_type, 'color'); ?>>
|
|
<label for="login-bg-color-radio" class="pp-login-color">Color</label>
|
|
|
|
<input type="radio" name="login_bg_type" value="gradient" id="login-bg-gradient" <?php checked($login_bg_type, 'gradient'); ?>>
|
|
<label for="login-bg-gradient" class="pp-login-gradient">Gradient</label>
|
|
</div>
|
|
|
|
<div class="pp-color-picker-fields <?php if ($login_bg_type !== 'color') echo 'pp-hidden'; ?>" id="login-bg-color-field">
|
|
<div class="pp-color-picker-wrapper">
|
|
<input type="text" name="login_bg_color" id="login-bg-color" value="<?php echo $login_bg_color; ?>" class="pp-color-picker" data-alpha="true">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pp-color-picker-fields <?php if ($login_bg_type !== 'gradient') echo 'pp-hidden'; ?>" id="login-bg-gradient-field">
|
|
<div class="pp-color-picker-wrapper">
|
|
<input type="text" name="login_bg_gradient_start" id="login-bg-gradient-start" value="<?php echo $login_bg_gradient_start; ?>" class="pp-color-picker" data-alpha="true">
|
|
</div>
|
|
|
|
<div class="pp-color-picker-wrapper">
|
|
<input type="text" name="login_bg_gradient_end" id="login-bg-gradient-end" value="<?php echo $login_bg_gradient_end; ?>" class="pp-color-picker" data-alpha="true">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="pp-card">
|
|
<div class="pp-card-head">
|
|
<label for="login-logo-file">Login Page Logo</label>
|
|
</div>
|
|
<div class="pp-card-body-btn">
|
|
<div class="pp-input-wrapper">
|
|
<?php if (!empty($login_logo_url)) : ?>
|
|
<img src="<?php echo esc_attr($login_logo_url); ?>" alt="Login Page Logo" width="auto" height="75">
|
|
<br>
|
|
<?php endif; ?>
|
|
<div class="pp-input-upload">
|
|
<label for="login_logo_file" class="pp-button-upload">Upload your Logo</label>
|
|
<input type="file" name="login_logo_file" id="login_logo_file">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pp-section-footer">
|
|
<p>Make a lasting impression with a customized login page. Tailor the login logo to reflect your brand identity and choose from a variety of background options, whether it's a solid color or an eye-catching gradient.</p>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
<!------------------------------------------------------------------------------
|
|
------------------- Left Menu Styling
|
|
------------------------------------------------------------------------------->
|
|
|
|
<div id="pp_leftMenu" class="pp-card-content">
|
|
<div class="pp-section">
|
|
<div class="pp-section-head">
|
|
<h2>Left Menu Styling</h2>
|
|
</div>
|
|
<div class="pp-section-body">
|
|
|
|
<h3>Background</h3>
|
|
|
|
|
|
<div class="grid2">
|
|
|
|
<div class="pp-card">
|
|
<div class="pp-card-head">
|
|
<label for="left-menu-bg-color">Background Color</label>
|
|
</div>
|
|
<div class="pp-card-body">
|
|
<div class="pp-color-picker-wrapper">
|
|
<input type="text" name="left_menu_bg_color" id="left-menu-bg-color" value="<?php echo $left_menu_bg_color; ?>" class="pp-color-picker" data-alpha="true">
|
|
</div>
|
|
</div>
|
|
<div class="pp-section-footer">
|
|
<p>for your design.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pp-card">
|
|
<div class="pp-card-head">
|
|
<label for="left-menu-bg-items">Background Items</label>
|
|
</div>
|
|
<div class="pp-card-body">
|
|
<div class="pp-color-picker-wrapper">
|
|
<input type="text" name="left_menu_bg_items" id="left-menu-bg-items" value="<?php echo $left_menu_bg_items; ?>" class="pp-color-picker" data-alpha="true">
|
|
</div>
|
|
</div>
|
|
<div class="pp-section-footer">
|
|
<p>for your design.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pp-card">
|
|
<div class="pp-card-head">
|
|
<label for="left-menu-bg-color">Active Item Background</label>
|
|
</div>
|
|
<div class="pp-card-body">
|
|
<div class="pp-color-picker-wrapper">
|
|
<input type="text" name="left_menu_item_bg_color" id="left_menu_item_bg_color" value="<?php echo $left_menu_item_bg_color; ?>" class="pp-color-picker" data-alpha="true">
|
|
</div>
|
|
</div>
|
|
<div class="pp-section-footer">
|
|
<p>for your design.</p>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
<div class="pp-card">
|
|
<div class="pp-card-head">
|
|
<label for="left-menu-bg-color">Item Bg on hover</label>
|
|
</div>
|
|
<div class="pp-card-body">
|
|
<div class="pp-color-picker-wrapper">
|
|
<input type="text" name="left_menu_item_bg_hover" id="left_menu_item_bg_hover" value="<?php echo $left_menu_item_bg_hover; ?>" class="pp-color-picker" data-alpha="true">
|
|
</div>
|
|
</div>
|
|
<div class="pp-section-footer">
|
|
<p>for your design.</p>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
<h3>TEXT</h3>
|
|
<div class="grid2">
|
|
|
|
|
|
|
|
<div class="pp-card">
|
|
<div class="pp-card-head">
|
|
<label for="left-menu-bg-color">Item Text Color</label>
|
|
</div>
|
|
<div class="pp-card-body">
|
|
<div class="pp-color-picker-wrapper">
|
|
<input type="text" name="left_menu_item_text_color" id="left_menu_item_text_color" value="<?php echo $left_menu_item_text_color; ?>" class="pp-color-picker" data-alpha="true">
|
|
</div>
|
|
</div>
|
|
<div class="pp-section-footer">
|
|
<p>for your design.</p>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
<div class="pp-card">
|
|
<div class="pp-card-head">
|
|
<label for="left-menu-bg-color">Item text on hover</label>
|
|
</div>
|
|
<div class="pp-card-body">
|
|
<div class="pp-color-picker-wrapper">
|
|
<input type="text" name="left_menu_item_text_hover" id="left_menu_item_text_hover" value="<?php echo $left_menu_item_text_hover; ?>" class="pp-color-picker" data-alpha="true">
|
|
</div>
|
|
</div>
|
|
<div class="pp-section-footer">
|
|
<p>for your design.</p>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
<!------------------------------------------------------------------------------
|
|
------------------- Top Menu Styling
|
|
------------------------------------------------------------------------------->
|
|
|
|
<div id="pp_topMenu" class="pp-card-content">
|
|
<div class="pp-section">
|
|
<div class="pp-section-head">
|
|
<h2>Top Menu Enhancement</h2>
|
|
</div>
|
|
<div class="pp-section-body">
|
|
|
|
<div class="grid1">
|
|
|
|
<div class="pp-card">
|
|
<div class="pp-card-head">
|
|
<label for="left-menu-bg-color">Top Menu Background Color</label>
|
|
</div>
|
|
|
|
<div class="pp-card-body">
|
|
<div class="pp-color-picker-wrapper">
|
|
<input type="text" name="top_menu_bg_color" id="top-menu-bg-color" value="<?php echo $top_menu_bg_color; ?>" class="pp-color-picker" data-alpha="true">
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
<div class="pp-card">
|
|
<div class="pp-card-head">
|
|
<label for="logo-file">Logo topNav</label>
|
|
</div>
|
|
|
|
<div class="pp-card-body-btn">
|
|
<div class="pp-input-wrapper">
|
|
<?php if ($logo_url) : ?>
|
|
<img src="<?php echo esc_attr($logo_url); ?>" alt="Logo" width="auto" height="75">
|
|
<br>
|
|
<?php endif; ?>
|
|
<div class="pp-input-upload">
|
|
<label for="logo-file" class="pp-button-upload">Upload Image</label>
|
|
<input type="file" name="logo_file" id="logo-file">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pp-section-footer">
|
|
<p>Refine the appearance of the top menu by customizing its background color and font colors. Create a cohesive and visually appealing layout that aligns with your brand.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!------------------------------------------------------------------------------
|
|
------------------- Button Customization
|
|
------------------------------------------------------------------------------->
|
|
|
|
<div id="pp_btns" class="pp-card-content">
|
|
<div class="pp-section">
|
|
<div class="pp-section-head">
|
|
<h2>Button Customization</h2>
|
|
</div>
|
|
<div class="pp-section-body">
|
|
|
|
<div class="grid2">
|
|
|
|
<div class="pp-card">
|
|
<div class="pp-card-head">
|
|
<label for="primary-button-bg-color">Primary Button</label>
|
|
</div>
|
|
|
|
<div class="pp-card-body">
|
|
<div class="pp-color-picker-wrapper">
|
|
<input type="text" name="primary_button_bg_color" id="primary-button-bg-color" value="<?php echo $primary_button_bg_color; ?>" class="pp-color-picker" data-alpha="true">
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
<div class="pp-card">
|
|
<div class="pp-card-head">
|
|
<label for="primary-button-hover-color">Primary Hover</label>
|
|
</div>
|
|
|
|
<div class="pp-card-body">
|
|
<div class="pp-color-picker-wrapper">
|
|
<input type="text" name="primary_button_hover_color" id="primary-button-hover-color" value="<?php echo $primary_button_hover_color; ?>" class="pp-color-picker" data-alpha="true">
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div class="pp-card">
|
|
<div class="pp-card-head">
|
|
<label for="secondary-button-bg-color">Secondary Button</label>
|
|
</div>
|
|
|
|
<div class="pp-card-body">
|
|
<div class="pp-color-picker-wrapper">
|
|
<input type="text" name="secondary_button_bg_color" id="secondary-button-bg-color" value="<?php echo $secondary_button_bg_color; ?>" class="pp-color-picker" data-alpha="true">
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="pp-card">
|
|
<div class="pp-card-head">
|
|
<label for="secondary-button-hover-color">Secondary Hover</label>
|
|
</div>
|
|
|
|
<div class="pp-card-body">
|
|
<div class="pp-color-picker-wrapper">
|
|
<input type="text" name="secondary_button_hover_color" id="secondary-button-hover-color" value="<?php echo $secondary_button_hover_color; ?>" class="pp-color-picker" data-alpha="true">
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pp-section-footer">
|
|
<p>Take your WordPress buttons to the next level by customizing their colors. Whether it's primary buttons that grab attention or secondary buttons for subtler interactions, tailor their appearance to match your website's style and branding.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!------------------------------------------------------------------------------
|
|
------------------- RESET
|
|
------------------------------------------------------------------------------->
|
|
|
|
<div id="pp_reset_settings" class="pp-card-content">
|
|
<div class="pp-section">
|
|
<div class="pp-section-head">
|
|
<h2>RESET</h2>
|
|
</div>
|
|
<div class="pp-section-body">
|
|
|
|
<div class="grid1">
|
|
|
|
|
|
|
|
|
|
<div class="pp-card">
|
|
<div class="pp-card-head">
|
|
<label for="primary-button-hover-color">Reset everthing</label>
|
|
</div>
|
|
|
|
<div class="pp-card-body">
|
|
<div class="btnreset">
|
|
<input type="submit" name="reset" id="submit-reset" class="btn-reset" value="Reset Values">
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<div class="pp-section-footer">
|
|
<p>Take your WordPress buttons to the next level by customizing their colors. Whether it's primary buttons that grab attention or secondary buttons for subtler interactions, tailor their appearance to match your website's style and branding.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<!------------------------------------------------------------------------------
|
|
------------------- END
|
|
------------------------------------------------------------------------------->
|
|
</div>
|
|
|
|
<!------------------------------------------------------------------------------
|
|
------------------- START SIDEBAR
|
|
------------------------------------------------------------------------------->
|
|
|
|
<div class="pp-sidebar">
|
|
<div class="btnsave">
|
|
<input type="submit" name="submit" id="submit-top" class="btn-save" value="Save Changes">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
</form> <!-- END FORM -->
|
|
|
|
|
|
|
|
<!------------------------------------------------------------------------------
|
|
------------------- START FOOTER
|
|
------------------------------------------------------------------------------->
|
|
<div class="pp-footer">
|
|
<div class="pp-made-with-text">Made with <div class="pp-made-with-heart"><span class="pp-heart">♥</span></div>by PP</div>
|
|
|
|
<div class="pp-footer-text">
|
|
<?php
|
|
$plugin_data = get_plugin_data(__FILE__);
|
|
$plugin_version = $plugin_data['Version'];
|
|
$wordpress_version = get_bloginfo('version');
|
|
echo '<div id="pp-version">';
|
|
echo '<span class="pp-wordpress-version">WordPress Version: ' . $wordpress_version . '</span> | <span class="pp-plugin-version">Plugin Version: ' . $plugin_version . '</span> | <span class="pp-current-year">' . date('Y') . '</span> © <span class="pp-company-name">PalettePro</span>. All rights reserved.';
|
|
echo '</div>';
|
|
?>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<?php
|
|
}
|
|
///////////////////////////////////////////////////////////////////////////////////////////////////////////
|
|
///////////////////////////////////////////////////////////////////////////////////////////////////////////
|
|
///////////////////////////////////////////////////////////////////////////////////////////////////////////
|
|
// Add Upgrade | Settings | Deactivate
|
|
function pp_custom_links_plugin_page($links)
|
|
{
|
|
// Get the plugin's main file name
|
|
$plugin_file = plugin_basename(__FILE__);
|
|
|
|
// Define the upgrade URL
|
|
$upgrade_url = 'https://www.your-website.com/upgrade';
|
|
|
|
// Add the "Upgrade" link to the plugin action links
|
|
$upgrade_link = '<a href="' . $upgrade_url . '" target="_blank">' . __('Upgrade', 'your-text-domain') . '</a>';
|
|
$action_links = array(
|
|
'upgrade' => $upgrade_link,
|
|
'settings' => '<a href="' . admin_url('admin.php?page=palettepro') . '">' . __('Settings', 'your-text-domain') . '</a>',
|
|
'deactivate' => '<a href="' . wp_nonce_url(admin_url('plugins.php?action=deactivate&plugin=' . $plugin_file), 'deactivate-plugin_' . $plugin_file) . '">' . __('Deactivate', 'your-text-domain') . '</a>',
|
|
);
|
|
|
|
return array_merge($action_links, $links);
|
|
}
|
|
|
|
// Add the action links to the plugin row
|
|
add_filter('plugin_action_links_' . plugin_basename(__FILE__), 'pp_custom_links_plugin_page');
|
|
///////////////////////////////////////////////////////////////////////////////////////////////////////////
|
|
///////////////////////////////////////////////////////////////////////////////////////////////////////////
|
|
///////////////////////////////////////////////////////////////////////////////////////////////////////////
|
|
// Add the color customizer page to the admin menu
|
|
function palettepro_menu()
|
|
{
|
|
add_menu_page(
|
|
'PalettePro', // Page title
|
|
'PalettePro', // Menu title
|
|
'manage_options', // Capability required to access the menu item
|
|
'palettepro', // Menu slug
|
|
'palettepro_page', // Callback function to render the page
|
|
'dashicons-art', // Icon name (using 'art' icon)
|
|
1 // Position in the menu
|
|
);
|
|
}
|
|
add_action('admin_menu', 'palettepro_menu');
|