Soil

August 16th, 2016

Soil

A WordPress plugin which contains a collection of modules to apply theme-agnostic front-end modifications.

Requirements

PHP >=5.4

Features

Load jQuery from the jQuery CDN

Load jQuery from jQuery’s CDN with a local fallback, just like HTML5 Boilerplate recommends.

Cleaner WordPress markup

  • Clean up wp_head()
    • Remove unnecessary <link>’s
    • Remove inline CSS and JS from WP emoji support
    • Remove inline CSS used by Recent Comments widget
    • Remove inline CSS used by posts with galleries
    • Remove self-closing tag and change ''s to "’s on rel_canonical()
  • Remove the WordPress version from RSS feeds
  • Clean up language_attributes() used in <html> tag
  • Clean up output of stylesheet <link> tags, remove unncessary type='text/css', only display media if it is meaningful
  • Clean up output of <script> tags, remove unnecessary type='text=javascript'
  • Add and remove body_class() classes
    • Add post/page slug if not present and template slug
    • Remove unnecessary classes
  • Wrap embedded media as suggested by Readability
  • Remove unnecessary self-closing tags (/>)
  • Don’t return the default description in the RSS feed ("Just another WordPress site")

Without Soil


<!DOCTYPE html>
<html lang="en-US" class="no-js">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width">
  <link rel="profile" href="http://gmpg.org/xfn/11">
  <link rel="pingback" href="http://example.com/wp/xmlrpc.php">
  <!--[if lt IE 9]>
  <script src="http://example.com/wp/wp-content/themes/twentyfifteen/js/html5.js"></script>
  <![endif]-->
  <script>(function(html){html.className = html.className.replace(/\bno-js\b/,'js')})(document.documentElement);</script>
<title>Example Site &#8211; Just another WordPress site</title>
<meta name='robots' content='noindex,follow' />
<link rel="alternate" type="application/rss+xml" title="Example Site &raquo; Feed" href="http://example.com/feed/" />
<link rel="alternate" type="application/rss+xml" title="Example Site &raquo; Comments Feed" href="http://example.com/comments/feed/" />
    <script type="text/javascript">
      window._wpemojiSettings = {"baseUrl":"http:\/\/s.w.org\/images\/core\/emoji\/72x72\/","ext":".png","source":{"concatemoji":"http:\/\/example.com\/wp\/wp-includes\/js\/wp-emoji-release.min.js?ver=4.4"}};
      !function(a,b,c){function d(a){var c=b.createElement("canvas"),d=c.getContext&&c.getContext("2d");return d&&d.fillText?(d.textBaseline="top",d.font="600 32px Arial","flag"===a?(d.fillText(String.fromCharCode(55356,56806,55356,56826),0,0),c.toDataURL().length>3e3):("simple"===a?d.fillText(String.fromCharCode(55357,56835),0,0):d.fillText(String.fromCharCode(55356,57135),0,0),0!==d.getImageData(16,16,1,1).data[0])):!1}function e(a){var c=b.createElement("script");c.src=a,c.type="text/javascript",b.getElementsByTagName("head")[0].appendChild(c)}var f,g;c.supports={simple:d("simple"),flag:d("flag"),unicode8:d("unicode8")},c.DOMReady=!1,c.readyCallback=function(){c.DOMReady=!0},c.supports.simple&&c.supports.flag&&c.supports.unicode8||(g=function(){c.readyCallback()},b.addEventListener?(b.addEventListener("DOMContentLoaded",g,!1),a.addEventListener("load",g,!1)):(a.attachEvent("onload",g),b.attachEvent("onreadystatechange",function(){"complete"===b.readyState&&c.readyCallback()})),f=c.source||{},f.concatemoji?e(f.concatemoji):f.wpemoji&&f.twemoji&&(e(f.twemoji),e(f.wpemoji)))}(window,document,window._wpemojiSettings);
    </script>
    <style type="text/css">
