OMGF | GDPR/DSVGO Compliant, Faster Google Fonts. Easy. - Version 1.0.1

Version Description

Download this release

Release Info

Developer DaanvandenBergh
Plugin Icon 128x128 OMGF | GDPR/DSVGO Compliant, Faster Google Fonts. Easy.
Version 1.0.1
Comparing to
See all releases

Version 1.0.1

Files changed (4) hide show
  1. host-webfonts-local.php +244 -0
  2. includes/generate-stylesheet.php +108 -0
  3. includes/welcome-panel.php +46 -0
  4. readme.txt +38 -0
host-webfonts-local.php ADDED
@@ -0,0 +1,244 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <?php
2
+ /**
3
+ * Plugin Name: CAOS for Webfonts
4
+ * Plugin URI: https://dev.daanvandenbergh.com/wordpress-plugins/host-google-fonts-locally
5
+ * Description: Automagically save the fonts you want to use inside your content-folder, generate a stylesheet for them and enqueue it in your theme's header.
6
+ * Version: 1.0
7
+ * Author: Daan van den Bergh
8
+ * Author URI: https://dev.daanvandenbergh.com
9
+ * License: GPL2v2 or later
10
+ */
11
+
12
+ // Exit if accessed directly
13
+ if (!defined('ABSPATH')) exit;
14
+
15
+ /**
16
+ * Extend WP default Allowed Filetypes
17
+ *
18
+ * @param array $filetypes
19
+ * @return array
20
+ */
21
+ function hwlSetAllowedFiletypes($filetypes = array()) {
22
+
23
+ $filetypes['woff'] = "application/font-woff";
24
+ $filetypes['woff2'] = "application/font-woff2";
25
+ $filetypes['ttf'] = "application/-x-font-truetype";
26
+ $filetypes['otf'] = "font/opentype";
27
+
28
+ return $filetypes;
29
+ }
30
+
31
+ add_filter('upload_mimes', 'hwlSetAllowedFiletypes');
32
+
33
+ /**
34
+ * Create the Admin menu-item
35
+ */
36
+ function hwlCreateMenu()
37
+ {
38
+ add_options_page(
39
+ 'CAOS for Webfonts',
40
+ 'Optimize Webfonts',
41
+ 'manage_options',
42
+ 'optimize-webfonts',
43
+ 'hwlSettingsPage'
44
+ );
45
+
46
+ add_action(
47
+ 'admin_init',
48
+ 'registerHwlSettings'
49
+ );
50
+ }
51
+
52
+ add_action('admin_menu', 'hwlCreateMenu');
53
+
54
+ /**
55
+ * Render the settings page.
56
+ */
57
+ function hwlSettingsPage()
58
+ {
59
+ if (!current_user_can('manage_options'))
60
+ {
61
+ wp_die(__("You're not cool enough to access this page."));
62
+ }
63
+ ?>
64
+ <div class="wrap">
65
+ <h1><?php _e('CAOS for Webfonts', 'host-webfonts-local'); ?></h1>
66
+ <p>
67
+ <?php _e('Developed by: ', 'host-webfonts-local'); ?>
68
+ <a title="Buy me a beer!" href="http://dev.daanvandenbergh.com/donate/">
69
+ Daan van den Bergh</a>.
70
+ </p>
71
+ <div id="hwl-admin-notices"></div>
72
+ <?php require_once('includes/welcome-panel.php'); ?>
73
+ <form id="hwl-options-form" name="hwl-options-form">
74
+ <?php
75
+ settings_fields('host-webfonts-local-basic-settings'
76
+ );
77
+ do_settings_sections('host-webfonts-local-basic-settings'
78
+ );
79
+
80
+ /**
81
+ * Render the upload-functions.
82
+ */
83
+ hwlMediaUploadInit();
84
+
85
+ do_action('hwl_after_form_settings');
86
+ ?>
87
+ </form>
88
+ </div>
89
+ <?php
90
+ }
91
+
92
+ /**
93
+ * Set custom upload-fields and render upload buttons.
94
+ */
95
+ function hwlMediaUploadInit() {
96
+ wp_enqueue_media();
97
+
98
+ update_option('upload_path',WP_CONTENT_DIR . '/local-fonts');
99
+ update_option('upload_url_path',content_url() . '/local-fonts');
100
+ update_option('uploads_use_yearmonth_folders', false);
101
+ ?>
102
+ <table>
103
+ <tbody>
104
+ <tr valign="top">
105
+ <th>filename</th>
106
+ <th>font-family</th>
107
+ <th>font-weight</th>
108
+ <th>font-type</th>
109
+ <th>source URL</th>
110
+ </tr>
111
+ </tbody>
112
+ <tbody id="hwl_uploaded_fonts">
113
+ </tbody>
114
+ <tbody>
115
+ <tr valign="bottom">
116
+ <td>
117
+ <input type="button" onclick="hwlFontUploader()" name="upload-btn"
118
+ id="upload-btn" class="button-secondary" value="Select Fonts" />
119
+ </td>
120
+ <td>
121
+ <input type="button" onclick="hwlGenerateStylesheet()" name="generate-btn"
122
+ id="generate-btn" class="button-primary" value="Generate Stylesheet" />
123
+ </td>
124
+ </tr>
125
+ </tbody>
126
+ </table>
127
+ <script type="text/javascript">
128
+ var media_uploader = null;
129
+
130
+ function hwlFontUploader()
131
+ {
132
+ media_uploader = wp.media({
133
+ frame: "post",
134
+ state: "insert",
135
+ multiple: true
136
+ }).open();
137
+
138
+ media_uploader.on("insert", function(){
139
+ var length = media_uploader.state().get("selection").length;
140
+ var fonts = media_uploader.state().get("selection").models;
141
+
142
+ for(var iii = 0; iii < length; iii++)
143
+ {
144
+ var font_url = fonts[iii].changed.url;
145
+ var font_name = fonts[iii].changed.title;
146
+ var font_type = fonts[iii].changed.subtype;
147
+
148
+ var uploadedFont = `<tr valign="top">
149
+ <td>
150
+ <input type="text" name="hwl_uploaded_font][${font_name}]"
151
+ id="hwl_uploaded_font][${font_name}]"
152
+ value="${font_name}" readonly />
153
+ </td>
154
+ <td>
155
+ <input type="text" name="hwl_uploaded_font][${font_name}][font_family]"
156
+ id="hwl_uploaded_font][${font_name}][font_family]"
157
+ value="" />
158
+ </td>
159
+ <td>
160
+ <input type="text" name="hwl_uploaded_font][${font_name}][font_weight]"
161
+ id="hwl_uploaded_font][${font_name}][font_weight]"
162
+ value="" />
163
+ </td>
164
+ <td>
165
+ <input type="text" name="hwl_uploaded_font][${font_name}][${font_type}]"
166
+ id="hwl_uploaded_font][${font_name}][${font_type}]"
167
+ value="${font_type}" readonly />
168
+ </td>
169
+ <td>
170
+ <input type="text" name="hwl_uploaded_font][${font_name}][${font_type}][url]"
171
+ id="hwl_uploaded_font][${font_name}][${font_type}][url]"
172
+ value="${font_url}" readonly />
173
+ </td>
174
+ </tr>`;
175
+ jQuery('#hwl_uploaded_fonts').append(uploadedFont);
176
+ }
177
+ });
178
+ }
179
+ function hwlGenerateStylesheet() {
180
+ var hwlData = hwlSerializeArray($('#hwl-options-form'));
181
+
182
+ jQuery.ajax({
183
+ type: 'POST',
184
+ url: ajaxurl,
185
+ data: {
186
+ action: 'hwlAjaxGenerateStyles',
187
+ uploaded_fonts: hwlData
188
+ },
189
+ success: function(response) {
190
+ console.log(response);
191
+ jQuery('#hwl-admin-notices').append(
192
+ `<div class="updated settings-error notice is-dismissible">
193
+ <p>${response}</p>
194
+ </div>`
195
+ );
196
+ jQuery('#hwl_uploaded_fonts').each(function() {
197
+ jQuery(this).fadeOut(700, function() {
198
+ jQuery(this).remove();
199
+ })
200
+ });
201
+ },
202
+ error: function(response) {
203
+ jQuery('#hwl-admin-notices').append(
204
+ `<div class="notice notice-error is-dismissible">
205
+ <p><?php _e( 'The stylesheet could not be created:', 'host-webfonts-local' ); ?> ${response}</p>"
206
+ </div>`
207
+ )
208
+ }
209
+ });
210
+ }
211
+ function hwlSerializeArray(data) {
212
+ var result = [];
213
+ data.each(function() {
214
+ var fields = {};
215
+ $.each($(this).serializeArray(), function() {
216
+ fields[this.name] = this.value;
217
+ });
218
+ result.push(fields);
219
+ });
220
+
221
+ return result;
222
+ }
223
+ </script>
224
+ <?php
225
+ }
226
+
227
+ function hwlAjaxGenerateStyles() {
228
+ require_once('includes/generate-stylesheet.php');
229
+ }
230
+ add_action('wp_ajax_hwlAjaxGenerateStyles', 'hwlAjaxGenerateStyles');
231
+
232
+ /**
233
+ * Once the stylesheet is generated. We can enqueue it.
234
+ */
235
+ function hwlEnqueueStylesheet()
236
+ {
237
+ $stylesheet = WP_CONTENT_DIR . '/local-fonts/local-fonts.css';
238
+ if (file_exists($stylesheet)) {
239
+ wp_register_style('hwl-style', content_url() . '/local-fonts/local-fonts.css');
240
+ wp_enqueue_style('hwl-style');
241
+ }
242
+ }
243
+
244
+ add_action('wp_enqueue_scripts', 'hwlEnqueueStylesheet' );
includes/generate-stylesheet.php ADDED
@@ -0,0 +1,108 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <?php
2
+ /**
3
+ * @package: CAOS for Webfonts
4
+ * @author: Daan van den Bergh
5
+ * @copyright: (c) 2018 Daan van den Bergh
6
+ * @url: https://dev.daanvandenbergh.com
7
+ */
8
+
9
+ // Exit if accessed directly
10
+ if (!defined( 'ABSPATH')) exit;
11
+
12
+ /** We need the Wordpress-object here. */
13
+ global $wpdb;
14
+
15
+ /**
16
+ * set the content type header
17
+ */
18
+ header("Content-type: text/css");
19
+
20
+ /**
21
+ * Detect Font style so we can populate the CSS-file correctly.
22
+ *
23
+ * @param $fontname
24
+ * @return string
25
+ */
26
+ function hwlDetectFontStyle($fontweight) {
27
+ switch ($fontweight){
28
+ case 300:
29
+ return 'light';
30
+ case 400:
31
+ return 'normal';
32
+ case 600:
33
+ return 'semibold';
34
+ case 700:
35
+ return 'bold';
36
+ case 900:
37
+ return 'extrabold';
38
+ default:
39
+ return 'normal';
40
+ }
41
+ }
42
+
43
+ /**
44
+ * Return the fonts location if it matches the requested type in the CSS.
45
+ *
46
+ * @param $font
47
+ * @param $requestedType
48
+ *
49
+ * @return string
50
+ */
51
+ function hwlReturnFontUrl($font, $requestedType) {
52
+ foreach ($font as $fontType => $url) {
53
+ if (strpos($fontType, $requestedType) !== false) {
54
+ return implode($url);
55
+ }
56
+ }
57
+ }
58
+
59
+ /**
60
+ * After we're done uploading we need to reset the upload-directory.
61
+ */
62
+ function hwlResetUploadDir() {
63
+ update_option('upload_path',null);
64
+ update_option('upload_url_path',null);
65
+ update_option('uploads_use_yearmonth_folders', true);
66
+ }
67
+
68
+ /**
69
+ * Check if user has the needed permissions.
70
+ */
71
+ if (!current_user_can('manage_options'))
72
+ {
73
+ wp_die(__("You're not cool enough to access this page."));
74
+ }
75
+
76
+ /**
77
+ * Let's generate the stylesheet.
78
+ */
79
+ $fonts[] = "/** This file is automagically generated by CAOS for Webfonts */\n";
80
+ $uploadedFonts = $_POST['uploaded_fonts'][0]['hwl_uploaded_font'];
81
+
82
+ foreach ($uploadedFonts as $font) {
83
+ $fonts[] = "@font-face {
84
+ font-family: '" . sanitize_text_field($font['font_family']) . "';
85
+ font-style: " . hwlDetectFontStyle(sanitize_text_field( $font['font_weight'])) . ";
86
+ font-weight: " . sanitize_text_field($font['font_weight']) . ";
87
+ src: url('" . hwlReturnFontUrl($font, 'eot') . "'), /* IE9 Compatible */
88
+ url('" . hwlReturnFontUrl($font, 'woff2') . "') format('woff2'), /* Super Modern Browsers */
89
+ url('" . hwlReturnFontUrl($font, 'woff') . "') format('woff'), /* Modern Browsers */
90
+ url('" . hwlReturnFontUrl($font, 'octet') . "') format('truetype'); /* Safari, Android, iOS */
91
+ }";
92
+ }
93
+
94
+ $fonts = implode("\n", $fonts);
95
+ $file = WP_CONTENT_DIR . '/local-fonts/local-fonts.css';
96
+
97
+ /**
98
+ * If the file can be created and uploaded. Let's try to write it.
99
+ */
100
+ try {
101
+ $stylesheet = fopen($file, 'w') or die ("Cannot create file {$file}");
102
+ fwrite ($stylesheet, $fonts);
103
+ fclose ($stylesheet);
104
+ hwlResetUploadDir();
105
+ wp_die(_e('Stylesheet was successfully generated and added to your theme\'s header.'));
106
+ } catch (Exception $e) {
107
+ wp_die($e);
108
+ }
includes/welcome-panel.php ADDED
@@ -0,0 +1,46 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <?php
2
+ /**
3
+ * @package: CAOS for Webfonts
4
+ * @author: Daan van den Bergh
5
+ * @copyright: (c) 2018 Daan van den Bergh
6
+ * @url: https://dev.daanvandenbergh.com
7
+ */
8
+ ?>
9
+ <div id="welcome-panel" class="welcome-panel">
10
+ <div class="welcome-panel-content">
11
+ <h2>Thank you for using CAOS for Webfonts!</h2>
12
+ <p class="about-description">
13
+ CAOS for Webfonts automagically saves the fonts you want to use inside your content-folder, generates a stylesheet for them and enqueues it in your theme's header.
14
+ This will decrease your pageload times, leverage your browser cache, minimize external requests and effectively bring you a perfect score on Pagespeed Insights and Pingdom.
15
+ </p>
16
+ <div class="welcome-panel-column-container">
17
+ <div class="welcome-panel-column">
18
+ <h3>Quickstart</h3>
19
+ <ul>
20
+ <li class="welcome-icon dashicons-before dashicons-editor-bold">Download fonts from <a href="https://fonts.google.com/" target="_blank">Google Fonts</a></li>
21
+ <li class="welcome-icon dashicons-before dashicons-admin-tools">Convert them using <a href="https://www.fontsquirrel.com/tools/webfont-generator" target="_blank">FontSquirrel's Webfont Generator</a></li>
22
+ <li class="welcome-icon dashicons-before dashicons-cloud">Upload/Add them using the 'Select Fonts' button</li>
23
+ <li class="welcome-icon dashicons-before dashicons-art">Click 'Generate Stylesheet'</li>
24
+ <li class="welcome-icon dashicons-before dashicons-media-text">Stylesheet is added to template and ready for use.</li>
25
+ <li class="welcome-icon dashicons-before dashicons-smiley">Done!</li>
26
+ </ul>
27
+ <p><a target="_blank" href="https://dev.daanvandenbergh.com/wordpress-plugins/host-google-fonts-locally/">Click here</a> for a more comprehensive guide.</p>
28
+ </div>
29
+ <div class="welcome-panel-column">
30
+ <h3>Get a Perfect Score on Pagespeed & Pingdom!</h3>
31
+ <p><strong>Leverage your browser cache</strong> and <strong>lower pageload times</strong> by hosting analytics.js locally with <a href="https://dev.daanvandenbergh.com/wordpress-plugins/optimize-analytics-wordpress/" target="_blank">CAOS for Analytics</a>.</p>
32
+ <p><a target="_blank" href="https://wordpress.org/plugins/host-analyticsjs-local">Download now</a></p>
33
+ <h3>Need help?</h3>
34
+ <p>First make sure you read the manual thoroughly.</p>
35
+ <p>Still running into issues? Visit the <a href="https://wordpress.org/plugins/host-webfonts-local/#description">FAQ</a> and <a href="https://wordpress.org/plugins/host-webfonts-local">Support Forum</a> to see if your question has already been answered.</p>
36
+ <p>If not, ask a question or <a href="https://dev.daanvandenbergh.com/contact" target="_blank">contact me</a>.</p>
37
+ </div>
38
+ <div class="welcome-panel-column welcome-panel-last">
39
+ <h3>Did I make you happy?</h3>
40
+ <p>I create simple, but useful solutions that easily optimize your website for Pagespeed Insights and Pingdom.</p>
41
+ <p>I believe these solutions should be free, but if you appreciate my work, let's have a beer together!</p>
42
+ <a target="_blank" class="button button-primary button-hero" href="https://dev.daanvandenbergh.com/donate/"><span class="dashicons-before dashicons-heart"> Sure. This round's on me!</span></a>
43
+ </div>
44
+ </div>
45
+ </div>
46
+ </div>
readme.txt ADDED
@@ -0,0 +1,38 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ === CAOS for Webfonts - Host your Webfonts Locally! ===
2
+ Contributors: DaanvandenBergh
3
+ Donate link: https://dev.daanvandenbergh.com/donate/
4
+ Tags: update, host, save, local, locally, google, fonts, webfonts, minimize, external, requests, leverage, browser, cache
5
+ Requires at least: 4.5
6
+ Tested up to: 4.9
7
+ Stable tag: 1.56
8
+ License: GPLv2 or later
9
+ License URI: http://www.gnu.org/licenses/gpl-2.0.html
10
+
11
+ Automagically saves the fonts you want to use inside your content-folder, generates a stylesheet for them and enqueues it in your theme's header.
12
+
13
+ == Description ==
14
+
15
+ Another cool plugin created by [Daan van den Bergh](http://dev.daanvandenbergh.com "Click here to visit my Wordpress Development Blog") that automagically saves the fonts you want to use inside your content-folder, generates a stylesheet for them and enqueues it in your theme's header.
16
+
17
+ This will *decrease your pageload times*, *leverage browser cache*, *minimize DNS requests* and effectively bring you a perfect score on *Pagespeed Insights* and *Pingdom*.
18
+
19
+ == Installation ==
20
+
21
+ 1. Upload the plugin files to the `/wp-content/plugins/host-webforms-local` directory, or install the plugin through the WordPress plugins screen directly.
22
+ 1. Activate the plugin through the 'Plugins' screen in WordPress
23
+ 1. Use the Settings -> Optimize Webfonts screen to configure the plugin
24
+
25
+ == Frequently Asked Questions ==
26
+
27
+ = Can I buy you a beer? =
28
+
29
+ Yes, please! [Click here to buy me a beer](http://dev.daanvandenbergh.com/donate/ "Let's do shots!")!
30
+
31
+ == Screenshots ==
32
+
33
+ N/A
34
+
35
+ == Changelog ==
36
+
37
+ = 1.0 =
38
+ First release! No changes so far!