oxyplug-preload
Last commit date
assets
1 year ago
oxy-preload.php
1 year ago
package.json
1 year ago
readme.txt
1 year ago
vite.config.js
1 year ago
oxy-preload.php
563 lines
| 1 | <?php |
| 2 | /** |
| 3 | * Plugin Name: Oxyplug Preload |
| 4 | * Plugin URI: https://www.oxyplug.com/products/oxy-preload |
| 5 | * Description: Preload post/page featured images and product images to improve the Largest Contentful Paint (LCP) and to get a better Core Web Vital (CWV) score on Google's Lighthouse. |
| 6 | * Version: 2.0.0 |
| 7 | * Author: Oxyplug |
| 8 | * Author URI: https://www.oxyplug.com |
| 9 | * Requires PHP: 7.4 |
| 10 | * Requires at least: 4.9 |
| 11 | * Tested up to: 6.7 |
| 12 | * Text Domain: oxyplug-preload |
| 13 | * Domain Path: /lang/ |
| 14 | * License: GPL v2 or later |
| 15 | * License URI: https://www.gnu.org/licenses/gpl-2.0.html |
| 16 | * |
| 17 | * Copyright 2024 Oxyplug |
| 18 | */ |
| 19 | |
| 20 | if (!defined('ABSPATH')) { |
| 21 | exit; |
| 22 | } |
| 23 | |
| 24 | /** |
| 25 | * Class OxyPreload |
| 26 | */ |
| 27 | class OxyPreload |
| 28 | { |
| 29 | protected $imgurl; |
| 30 | protected $srcset; |
| 31 | protected $sizes; |
| 32 | const OXYPLUG_PRELOAD_VERSION = '2.0.0'; |
| 33 | |
| 34 | public function __construct() |
| 35 | { |
| 36 | // Init on activate |
| 37 | register_activation_hook(__FILE__, array($this, 'activate_it')); |
| 38 | |
| 39 | // Add preloads in response |
| 40 | add_action('init', array($this, 'send_preloads'), 1); |
| 41 | |
| 42 | // Add preload tag |
| 43 | add_action('wp_head', array($this, 'add_preload_tag')); |
| 44 | |
| 45 | // Save preloads |
| 46 | add_action('wp_ajax_oxyplug_preload_save_preloads', array($this, 'oxyplug_preload_save_preloads')); |
| 47 | |
| 48 | // Add menu |
| 49 | add_action('admin_menu', array($this, 'add_menu')); |
| 50 | |
| 51 | // Add settings in plugins page |
| 52 | add_filter('plugin_action_links', array($this, 'add_settings'), 10, 3); |
| 53 | |
| 54 | // Add necessities in admin head |
| 55 | add_action('admin_head', array($this, 'admin_head')); |
| 56 | |
| 57 | // Add admin assets |
| 58 | add_action('admin_enqueue_scripts', array($this, 'add_admin_assets')); |
| 59 | } |
| 60 | public function activate_it() |
| 61 | { |
| 62 | // Enable preloading `featured image` by default |
| 63 | $preload_featured_image = $this->oxyplug_preload_get_option('_oxyplug_preload_featured_image'); |
| 64 | if (empty($preload_featured_image)) { |
| 65 | $this->oxyplug_preload_update_option('_oxyplug_preload_featured_image', 'true'); |
| 66 | } |
| 67 | } |
| 68 | |
| 69 | /** |
| 70 | * @return mixed|null |
| 71 | */ |
| 72 | private function get_preloads() |
| 73 | { |
| 74 | $preloads = $this->oxyplug_preload_get_option('_oxyplug_preload_preloads', array( |
| 75 | 'script' => array(), |
| 76 | 'style' => array(), |
| 77 | 'font' => array() |
| 78 | )); |
| 79 | |
| 80 | return apply_filters('oxyplug_preload_get_preloads', $preloads); |
| 81 | } |
| 82 | |
| 83 | /** |
| 84 | * @return void |
| 85 | */ |
| 86 | public function send_preloads() |
| 87 | { |
| 88 | $resources = $this->get_preloads(); |
| 89 | foreach ($resources as $type => $items) { |
| 90 | foreach ($items as $url) { |
| 91 | if (!empty($url)) { |
| 92 | $header = sprintf('Link: <%s>; rel=preload; as=%s', esc_url($url), esc_attr($type)); |
| 93 | if ($type === 'font') { |
| 94 | $header .= '; crossorigin'; |
| 95 | } |
| 96 | header($header, false); |
| 97 | } |
| 98 | } |
| 99 | } |
| 100 | } |
| 101 | |
| 102 | /** |
| 103 | * @return void |
| 104 | */ |
| 105 | public function add_preload_tag() |
| 106 | { |
| 107 | $preload_featured_image = $this->oxyplug_preload_get_option('_oxyplug_preload_featured_image') == 'true'; |
| 108 | if ($preload_featured_image) { |
| 109 | if (is_single() || is_page()) { |
| 110 | $thumbnail_id = (int)(get_post_thumbnail_id()); |
| 111 | if ($thumbnail_id > 0) { |
| 112 | $this->imgurl = get_the_post_thumbnail_url(); |
| 113 | } else if (function_exists('wc_get_product')) { |
| 114 | if ($product = wc_get_product(get_the_id())) { |
| 115 | $attachment_ids = $product->get_gallery_image_ids(); |
| 116 | if (sizeof($attachment_ids) > 0) { |
| 117 | $thumbnail_id = reset($attachment_ids); |
| 118 | $this->imgurl = wp_get_attachment_url($thumbnail_id); |
| 119 | } |
| 120 | } |
| 121 | } |
| 122 | |
| 123 | if ($thumbnail_id) { |
| 124 | $this->srcset = wp_get_attachment_image_srcset($thumbnail_id); |
| 125 | $this->sizes = wp_get_attachment_image_sizes($thumbnail_id, 'full'); |
| 126 | ?> |
| 127 | <link rel="preload" |
| 128 | as="image" |
| 129 | href="<?php esc_attr_e($this->imgurl) ?>" |
| 130 | imagesrcset="<?php esc_attr_e($this->srcset) ?>" |
| 131 | imagesizes="<?php esc_attr_e($this->sizes) ?>" |
| 132 | fetchpriority="high"> |
| 133 | <?php |
| 134 | } |
| 135 | } |
| 136 | } |
| 137 | } |
| 138 | |
| 139 | /** |
| 140 | * @return void |
| 141 | */ |
| 142 | public function admin_head() |
| 143 | { |
| 144 | // Load only in specific pages |
| 145 | $screen = get_current_screen(); |
| 146 | if ($screen && $screen->base == 'tools_page_oxyplug-preload-settings') { |
| 147 | $component_path = plugins_url('assets/js/dist/', __FILE__); |
| 148 | $components = array( |
| 149 | 'tools_page_oxyplug-preload-settings' => array( |
| 150 | 'outlined-text-field', 'icon', |
| 151 | 'icon-button', 'outlined-button', |
| 152 | 'filled-button', 'divider', 'switch' |
| 153 | ), |
| 154 | ); |
| 155 | $components = wp_json_encode($components[$screen->base]); |
| 156 | ?> |
| 157 | <link rel="preconnect" href="https://fonts.googleapis.com"> |
| 158 | <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> |
| 159 | <link href="https://fonts.googleapis.com/css2?family=Oxygen:wght@300;400;700&display=swap" rel="stylesheet"> |
| 160 | <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> |
| 161 | |
| 162 | <script type="module"> |
| 163 | // Load MD3 components |
| 164 | (async function () { |
| 165 | const OXYPLUG_PRELOAD_VERSION = '<?php echo self::OXYPLUG_PRELOAD_VERSION ?>' |
| 166 | const components = '<?php echo $components ?>' |
| 167 | const component_path = '<?php echo $component_path ?>' |
| 168 | |
| 169 | for (const component of JSON.parse(components)) { |
| 170 | await import(`${component_path}${component}.js?ver=${OXYPLUG_PRELOAD_VERSION}`); |
| 171 | } |
| 172 | })(); |
| 173 | </script> |
| 174 | <?php } |
| 175 | } |
| 176 | |
| 177 | /** |
| 178 | * @return void |
| 179 | */ |
| 180 | public function add_admin_assets() |
| 181 | { |
| 182 | wp_register_script('oxyplug-preload-admin-script', plugins_url('assets/js/admin-script.js', __FILE__), array('jquery'), self::OXYPLUG_PRELOAD_VERSION); |
| 183 | wp_enqueue_script('oxyplug-preload-admin-script'); |
| 184 | |
| 185 | wp_register_style( |
| 186 | 'oxyplug-preload-admin-style', |
| 187 | plugins_url('assets/css/admin-style.css', __FILE__), |
| 188 | array(), |
| 189 | self::OXYPLUG_PRELOAD_VERSION |
| 190 | ); |
| 191 | wp_enqueue_style('oxyplug-preload-admin-style'); |
| 192 | |
| 193 | wp_localize_script( |
| 194 | 'oxyplug-preload-admin-script', |
| 195 | 'oxyplug_preload_defines', |
| 196 | array( |
| 197 | 'trans' => array( |
| 198 | 'invalid_url' => __('Invalid URL', 'oxyplug-preload'), |
| 199 | ) |
| 200 | ) |
| 201 | ); |
| 202 | } |
| 203 | |
| 204 | /** |
| 205 | * @return void |
| 206 | */ |
| 207 | public function add_menu() |
| 208 | { |
| 209 | add_submenu_page( |
| 210 | 'tools.php', |
| 211 | 'Oxyplug Preload', |
| 212 | 'Oxyplug Preload', |
| 213 | 'manage_options', |
| 214 | 'oxyplug-preload-settings', |
| 215 | array($this, 'oxyplug_preload_settings') |
| 216 | ); |
| 217 | } |
| 218 | |
| 219 | /** |
| 220 | * @param $actions |
| 221 | * @param $plugin_file |
| 222 | * @param $plugin_data |
| 223 | * @return mixed |
| 224 | */ |
| 225 | public function add_settings($actions, $plugin_file, $plugin_data) |
| 226 | { |
| 227 | if (isset($plugin_data['slug']) && $plugin_data['slug'] == 'oxyplug-preload') { |
| 228 | $href = admin_url('tools.php?page=oxyplug-preload-settings'); |
| 229 | |
| 230 | $actions['Settings'] = '<a href="' . $href . '">' . __('Settings', 'oxyplug-preload') . '</a>'; |
| 231 | } |
| 232 | |
| 233 | return $actions; |
| 234 | } |
| 235 | |
| 236 | /** |
| 237 | * @return void |
| 238 | */ |
| 239 | public function oxyplug_preload_settings() |
| 240 | { |
| 241 | $preloads = $this->oxyplug_preload_get_option('_oxyplug_preload_preloads', array()); |
| 242 | $placeholders = array( |
| 243 | 'script' => get_home_url(null, 'wp-includes/js/jquery/jquery.js'), |
| 244 | 'style' => get_theme_file_uri('style.css'), |
| 245 | 'font' => get_theme_file_uri('assets/fonts/my-font/My-Font_wght.ttf'), |
| 246 | ); |
| 247 | |
| 248 | $theme_data = wp_get_theme()->get_file_path('theme.json'); |
| 249 | if ($theme_data && file_exists($theme_data)) { |
| 250 | $theme_json = json_decode(file_get_contents($theme_data), true); |
| 251 | if (!empty($theme_json['settings']['typography']['fontFamilies'])) { |
| 252 | foreach ($theme_json['settings']['typography']['fontFamilies'] as $font) { |
| 253 | if (!empty($font['fontFace'])) { |
| 254 | foreach ($font['fontFace'] as $font_faces) { |
| 255 | if (!empty($font_faces['src'][0])) { |
| 256 | $placeholders['font'] = get_theme_file_uri(str_replace('file:.', '', $font_faces['src'][0])); |
| 257 | break; |
| 258 | } |
| 259 | } |
| 260 | } |
| 261 | } |
| 262 | } |
| 263 | } |
| 264 | |
| 265 | ?> |
| 266 | |
| 267 | <div class="oxyplug-preload-admin-page"> |
| 268 | <section class="oxyplug-preload-admin-head"> |
| 269 | <h1 class="oxyplug-preload-head-title"> |
| 270 | <span class="oxyplug-preload-brand-highlight"> |
| 271 | <?php esc_html_e('Oxyplug Preload', 'oxyplug-preload') ?> |
| 272 | </span> |
| 273 | <span>|</span> |
| 274 | <span> |
| 275 | <?php esc_html_e('Settings', 'oxyplug-preload') ?> |
| 276 | </span> |
| 277 | </h1> |
| 278 | |
| 279 | <div class="oxyplug-preload-need-help"> |
| 280 | <svg width="36" height="36" viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg"> |
| 281 | <path |
| 282 | d="M7.59161 31.5676L8.1794 30.7586L7.59161 31.5676ZM5.93237 29.9084L6.74139 29.3206L5.93237 29.9084ZM30.0676 29.9084L29.2586 29.3206L30.0676 29.9084ZM28.4084 31.5676L27.8206 30.7586L28.4084 31.5676ZM28.4084 4.43237L28.9962 3.62336L28.4084 4.43237ZM30.0676 6.09161L29.2586 6.6794L30.0676 6.09161ZM7.59161 4.43237L8.1794 5.24139L7.59161 4.43237ZM5.93237 6.09161L6.74139 6.6794L5.93237 6.09161ZM19.7192 9.89296L19.8756 10.8807L19.7192 9.89296ZM17.3727 9.89296L17.2163 10.8807L17.3727 9.89296ZM12 23C11.4477 23 11 23.4477 11 24C11 24.5523 11.4477 25 12 25V23ZM24 25C24.5523 25 25 24.5523 25 24C25 23.4477 24.5523 23 24 23V25ZM12 17C11.4477 17 11 17.4477 11 18C11 18.5523 11.4477 19 12 19V17ZM16.5 19C17.0523 19 17.5 18.5523 17.5 18C17.5 17.4477 17.0523 17 16.5 17V19ZM30.5 16.5V19.5H32.5V16.5H30.5ZM5.5 19.5V16.5H3.5V19.5H5.5ZM18 32C15.1654 32 13.1198 31.9986 11.5336 31.8268C9.9661 31.6569 8.96626 31.3303 8.1794 30.7586L7.00383 32.3766C8.18845 33.2373 9.58051 33.6269 11.3182 33.8151C13.0371 34.0014 15.21 34 18 34V32ZM3.5 19.5C3.5 22.29 3.49863 24.4629 3.68486 26.1818C3.87313 27.9195 4.26267 29.3116 5.12336 30.4962L6.74139 29.3206C6.1697 28.5337 5.84306 27.5339 5.67323 25.9664C5.50137 24.3802 5.5 22.3346 5.5 19.5H3.5ZM8.1794 30.7586C7.62758 30.3577 7.14231 29.8724 6.74139 29.3206L5.12336 30.4962C5.64763 31.2178 6.28222 31.8524 7.00383 32.3766L8.1794 30.7586ZM30.5 19.5C30.5 22.3346 30.4986 24.3802 30.3268 25.9664C30.1569 27.5339 29.8303 28.5337 29.2586 29.3206L30.8766 30.4962C31.7373 29.3116 32.1269 27.9195 32.3151 26.1818C32.5014 24.4629 32.5 22.29 32.5 19.5H30.5ZM18 34C20.79 34 22.9629 34.0014 24.6818 33.8151C26.4195 33.6269 27.8115 33.2373 28.9962 32.3766L27.8206 30.7586C27.0337 31.3303 26.0339 31.6569 24.4664 31.8268C22.8802 31.9986 20.8346 32 18 32V34ZM29.2586 29.3206C28.8577 29.8724 28.3724 30.3577 27.8206 30.7586L28.9962 32.3766C29.7178 31.8524 30.3524 31.2178 30.8766 30.4962L29.2586 29.3206ZM32.5 16.5C32.5 13.71 32.5014 11.5371 32.3151 9.81818C32.1269 8.08051 31.7373 6.68845 30.8766 5.50383L29.2586 6.6794C29.8303 7.46626 30.1569 8.4661 30.3268 10.0336C30.4986 11.6198 30.5 13.6654 30.5 16.5H32.5ZM27.8206 5.24139C28.3724 5.64231 28.8577 6.12758 29.2586 6.6794L30.8766 5.50383C30.3524 4.78222 29.7178 4.14763 28.9962 3.62336L27.8206 5.24139ZM5.5 16.5C5.5 13.6654 5.50137 11.6198 5.67323 10.0336C5.84306 8.4661 6.1697 7.46626 6.74139 6.6794L5.12336 5.50383C4.26267 6.68845 3.87313 8.08051 3.68486 9.81818C3.49863 11.5371 3.5 13.71 3.5 16.5H5.5ZM7.00383 3.62336C6.28222 4.14763 5.64763 4.78222 5.12336 5.50383L6.74139 6.6794C7.14231 6.12758 7.62758 5.64231 8.1794 5.24139L7.00383 3.62336ZM19.5628 8.90528C18.8891 9.01198 18.2028 9.01198 17.5291 8.90528L17.2163 10.8807C18.0972 11.0202 18.9947 11.0202 19.8756 10.8807L19.5628 8.90528ZM12 25H24V23H12V25ZM12 19H16.5V17H12V19ZM26.9539 3.26967C25.0951 5.12711 23.7338 6.46779 22.5558 7.39555C21.3926 8.31159 20.4881 8.75872 19.5628 8.90528L19.8756 10.8807C21.2687 10.66 22.4884 9.99435 23.7932 8.9668C25.0831 7.95097 26.5334 6.51727 28.3676 4.68439L26.9539 3.26967ZM18 4C20.4907 4 22.3761 4.00071 23.8821 4.11906C25.3848 4.23715 26.4116 4.46712 27.2105 4.86993L28.111 3.08413C26.9722 2.50991 25.6443 2.25137 24.0388 2.1252C22.4366 1.99929 20.4605 2 18 2V4ZM27.2105 4.86993C27.4269 4.97906 27.6289 5.1021 27.8206 5.24139L28.9962 3.62336C28.7158 3.41966 28.4216 3.24078 28.111 3.08413L27.2105 4.86993ZM8.40124 4.3614C10.3389 6.29902 11.8529 7.81034 13.1857 8.87708C14.5333 9.95562 15.7832 10.6537 17.2163 10.8807L17.5291 8.90528C16.5773 8.75451 15.6476 8.28574 14.4355 7.31562C13.2086 6.33371 11.7829 4.91456 9.81542 2.94716L8.40124 4.3614ZM18 2C15.8443 2 14.0633 1.99964 12.5843 2.08338C11.1063 2.16707 9.85915 2.33736 8.78216 2.70897L9.4345 4.59959C10.2537 4.31692 11.2865 4.16007 12.6974 4.08019C14.1073 4.00036 15.824 4 18 4V2ZM8.78216 2.70897C8.1318 2.93337 7.54439 3.23061 7.00383 3.62336L8.1794 5.24139C8.54517 4.97564 8.95294 4.76575 9.4345 4.59959L8.78216 2.70897Z" |
| 283 | fill="#2D2D2D"></path> |
| 284 | </svg> |
| 285 | <div> |
| 286 | <span><?php esc_html_e('Need Help Or Have Questions?', 'oxyplug-preload') ?></span> |
| 287 | <a class="oxyplug-preload-a" href="https://www.oxyplug.com/docs/oxy-preload/" target="_blank"> |
| 288 | <?php esc_html_e('Check our documentation.', 'oxyplug-preload') ?> |
| 289 | </a> |
| 290 | </div> |
| 291 | </div> |
| 292 | </section> |
| 293 | |
| 294 | <div class="oxyplug-preload-in-row"> |
| 295 | <div class="oxyplug-preload-card"> |
| 296 | <h2> |
| 297 | <?php esc_html_e('Script Preload', 'oxyplug-preload') ?> |
| 298 | <i class="dashicons dashicons-editor-help oxyplug-preload-has-tooltip" |
| 299 | data-tooltip="<?php esc_attr_e('Preload scripts', 'oxyplug-preload') ?>" |
| 300 | data-href="https://www.oxyplug.com/docs/oxy-preload/settings/?utm_source=plugin-settings&utm_medium=wordpress&utm_campaign=oxyplug-preload#preload-settings" |
| 301 | data-href-text="<?php esc_attr_e('Learn More', 'oxyplug-preload'); ?>"></i> |
| 302 | </h2> |
| 303 | |
| 304 | <?php if (empty($preloads['script'])): ?> |
| 305 | <div class="oxyplug-preload-input-wrap"> |
| 306 | <md-outlined-text-field class="oxyplug-preload-text-field has-clear-button" |
| 307 | name="preloads[script][]" |
| 308 | label="<?php esc_attr_e('Script URL', 'oxyplug-preload'); ?>" |
| 309 | placeholder="<?php echo esc_url($placeholders['script']) ?>" |
| 310 | type="url"> |
| 311 | <md-icon-button toggle slot="trailing-icon" type="button"> |
| 312 | <md-icon>cancel</md-icon> |
| 313 | </md-icon-button> |
| 314 | </md-outlined-text-field> |
| 315 | <md-icon-button class="oxyplug-preload-remove-url" |
| 316 | toggle |
| 317 | slot="trailing-icon" |
| 318 | type="button" |
| 319 | style="display:none"> |
| 320 | <md-icon>delete</md-icon> |
| 321 | </md-icon-button> |
| 322 | </div> |
| 323 | <?php else: ?> |
| 324 | <?php foreach ($preloads['script'] as $index => $link): ?> |
| 325 | <div class="oxyplug-preload-input-wrap"> |
| 326 | <md-outlined-text-field class="oxyplug-preload-text-field has-clear-button" |
| 327 | name="preloads[script][]" |
| 328 | value="<?php echo esc_url($link) ?>" |
| 329 | label="Script URL" |
| 330 | placeholder="<?php echo esc_url($placeholders['script']) ?>" |
| 331 | type="url"> |
| 332 | <md-icon-button toggle slot="trailing-icon" type="button"> |
| 333 | <md-icon>cancel</md-icon> |
| 334 | </md-icon-button> |
| 335 | </md-outlined-text-field> |
| 336 | <md-icon-button class="oxyplug-preload-remove-url" |
| 337 | toggle |
| 338 | slot="trailing-icon" |
| 339 | type="button" |
| 340 | <?php if ($index == count($preloads['script']) - 1): ?> style="display:none" <?php endif; ?>> |
| 341 | <md-icon>delete</md-icon> |
| 342 | </md-icon-button> |
| 343 | </div> |
| 344 | <?php endforeach; ?> |
| 345 | <?php endif; ?> |
| 346 | <md-outlined-button class="oxyplug-preload-add-more"> |
| 347 | <?php esc_html_e('Add More Script URL', 'oxyplug-preload') ?> |
| 348 | </md-outlined-button> |
| 349 | |
| 350 | </div> |
| 351 | <div class="oxyplug-preload-card"> |
| 352 | <h2> |
| 353 | <?php esc_html_e('Style Preload', 'oxyplug-preload') ?> |
| 354 | <i class="dashicons dashicons-editor-help oxyplug-preload-has-tooltip" |
| 355 | data-tooltip="<?php esc_attr_e('Preload scripts', 'oxyplug-preload') ?>" |
| 356 | data-href="https://www.oxyplug.com/docs/oxy-preload/settings/?utm_source=plugin-settings&utm_medium=wordpress&utm_campaign=oxyplug-preload#preload-settings" |
| 357 | data-href-text="<?php esc_attr_e('Learn More', 'oxyplug-preload'); ?>"></i> |
| 358 | </h2> |
| 359 | |
| 360 | <?php if (empty($preloads['style'])): ?> |
| 361 | <div class="oxyplug-preload-input-wrap"> |
| 362 | <md-outlined-text-field class="oxyplug-preload-text-field has-clear-button" |
| 363 | name="preloads[style][]" |
| 364 | label="<?php esc_attr_e('Style URL', 'oxyplug-preload'); ?>" |
| 365 | placeholder="<?php echo esc_url($placeholders['style']) ?>" |
| 366 | type="url"> |
| 367 | <md-icon-button toggle slot="trailing-icon" type="button"> |
| 368 | <md-icon>cancel</md-icon> |
| 369 | </md-icon-button> |
| 370 | </md-outlined-text-field> |
| 371 | <md-icon-button class="oxyplug-preload-remove-url" |
| 372 | toggle |
| 373 | slot="trailing-icon" |
| 374 | type="button" |
| 375 | style="display:none"> |
| 376 | <md-icon>delete</md-icon> |
| 377 | </md-icon-button> |
| 378 | </div> |
| 379 | <?php else: ?> |
| 380 | <?php foreach ($preloads['style'] as $index => $link): ?> |
| 381 | <div class="oxyplug-preload-input-wrap"> |
| 382 | <md-outlined-text-field class="oxyplug-preload-text-field has-clear-button" |
| 383 | name="preloads[style][]" |
| 384 | value="<?php echo esc_url($link) ?>" |
| 385 | label="<?php esc_attr_e('Style URL', 'oxyplug-preload'); ?>" |
| 386 | placeholder="<?php echo esc_url($placeholders['style']) ?>" |
| 387 | type="url"> |
| 388 | <md-icon-button toggle slot="trailing-icon" type="button"> |
| 389 | <md-icon>cancel</md-icon> |
| 390 | </md-icon-button> |
| 391 | </md-outlined-text-field> |
| 392 | <md-icon-button class="oxyplug-preload-remove-url" |
| 393 | toggle |
| 394 | slot="trailing-icon" |
| 395 | type="button" |
| 396 | <?php if ($index == count($preloads['style']) - 1): ?> style="display:none" <?php endif; ?>> |
| 397 | <md-icon>delete</md-icon> |
| 398 | </md-icon-button> |
| 399 | </div> |
| 400 | <?php endforeach; ?> |
| 401 | <?php endif; ?> |
| 402 | <md-outlined-button class="oxyplug-preload-add-more"> |
| 403 | <?php esc_html_e('Add More Style URL', 'oxyplug-preload') ?> |
| 404 | </md-outlined-button> |
| 405 | |
| 406 | </div> |
| 407 | </div> |
| 408 | |
| 409 | <div class="oxyplug-preload-in-row"> |
| 410 | <div class="oxyplug-preload-card"> |
| 411 | <h2> |
| 412 | <?php esc_html_e('Font Preload', 'oxyplug-preload') ?> |
| 413 | <i class="dashicons dashicons-editor-help oxyplug-preload-has-tooltip" |
| 414 | data-tooltip="<?php esc_attr_e('Preload fonts', 'oxyplug-preload') ?>" |
| 415 | data-href="https://www.oxyplug.com/docs/oxy-preload/settings/?utm_source=plugin-settings&utm_medium=wordpress&utm_campaign=oxyplug-preload#preload-settings" |
| 416 | data-href-text="<?php esc_attr_e('Learn More', 'oxyplug-preload'); ?>"></i> |
| 417 | </h2> |
| 418 | |
| 419 | <?php if (empty($preloads['font'])): ?> |
| 420 | <div class="oxyplug-preload-input-wrap"> |
| 421 | <md-outlined-text-field class="oxyplug-preload-text-field has-clear-button" |
| 422 | name="preloads[font][]" |
| 423 | label="<?php esc_attr_e('Font URL', 'oxyplug-preload'); ?>" |
| 424 | placeholder="<?php echo esc_url($placeholders['font']) ?>" |
| 425 | type="url"> |
| 426 | <md-icon-button toggle slot="trailing-icon" type="button"> |
| 427 | <md-icon>cancel</md-icon> |
| 428 | </md-icon-button> |
| 429 | </md-outlined-text-field> |
| 430 | <md-icon-button class="oxyplug-preload-remove-url" |
| 431 | toggle |
| 432 | slot="trailing-icon" |
| 433 | type="button" |
| 434 | style="display:none"> |
| 435 | <md-icon>delete</md-icon> |
| 436 | </md-icon-button> |
| 437 | </div> |
| 438 | <?php else: ?> |
| 439 | <?php foreach ($preloads['font'] as $index => $link): ?> |
| 440 | <div class="oxyplug-preload-input-wrap"> |
| 441 | <md-outlined-text-field class="oxyplug-preload-text-field has-clear-button" |
| 442 | name="preloads[font][]" |
| 443 | value="<?php echo esc_url($link) ?>" |
| 444 | label="<?php esc_attr_e('Font URL', 'oxyplug-preload'); ?>" |
| 445 | placeholder="<?php echo esc_url($placeholders['font']) ?>" |
| 446 | type="url"> |
| 447 | <md-icon-button toggle slot="trailing-icon" type="button"> |
| 448 | <md-icon>cancel</md-icon> |
| 449 | </md-icon-button> |
| 450 | </md-outlined-text-field> |
| 451 | <md-icon-button class="oxyplug-preload-remove-url" |
| 452 | toggle |
| 453 | slot="trailing-icon" |
| 454 | type="button" |
| 455 | <?php if ($index == count($preloads['font']) - 1): ?> style="display:none" <?php endif; ?>> |
| 456 | <md-icon>delete</md-icon> |
| 457 | </md-icon-button> |
| 458 | </div> |
| 459 | <?php endforeach; ?> |
| 460 | <?php endif; ?> |
| 461 | <md-outlined-button class="oxyplug-preload-add-more"> |
| 462 | <?php esc_html_e('Add More Font URL', 'oxyplug-preload') ?> |
| 463 | </md-outlined-button> |
| 464 | </div> |
| 465 | <div class="oxyplug-preload-card oxyplug-preload-self-height"> |
| 466 | <h2> |
| 467 | <?php esc_html_e('Featured Image Preload', 'oxyplug-preload') ?> |
| 468 | <i class="dashicons dashicons-editor-help oxyplug-preload-has-tooltip" |
| 469 | data-tooltip="<?php esc_attr_e('Preload featured image', 'oxyplug-preload') ?>" |
| 470 | data-href="https://www.oxyplug.com/docs/oxy-preload/settings/?utm_source=plugin-settings&utm_medium=wordpress&utm_campaign=oxyplug-preload#preload-settings" |
| 471 | data-href-text="<?php esc_attr_e('Learn More', 'oxyplug-preload'); ?>"></i> |
| 472 | </h2> |
| 473 | |
| 474 | <div class="oxyplug-preload-switch-wrap"> |
| 475 | <md-switch icons |
| 476 | name="featured_image_preload" <?php if ($this->oxyplug_preload_get_option('_oxyplug_preload_featured_image', 'true') == 'true'): ?> selected <?php endif ?>></md-switch> |
| 477 | <span><?php esc_html_e('Preload featured image automatically? (No need to add URLs)', 'oxyplug-image'); ?></span> |
| 478 | </div> |
| 479 | </div> |
| 480 | </div> |
| 481 | |
| 482 | <md-divider class="oxyplug-preload-horizontal-divider"></md-divider> |
| 483 | |
| 484 | <md-filled-button id="oxyplug-preload-save-preloads" |
| 485 | class="oxyplug-preload-has-loading" |
| 486 | data-nonce="<?php echo esc_attr(wp_create_nonce('oxyplug_preload_save_preloads')) ?>"> |
| 487 | <?php esc_html_e('Save', 'oxyplug-preload'); ?> |
| 488 | </md-filled-button> |
| 489 | <div class="oxyplug-preload-spinner-wrap"> |
| 490 | <div class="oxyplug-preload-spinner"></div> |
| 491 | <p><?php esc_html_e('Saving...Please wait.', 'oxyplug-preload'); ?></p> |
| 492 | </div> |
| 493 | |
| 494 | </div> |
| 495 | <?php } |
| 496 | |
| 497 | /** |
| 498 | * @return void |
| 499 | */ |
| 500 | public function oxyplug_preload_save_preloads() |
| 501 | { |
| 502 | if (!empty($_POST['oxyplug_preload_save_preloads_nonce'])) { |
| 503 | $sanitized_nonce = sanitize_text_field(wp_unslash($_POST['oxyplug_preload_save_preloads_nonce'])); |
| 504 | if (wp_verify_nonce($sanitized_nonce, 'oxyplug_preload_save_preloads')) { |
| 505 | |
| 506 | // Featured image preload |
| 507 | $preload_featured_image = empty($_POST['featured_image_preload']) ? 'false' : 'true'; |
| 508 | $this->oxyplug_preload_update_option('_oxyplug_preload_featured_image', $preload_featured_image); |
| 509 | |
| 510 | // CSS/JS/Font preload |
| 511 | if (!empty($_POST['preloads']) && is_array($_POST['preloads'])) { |
| 512 | $valid_links = array(); |
| 513 | foreach ($_POST['preloads'] as $key => $links) { |
| 514 | if (in_array((string)($key), array('script', 'style', 'font'))) { |
| 515 | foreach ($links as $link) { |
| 516 | $valid_links[$key][] = esc_url($link); |
| 517 | } |
| 518 | } |
| 519 | } |
| 520 | |
| 521 | $this->oxyplug_preload_update_option('_oxyplug_preload_preloads', $valid_links); |
| 522 | } |
| 523 | |
| 524 | wp_send_json_success(array('messages' => array(esc_html__('Successfully saved.', 'oxyplug-image'))), 200); |
| 525 | } |
| 526 | |
| 527 | wp_send_json(array('messages' => array(esc_html__('Wrong wpnonce. Refresh the page.', 'oxyplug-image'))), 403); |
| 528 | } |
| 529 | } |
| 530 | |
| 531 | /** |
| 532 | * @param $option_name |
| 533 | * @param $default |
| 534 | * @return false|mixed|void |
| 535 | */ |
| 536 | protected function oxyplug_preload_get_option($option_name, $default = false) |
| 537 | { |
| 538 | if (is_multisite()) { |
| 539 | $network_id = get_current_blog_id(); |
| 540 | |
| 541 | return get_network_option($network_id, $option_name, $default); |
| 542 | } |
| 543 | |
| 544 | return get_option($option_name, $default); |
| 545 | } |
| 546 | |
| 547 | /** |
| 548 | * @param $option_name |
| 549 | * @param $option_value |
| 550 | * @return void |
| 551 | */ |
| 552 | protected function oxyplug_preload_update_option($option_name, $option_value) |
| 553 | { |
| 554 | if (is_multisite()) { |
| 555 | update_network_option(get_current_blog_id(), $option_name, $option_value); |
| 556 | } else { |
| 557 | update_option($option_name, $option_value); |
| 558 | } |
| 559 | } |
| 560 | } |
| 561 | |
| 562 | new OxyPreload(); |
| 563 |