Skip to content

Commit 8c19161

Browse files
Add extended options, update UI
1 parent a66e821 commit 8c19161

File tree

4 files changed

+198
-33
lines changed

4 files changed

+198
-33
lines changed
124 KB
Loading

manifest/info.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
"slug" : "global-elements-wordpress",
44
"author" : "<a href='https://its.northeastern.edu/'>ITS Digital Technology & Services</a>",
55
"author_profile" : "https://its.northeastern.edu/",
6-
"version" : "1.3.0",
6+
"version" : "1.4.0",
77
"download_url" : "https://github.com/ITS-Digital-Technology/global-elements-wordpress/releases/download/v1.3.0/global-elements-wordpress.zip",
88
"requires" : "5.6",
99
"tested" : "6.6.1",
@@ -12,7 +12,7 @@
1212
"sections" : {
1313
"description" : "A Wordpress plugin developed by the Northeastern University ITS Web Solutions team that inserts the Northeastern University global header, footer, and TrustArc cookie consent manager. Each elemenent can be enabled/disabled from the plugin's settings.",
1414
"installation" : "Click the activate button to install. In order for the global header to display, the active theme must support a call to wp_body_open() after the opening &lt;body&gt; tag.",
15-
"changelog" : "Fixed 'unexpected output' bug and tweaked TrustArc link formatting."
15+
"changelog" : "Added global header options to WP Admin"
1616
},
1717
"banners" : {
1818
"low" : "",

nu-global-elements-admin.css

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
table.form-table {
2+
max-width: 45rem;
3+
}
4+
5+
.form-table th {
6+
width: 80%;
7+
}
8+
9+
.form-table th {
10+
padding-top: 1rem;
11+
}
12+
13+
.form-table td {
14+
padding-bottom: 2rem;
15+
}
16+
17+
@media screen and (min-width: 783px) {
18+
.form-table td {
19+
vertical-align: top;
20+
text-align:center;
21+
}
22+
23+
.form-table th,
24+
.form-table td {
25+
padding-top: 1rem;
26+
padding-bottom: 1rem;
27+
}
28+
}
29+
30+
.form-table tr:not(:last-child),
31+
.form-table tr:not(:last-child) {
32+
border-bottom: 1px solid rgba(0,0,0,0.3)
33+
}
34+
35+
.nuge-img-max-width {
36+
max-width :300px;
37+
}
38+
39+
.nuge-skip-link-selector {
40+
max-width: 200px;
41+
}
42+
43+
.sr-only { display: none; }

nu_global_elements.php

Lines changed: 153 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010

1111
if (!defined('ABSPATH')) { exit; }
1212

13-
const NU_GLOBAL_ELEMENTS_PLUGIN_VER = "1.3.0";
13+
const NU_GLOBAL_ELEMENTS_PLUGIN_VER = "1.4.0";
1414
const NU_GLOBAL_ELEMENTS_PLUGIN_MANIFEST_URL = "https://its-digital-technology.github.io/global-elements-wordpress/manifest/info.json";
1515

1616
/**
@@ -20,62 +20,114 @@
2020
$nu_global_elements_options = get_option( 'nu_global_elements_option_name' );
2121

2222
/**
23-
* Include global elements CSS, kernl UI and javascript from CDN
23+
* Include global elements CSS, kernl UI and javascript from CDN on front end
2424
*/
25-
add_action('wp_head', function() {
26-
echo '
27-
<link rel="stylesheet" href="https://global-packages.cdn.northeastern.edu/global-elements/dist/css/index.css">
28-
<script src="https://global-packages.cdn.northeastern.edu/global-elements/dist/js/index.umd.js"></script>
29-
<script src="https://global-packages.cdn.northeastern.edu/kernl-ui/dist/js/index.umd.js" defer></script>
30-
';
31-
});
25+
add_action('wp_head', function() { ?>
26+
<link rel="stylesheet" href="https://global-packages.cdn.northeastern.edu/global-elements/dist/css/index.css">
27+
<script src="https://global-packages.cdn.northeastern.edu/global-elements/dist/js/index.umd.js"></script>
28+
<script src="https://global-packages.cdn.northeastern.edu/kernl-ui/dist/js/index.umd.js" defer></script>
29+
<?php });
3230

3331
/**
3432
* Include the global NU header, if it is not disabled in the options
3533
*
3634
* NOTE: There must be a wp_body_open() statement under the <body> tag,
3735
* most likely in header.php of the theme.
3836
*/
39-
if (!isset($nu_global_elements_options['disable_global_header'])){
40-
add_action('wp_body_open', function() {
37+
/*
38+
if (!isset($nu_global_elements_options['disable_global_header'])) {
39+
40+
add_action('wp_body_open', function() use ($nu_global_elements_options) {
41+
42+
// Determine whether to show the wordmark
43+
$show_wordmark = isset($nu_global_elements_options['show_nu_wordmark']) && $nu_global_elements_options['show_nu_wordmark'];
44+
45+
// Create the x-data attribute dynamically
46+
$x_data = sprintf(
47+
'x-data="NUGlobalElements.header({ wordmark: %s })"',
48+
$show_wordmark ? 'true' : 'false'
49+
);
50+
51+
// Output the HTML structure
52+
echo sprintf(
53+
'<div %s x-init="init()" style="height: 48px; background-color: black"></div>',
54+
$x_data
55+
);
4156
42-
echo '<div
43-
x-data="NUGlobalElements.header({
44-
wordmark: true
45-
})"
46-
x-init="init()"
47-
style="height: 48px; background-color: black"
48-
></div>';
57+
}, 10);
58+
}
59+
*/
60+
if (!isset($nu_global_elements_options['disable_global_header'])) {
61+
62+
add_action('wp_body_open', function() use ($nu_global_elements_options) {
63+
64+
// Determine whether to show the wordmark
65+
$show_wordmark = isset($nu_global_elements_options['show_nu_wordmark']) && $nu_global_elements_options['show_nu_wordmark'];
66+
67+
// Determine whether to show the menu
68+
$disable_menu = isset($nu_global_elements_options['disable_menu']) && $nu_global_elements_options['disable_menu'];
69+
70+
// Get the skipToMainSelector value, defaulting to "#main"
71+
$skip_link_selector = isset($nu_global_elements_options['skip_link_selector']) ? $nu_global_elements_options['skip_link_selector'] : '#main';
72+
73+
// Create the x-data attribute dynamically with additional options
74+
$x_data = sprintf(
75+
'x-data="NUGlobalElements.header({ wordmark: %s, menu: %s, skipToMainSelector: \'%s\' })"',
76+
$show_wordmark ? 'true' : 'false',
77+
$disable_menu ? 'false' : 'true',
78+
esc_js($skip_link_selector) // Escape for safe JavaScript insertion
79+
);
80+
81+
// Output the HTML structure
82+
echo sprintf(
83+
'<div %s x-init="init()" style="height: 48px; background-color: black"></div>',
84+
$x_data
85+
);
4986

5087
}, 10);
5188
}
5289

90+
91+
5392
/**
5493
* Include the global NU footer, if it is not disabled in the options
5594
*/
56-
if (!isset($nu_global_elements_options['disable_global_footer'])){
95+
if (!isset($nu_global_elements_options['disable_global_footer'])) {
5796
add_action('wp_footer', function() {
58-
5997
echo '<div x-data="NUGlobalElements.footer()" x-init="init()"></div>';
60-
6198
});
6299
}
63100

64101
/**
65102
* Include TrustArc, if it is not disabled in the options
66103
*/
67-
if (!isset($nu_global_elements_options['disable_trustarc'])){
104+
if (!isset($nu_global_elements_options['disable_trustarc'])){
68105

69106
if (isset($nu_global_elements_options['disable_global_footer'])){
70-
add_action('wp_footer', function() {
71-
echo '<style>#trustarc-global-element footer {padding-top: .6rem !important;} #trustarc-global-element footer a {color: #ccc; text-decoration: none;}</style>';
107+
add_action('wp_head', function() {
108+
echo '<style>
109+
#trustarc-global-element footer {padding-top: .6rem !important;}
110+
#trustarc-global-element footer a {color: #ccc; text-decoration: none;}
111+
</style>';
72112
});
73113
}
114+
74115
add_action('wp_footer', function() {
75116
echo '<div id="trustarc-global-element" x-data="NUGlobalElements.trustarc()" x-init="init()"></div>';
76117
});
77118
}
78119

120+
// custom plugin styles
121+
add_action('admin_enqueue_scripts', 'nu_global_elements_admin');
122+
123+
function nu_global_elements_admin($hook) {
124+
if ( 'admin.php?page=nu-global-elements' == $hook ) {
125+
return;
126+
}
127+
128+
wp_enqueue_style('nu-global-elements-admin', plugins_url('nu-global-elements-admin.css', __FILE__ ));
129+
}
130+
79131
/**
80132
* Create plugin settings/options menu item, page and fields
81133
*
@@ -86,7 +138,7 @@
86138
* $disable_trustarc = $nu_global_elements_options['disable_trustarc']; // Disable TrustArc
87139
*/
88140

89-
class NUGlobalElements {
141+
class NUGlobalElements {
90142
private $nu_global_elements_options;
91143

92144
public function __construct() {
@@ -146,6 +198,35 @@ public function nu_global_elements_page_init() {
146198
'nu_global_elements_setting_section' // section
147199
);
148200

201+
add_settings_field(
202+
'show_nu_wordmark', // id
203+
'Show "Northeastern University" Wordmark next to large "N"
204+
<p style="font-weight: normal">(uncheck if "Northeastern University" already exists in your website department logo)</p>
205+
<img class="nuge-img-max-width" src="' . plugin_dir_url( __FILE__ ) . 'images/duplicate-wordmark-example.png" alt=""><br>
206+
<p><i style="font-weight: normal">Avoid duplicate wordmarks in the global and local headers.</i></p>', // title
207+
array( $this, 'show_nu_wordmark_callback' ), // callback
208+
'nu-global-elements-admin', // page
209+
'nu_global_elements_setting_section' // section
210+
);
211+
212+
add_settings_field(
213+
'skip_link_selector', // id
214+
'Skip link selector
215+
<p style="font-weight: normal">Enter the ID selector for the "Skip to main content" destination. Include the <code>#</code> (<i>e.g.</i> <code>#main</code>)</p>
216+
<p style="font-weight: normal">Be sure to remove existing skip-to-main elements from your theme.</p>', // title
217+
array( $this, 'skip_link_selector_callback' ), // callback
218+
'nu-global-elements-admin', // page
219+
'nu_global_elements_setting_section' // section
220+
);
221+
222+
add_settings_field(
223+
'disable_menu', // id
224+
'Hide the "Explore Northeastern" menu', // title
225+
array( $this, 'disable_menu_callback' ), // callback
226+
'nu-global-elements-admin', // page
227+
'nu_global_elements_setting_section' // section
228+
);
229+
149230
add_settings_field(
150231
'disable_global_footer', // id
151232
'Disable Global Footer', // title
@@ -177,6 +258,18 @@ public function nu_global_elements_sanitize($input) {
177258
$sanitary_values['disable_trustarc'] = $input['disable_trustarc'];
178259
}
179260

261+
if ( isset( $input['show_nu_wordmark'] ) ) {
262+
$sanitary_values['show_nu_wordmark'] = $input['show_nu_wordmark'];
263+
}
264+
265+
if ( isset( $input['skip_link_selector'] ) ) {
266+
$sanitary_values['skip_link_selector'] = $input['skip_link_selector'];
267+
}
268+
269+
if ( isset( $input['disable_menu'] ) ) {
270+
$sanitary_values['disable_menu'] = $input['disable_menu'];
271+
}
272+
180273
return $sanitary_values;
181274
}
182275

@@ -191,6 +284,34 @@ public function disable_global_header_callback() {
191284
);
192285
}
193286

287+
public function show_nu_wordmark_callback() {
288+
printf(
289+
'<input type="checkbox" name="nu_global_elements_option_name[show_nu_wordmark]" id="show_nu_wordmark" value="show_nu_wordmark" %s>',
290+
( isset( $this->nu_global_elements_options['show_nu_wordmark'] ) && $this->nu_global_elements_options['show_nu_wordmark'] === 'show_nu_wordmark' ) ? 'checked' : ''
291+
);
292+
}
293+
294+
public function skip_link_selector_callback() {
295+
// Get the existing value of the skip link selector from the options
296+
$skip_link_selector = isset($this->nu_global_elements_options['skip_link_selector']) ? $this->nu_global_elements_options['skip_link_selector'] : '#main';
297+
298+
// Output the text input field with the existing value
299+
printf(
300+
'<input type="text" name="nu_global_elements_option_name[skip_link_selector]" id="skip_link_selector" value="%s" class="nuge-skip-link-selector" />',
301+
esc_attr($skip_link_selector) // Ensure the value is properly escaped
302+
);
303+
304+
// Provide a description about what the input is for
305+
echo '<p class="sr-only">Enter the ID selector for the "Skip to main content" destination (e.g., <code>#main</code>).</p>';
306+
}
307+
308+
public function disable_menu_callback() {
309+
printf(
310+
'<input type="checkbox" name="nu_global_elements_option_name[disable_menu]" id="disable_menu" value="disable_menu" %s>',
311+
( isset( $this->nu_global_elements_options['disable_menu'] ) && $this->nu_global_elements_options['disable_menu'] === 'disable_menu' ) ? 'checked' : ''
312+
);
313+
}
314+
194315
public function disable_global_footer_callback() {
195316
printf(
196317
'<input type="checkbox" name="nu_global_elements_option_name[disable_global_footer]" id="disable_global_footer" value="disable_global_footer" %s>',
@@ -204,23 +325,25 @@ public function disable_trustarc_callback() {
204325
( isset( $this->nu_global_elements_options['disable_trustarc'] ) && $this->nu_global_elements_options['disable_trustarc'] === 'disable_trustarc' ) ? 'checked' : ''
205326
);
206327
}
207-
208328
}
329+
209330
if ( is_admin() )
210331
$nu_global_elements = new NUGlobalElements();
211332

212-
213333
add_filter( 'plugin_action_links_global-elements-wordpress/nu_global_elements.php', 'nu_global_elements_link' );
214334
function nu_global_elements_link( $links ) {
215-
// Build and escape the URL.
335+
336+
// Build and escape the URL.
216337
$url = esc_url( add_query_arg(
217338
'page',
218339
'nu-global-elements',
219340
get_admin_url() . 'admin.php'
220341
) );
221-
// Create the link.
342+
343+
// Create the link.
222344
$settings_link = "<a href='$url'>" . __( 'Settings' ) . '</a>';
223-
// Adds the link to the end of the array.
345+
346+
// Adds the link to the end of the array.
224347
array_push(
225348
$links,
226349
$settings_link
@@ -382,7 +505,6 @@ public function purge( $upgrader, $options ){
382505

383506
}
384507

385-
386508
}
387509

388510
new UpdateChecker();

0 commit comments

Comments
 (0)