Skip to content

Commit 1f41b41

Browse files
committed
Merge branch 'release/2.0.0'
2 parents 8774891 + 2295860 commit 1f41b41

9 files changed

+156
-87
lines changed

CHANGELOG.md

+15
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
# Genesis js / no-js Changelog
2+
3+
## 2.0.0 (2014-08-23)
4+
5+
* Refactor class into a new file. Stops using half-implemented Singleton pattern.
6+
* Update documentation.
7+
* Add GitHub Updater support.
8+
9+
## 1.0.1 (2011-06-02)
10+
11+
* Improved plugin so script is hooked in with priority 1 - avoids a theme placing anything before the script (props [Josh Stauffer](http://twitter.com/joshstauffer))
12+
13+
## 1.0.0 (2011-05-24)
14+
15+
* Initial release.

README.md

+52
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
# Genesis js / no-js
2+
3+
Make front-end styling easier for child themes on the Genesis Framework based on whether JavaScript is enabled or not.
4+
5+
## Description
6+
7+
If you look at the source of a WordPress back-end page, you'll see it has a body class of `no-js`. Immediately after the opening `body` tag is a small script which replaces `no-js` with `js` (you can see the amended class with Firebug / Inspector).
8+
9+
WordPress uses this to apply different styles to the same elements, depending on whether JavaScript is present or not.
10+
11+
This plugin recreates the same effect, but for the front-end of <a href="http://genesis-theme-framework.com/">Genesis Framework</a> child themes. It uses the `genesis_before` hook supplied by Genesis, so it won't work for other themes.
12+
13+
The script is fairly small so does not block rendering of other content for any noticeable length of time.
14+
15+
Putting the script at the top also reduces a flash of incorrectly styled content, as the page does not load with `no-js` styles, then switch to `js` once everything has finished loading.
16+
17+
## Installation
18+
19+
Once this plugin is installed and activated, then it will work automatically. There are no options, and nothing to set-up.
20+
21+
### Upload
22+
23+
1. Download the latest tagged archive (choose the "zip" option).
24+
2. Go to the __Plugins -> Add New__ screen and click the __Upload__ tab.
25+
3. Upload the zipped archive directly.
26+
4. Go to the Plugins screen and click __Activate__.
27+
28+
### Manual
29+
30+
1. Download the latest tagged archive (choose the "zip" option).
31+
2. Unzip the archive.
32+
3. Copy the folder to your `/wp-content/plugins/` directory.
33+
4. Go to the Plugins screen and click __Activate__.
34+
35+
Check out the Codex for more information about [installing plugins manually](http://codex.wordpress.org/Managing_Plugins#Manual_Plugin_Installation).
36+
37+
### Git
38+
39+
Using git, browse to your `/wp-content/plugins/` directory and clone this repository:
40+
41+
`git clone [email protected]:GaryJones/genesis-js-no-js.git`
42+
43+
Then go to your Plugins screen and click __Activate__.
44+
45+
## Updates
46+
47+
This plugin supports the [GitHub Updater](https://github.com/afragen/github-updater) plugin, so if you install that, this plugin becomes automatically updateable direct from GitHub.
48+
49+
## Credits
50+
51+
Built by [Gary Jones](https://twitter.com/GaryJ)
52+
Copyright 2011 [Gamajo Tech](http://gamajo.com/)

assets/banner-1544x500.jpg

209 KB
Loading

assets/banner-772x250.jpg

75.4 KB
Loading

assets/icon-128x128.png

12.9 KB
Loading

assets/icon-256x256.png

31.1 KB
Loading

genesis-js-no-js.php

+23-84
Original file line numberDiff line numberDiff line change
@@ -2,96 +2,35 @@
22
/**
33
* Genesis js / no-js WordPress plugin.
44
*
5-
* For child themes of the Genesis Theme.
5+
* For child themes of the Genesis Framework.
6+
*
67
* Adds a no-js body class to the front-end, and a script on genesis_before
78
* which immediately changes the class to js if JavaScript is enabled. This is
89
* how WP does things on the back-end, to allow different styles for the same
910
* elements depending if JavaScript is active or not.
1011
*
11-
* @package GenesisJsNoJs
12-
* @author Gary Jones
13-
* @license GPL3
12+
* @package GenesisJsNoJs
13+
* @author Gary Jones
14+
* @link https://github.com/GaryJones/genesis-js-no-js
15+
* @copyright 2011 Gary Jones, Gamajo Tech
16+
* @license GPL-2.0+
1417
*
15-
* Plugin Name: Genesis js / no-js
16-
* Plugin URI: http://code.garyjones.co.uk/plugins/genesis-js-no-js/
17-
* Description: For child themes of the <a href="http://genesis-theme-framework.com/">Genesis Theme</a>. Adds a <code>no-js</code> body class to the front-end, and a script on <code>genesis_before</code> which immediately changes the class to <code>js</code> if JavaScript is enabled. This is how WP does things on the back-end, to allow differing styles for elements if JavaScript is active or not.
18-
* Version: 1.0.1
19-
* Author: Gary Jones
20-
* Author URI: http://garyjones.co.uk/
21-
* License: GPL3
18+
* @wordpress-plugin
19+
* Plugin Name: Genesis js / no-js
20+
* Plugin URI: https://github.com/GaryJones/genesis-js-no-js
21+
* Description: For child themes of the <a href="http://genesis-theme-framework.com/">Genesis Framework</a>. Adds a <code>no-js</code> body class to the front-end, and a script on <code>genesis_before</code> which immediately changes the class to <code>js</code> if JavaScript is enabled. This is how WP does things on the back-end, to allow differing styles for elements if JavaScript is active or not.
22+
* Version: 2.0.0
23+
* Author: Gary Jones
24+
* Author URI: http://gamajo.com/
25+
* Text Domain: genesis-js-no-js
26+
* Domain Path: /languages
27+
* License: GPL-2.0+
28+
* License URI: http://www.gnu.org/licenses/gpl-2.0.txt
29+
* GitHub Plugin URI: https://github.com/GaryJones/genesis-js-no-js
30+
* GitHub Branch: master
2231
*/
2332

33+
require plugin_dir_path( __FILE__ ) . 'includes/class-genesis-js-no-js.php';
2434

25-
/**
26-
* Plugin class for Genesis js / no-js
27-
*
28-
* @package GenesisJsNoJs
29-
*/
30-
class Genesis_Js_No_Js {
31-
32-
/**
33-
* Holds copy of instance, so other plugins can remove our hooks.
34-
*
35-
* @since 1.0.0
36-
* @link http://core.trac.wordpress.org/attachment/ticket/16149/query-standard-format-posts.php
37-
* @link http://twitter.com/#!/markjaquith/status/66862769030438912
38-
*
39-
* @var Genesis_Js_No_Js
40-
*/
41-
static $instance;
42-
43-
/**
44-
* Constructor.
45-
*
46-
* @since 1.0.0
47-
*/
48-
public function __construct() {
49-
self::$instance = $this;
50-
add_action( 'init', array( &$this, 'init' ) );
51-
}
52-
53-
/**
54-
* Add action and filter.
55-
*
56-
* @since 1.0.0
57-
*/
58-
public function init() {
59-
add_filter( 'body_class', array( $this, 'body_class' ) );
60-
add_action( 'genesis_before', array( $this, 'script' ), 1 );
61-
}
62-
63-
/**
64-
* Add 'no-js' class to the body class values.
65-
*
66-
* @since 1.0.0
67-
*
68-
* @param array $classes Existing classes
69-
* @return array
70-
*/
71-
public function body_class( $classes ) {
72-
$classes[] = 'no-js';
73-
return $classes;
74-
}
75-
76-
/**
77-
* Echo out the script that changes 'no-js' class to 'js'.
78-
*
79-
* @since 1.0.0
80-
*/
81-
public function script() {
82-
?>
83-
<script type="text/javascript">
84-
//<![CDATA[
85-
(function(){
86-
var c = document.body.className;
87-
c = c.replace(/no-js/, 'js');
88-
document.body.className = c;
89-
})();
90-
//]]>
91-
</script>
92-
<?php
93-
}
94-
95-
}
96-
97-
new Genesis_Js_No_Js;
35+
$genesis_js_no_js = new Genesis_Js_No_Js;
36+
$genesis_js_no_js->run();

includes/class-genesis-js-no-js.php

+61
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
<?php
2+
/**
3+
* Genesis Header Nav
4+
*
5+
* @package GenesisJsNoJs
6+
* @author Gary Jones
7+
* @link https://github.com/GaryJones/genesis-header-nav
8+
* @copyright 2011 Gary Jones, Gamajo Tech
9+
* @license GPL-2.0+
10+
*/
11+
12+
/**
13+
* Plugin class.
14+
*
15+
* @package GenesisJsNoJs
16+
* @author Gary Jones
17+
*/
18+
class Genesis_Js_No_Js {
19+
20+
/**
21+
* Add action and filter.
22+
*
23+
* @since 1.0.0
24+
*/
25+
public function run() {
26+
add_filter( 'body_class', array( $this, 'body_class' ) );
27+
add_action( 'genesis_before', array( $this, 'script' ), 1 );
28+
}
29+
30+
/**
31+
* Add 'no-js' class to the body class values.
32+
*
33+
* @since 1.0.0
34+
*
35+
* @param array $classes Existing classes
36+
* @return array
37+
*/
38+
public function body_class( $classes ) {
39+
$classes[] = 'no-js';
40+
return $classes;
41+
}
42+
43+
/**
44+
* Echo out the script that changes 'no-js' class to 'js'.
45+
*
46+
* @since 1.0.0
47+
*/
48+
public function script() {
49+
?>
50+
<script type="text/javascript">
51+
//<![CDATA[
52+
(function(){
53+
var c = document.body.className;
54+
c = c.replace(/no-js/, 'js');
55+
document.body.className = c;
56+
})();
57+
//]]>
58+
</script>
59+
<?php
60+
}
61+
}

readme.txt

+5-3
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,8 @@ Contributors: GaryJ
33
Donate link: http://code.garyjones.co.uk/donate/
44
Tags: genesis, js-no-js
55
Requires at least: 3.0
6-
Tested up to: 3.3
7-
Stable tag: 1.0.1
6+
Tested up to: 4.0
7+
Stable tag: 2.0.0
88

99
Make front-end styling easier for child themes on the Genesis Framework based on whether JavaScript is enabled or not.
1010

@@ -15,13 +15,15 @@ Make front-end styling easier for child themes on the <a href="http://genesis-th
1515
Adds a `no-js` body class to the front-end, and a script on `genesis_before` which immediately changes the class to `js` if JavaScript is enabled.
1616
This is how WP does things on the back-end, to allow different styles for the same elements depending if JavaScript is active or not.
1717

18-
This plugin is only useful if you're using a child theme of the <a href="http://genesis-theme-framework.com/">Genesis Framework</a> since it needs to use the `genesis_before` hook.
18+
This plugin is only useful if you're using a child theme of the Genesis Framework since it uses the `genesis_before` hook.
1919

2020
== Installation ==
2121

2222
1. Unzip and upload `genesis-js-no-js` folder to the `/wp-content/plugins/` directory
2323
1. Activate the plugin through the 'Plugins' menu in WordPress
2424

25+
Once installed and activated, then the plugin will work. There are no options, and nothing to set-up.
26+
2527
== Frequently Asked Questions ==
2628

2729
= What does this plugin actually do? =

0 commit comments

Comments
 (0)