img.wp-smiley,
img.emoji {
  display: inline !important;
  border: none !important;
  box-shadow: none !important;
  height: 1em !important;
  width: 1em !important;
  margin: 0 .07em !important;
  vertical-align: -0.1em !important;
  background: none !important;
  padding: 0 !important;
}
</style>
<link rel='stylesheet' id='twentyfifteen-fonts-css'  href='https://fonts.googleapis.com/css?family=Noto+Sans%3A400italic%2C700italic%2C400%2C700%7CNoto+Serif%3A400italic%2C700italic%2C400%2C700%7CInconsolata%3A400%2C700&#038;subset=latin%2Clatin-ext' type='text/css' media='all' />
<link rel='stylesheet' id='genericons-css'  href='http://example.com/wp/wp-content/themes/twentyfifteen/genericons/genericons.css?ver=3.2' type='text/css' media='all' />
<link rel='stylesheet' id='twentyfifteen-style-css'  href='http://example.com/wp/wp-content/themes/twentyfifteen/style.css?ver=4.4' type='text/css' media='all' />
<!--[if lt IE 9]>
<link rel='stylesheet' id='twentyfifteen-ie-css'  href='http://example.com/wp/wp-content/themes/twentyfifteen/css/ie.css?ver=20141010' type='text/css' media='all' />
<![endif]-->
<!--[if lt IE 8]>
<link rel='stylesheet' id='twentyfifteen-ie7-css'  href='http://example.com/wp/wp-content/themes/twentyfifteen/css/ie7.css?ver=20141010' type='text/css' media='all' />
<![endif]-->
<script type='text/javascript' src='http://example.com/wp/wp-includes/js/jquery/jquery.js?ver=1.11.3'></script>
<script type='text/javascript' src='http://example.com/wp/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.2.1'></script>
<link rel='https://api.w.org/' href='http://example.com/wp-json/' />
<link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://example.com/wp/xmlrpc.php?rsd" />
<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://example.com/wp/wp-includes/wlwmanifest.xml" /> 
<meta name="generator" content="WordPress 4.4" />
    <style type="text/css">.recentcomments a{display:inline !important;padding:0 !important;margin:0 !important;}</style>
    </head>

<body class="home blog">

With Soil


<!DOCTYPE html>
<html lang="en-US" class="no-js">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width">
  <link rel="profile" href="http://gmpg.org/xfn/11">
  <link rel="pingback" href="/wp/xmlrpc.php">
  <!--[if lt IE 9]>
  <script src="http://example.com/wp/wp-content/themes/twentyfifteen/js/html5.js"></script>
  <![endif]-->
  <script>(function(html){html.className = html.className.replace(/\bno-js\b/,'js')})(document.documentElement);</script>
<title>Example Site &#8211; Just another WordPress site</title>
<link rel="alternate" type="application/rss+xml" title="Example Site &raquo; Feed" href="http://example.com/feed/" />
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Noto+Sans%3A400italic%2C700italic%2C400%2C700%7CNoto+Serif%3A400italic%2C700italic%2C400%2C700%7CInconsolata%3A400%2C700&#038;subset=latin%2Clatin-ext">
<link rel="stylesheet" href="/wp/wp-content/themes/twentyfifteen/genericons/genericons.css?ver=3.2">
<link rel="stylesheet" href="/wp/wp-content/themes/twentyfifteen/style.css?ver=4.4">
<!--[if lt IE 9]>
<link rel="stylesheet" href="/wp/wp-content/themes/twentyfifteen/css/ie.css?ver=20141010">
<![endif]-->
<!--[if lt IE 8]>
<link rel="stylesheet" href="/wp/wp-content/themes/twentyfifteen/css/ie7.css?ver=20141010">
<![endif]-->
<script src="/wp/wp-includes/js/jquery/jquery.js?ver=1.11.3"></script>
<script src="/wp/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.2.1"></script>
</head>

<body class="home blog">

Cleaner walker for navigation menus

Walker_Nav_Menu (WordPress default) example output:

  <li id="menu-item-8" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-8"><a href="/">Home</a></li>
  <li id="menu-item-9" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-9"><a href="/sample-page/">Sample Page</a></li>

Soil’s NavWalker example output:

  <li class="menu-home"><a href="/">Home</a></li>
  <li class="menu-sample-page"><a href="/sample-page/">Sample Page</a></li>

Nice search

Redirect search results from /?s=query to /search/query/.

Root relative URLs

Replace many of the absolute URLs that WordPress outputs with root relative URLs.

Google Analytics

Lightweight method of adding support for HTML5 Boilerplate’s Google Analytics snippet to your site.

Move all JS to the footer

Force all WordPress enqueued JavaScript to the footer.

Disable trackbacks

Globally disable trackbacks and pingbacks.

Disable asset versioning

Remove the version query string from all styles and scripts.

Support

Use the Roots Discourse to ask questions and get support.

Ready to checkout?