diff --git a/client/gatsby-browser.js b/client/gatsby-browser.js
index 5c4b856fc7..bf6c682fc8 100644
--- a/client/gatsby-browser.js
+++ b/client/gatsby-browser.js
@@ -5,6 +5,7 @@ import { Provider } from 'react-redux';
 import { createStore } from './src/redux/createStore';
 import AppMountNotifier from './src/components/AppMountNotifier';
 import GuideNavContextProvider from './src/contexts/GuideNavigationContext';
+import DefaultLayout from './src/components/layouts/Default';
 
 const store = createStore();
 
@@ -21,3 +22,23 @@ export const wrapRootElement = ({ element }) => {
 wrapRootElement.propTypes = {
   element: PropTypes.any
 };
+
+export const wrapPageElement = ({ element, props }) => {
+  const {
+    location: { pathname }
+  } = props;
+  if (pathname === '/') {
+    return (
+      <DefaultLayout disableSettings={true} landingPage={true}>
+        {element}
+      </DefaultLayout>
+    );
+  }
+  return <DefaultLayout>{element}</DefaultLayout>;
+};
+
+wrapPageElement.propTypes = {
+  element: PropTypes.any,
+  location: PropTypes.objectOf({ pathname: PropTypes.string }),
+  props: PropTypes.any
+};
diff --git a/client/gatsby-ssr.js b/client/gatsby-ssr.js
index 70779dda1c..664123ff25 100644
--- a/client/gatsby-ssr.js
+++ b/client/gatsby-ssr.js
@@ -7,6 +7,7 @@ import headComponents from './src/head';
 import { createStore } from './src/redux/createStore';
 
 import GuideNavContextProvider from './src/contexts/GuideNavigationContext';
+import DefaultLayout from './src/components/layouts/Default';
 
 const store = createStore();
 
@@ -22,6 +23,26 @@ wrapRootElement.propTypes = {
   element: PropTypes.any
 };
 
+export const wrapPageElement = ({ element, props }) => {
+  const {
+    location: { pathname }
+  } = props;
+  if (pathname === '/') {
+    return (
+      <DefaultLayout disableSettings={true} landingPage={true}>
+        {element}
+      </DefaultLayout>
+    );
+  }
+  return <DefaultLayout>{element}</DefaultLayout>;
+};
+
+wrapPageElement.propTypes = {
+  element: PropTypes.any,
+  location: PropTypes.objectOf({ pathname: PropTypes.string }),
+  props: PropTypes.any
+};
+
 export const onRenderBody = ({ setHeadComponents, setPostBodyComponents }) => {
   setHeadComponents([...headComponents]);
   setPostBodyComponents(
diff --git a/client/src/client-only-routes/ShowProfileOrFourOhFour.js b/client/src/client-only-routes/ShowProfileOrFourOhFour.js
index 2e5f8e9726..233f115f94 100644
--- a/client/src/client-only-routes/ShowProfileOrFourOhFour.js
+++ b/client/src/client-only-routes/ShowProfileOrFourOhFour.js
@@ -5,7 +5,6 @@ import { connect } from 'react-redux';
 import { isEmpty } from 'lodash';
 
 import Loader from '../components/helpers/Loader';
-import Layout from '../components/layouts/Default';
 import {
   userByNameSelector,
   userProfileFetchStateSelector,
@@ -61,11 +60,9 @@ class ShowFourOhFour extends Component {
       // We don't know if /:maybeUser is a user or not, we will show the loader
       // until we get a response from the API
       return (
-        <Layout>
-          <div className='loader-wrapper'>
-            <Loader />
-          </div>
-        </Layout>
+        <div className='loader-wrapper'>
+          <Loader />
+        </div>
       );
     }
     if (isEmpty(requestedUser)) {
diff --git a/client/src/client-only-routes/ShowSettings.js b/client/src/client-only-routes/ShowSettings.js
index 680fd26fa5..4737d519c8 100644
--- a/client/src/client-only-routes/ShowSettings.js
+++ b/client/src/client-only-routes/ShowSettings.js
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { Fragment } from 'react';
 import PropTypes from 'prop-types';
 import { bindActionCreators } from 'redux';
 import { connect } from 'react-redux';
@@ -16,7 +16,6 @@ import {
 import { submitNewAbout, updateUserFlag, verifyCert } from '../redux/settings';
 import { createFlashMessage } from '../components/Flash/redux';
 
-import Layout from '../components/layouts/Default';
 import Spacer from '../components/helpers/Spacer';
 import Loader from '../components/helpers/Loader';
 import FullWidthRow from '../components/helpers/FullWidthRow';
@@ -167,11 +166,9 @@ function ShowSettings(props) {
 
   if (showLoading) {
     return (
-      <Layout>
-        <div className='loader-wrapper'>
-          <Loader />
-        </div>
-      </Layout>
+      <div className='loader-wrapper'>
+        <Loader />
+      </div>
     );
   }
 
@@ -180,7 +177,7 @@ function ShowSettings(props) {
   }
 
   return (
-    <Layout>
+    <Fragment>
       <Helmet>
         <title>Settings | freeCodeCamp.org</title>
       </Helmet>
@@ -264,7 +261,7 @@ function ShowSettings(props) {
           {/* <DangerZone /> */}
         </main>
       </Grid>
-    </Layout>
+    </Fragment>
   );
 }
 
diff --git a/client/src/client-only-routes/ShowUnsubscribed.js b/client/src/client-only-routes/ShowUnsubscribed.js
index 4e3a969117..780ce44201 100644
--- a/client/src/client-only-routes/ShowUnsubscribed.js
+++ b/client/src/client-only-routes/ShowUnsubscribed.js
@@ -1,10 +1,9 @@
-import React from 'react';
+import React, { Fragment } from 'react';
 import PropTypes from 'prop-types';
 import { Grid, Panel, Button } from '@freecodecamp/react-bootstrap';
 import Helmet from 'react-helmet';
 
 import env from '../../config/env.json';
-import Layout from '../components/layouts/Default';
 import FullWidthRow from '../components/helpers/FullWidthRow';
 import { Spacer } from '../components/helpers';
 
@@ -12,7 +11,7 @@ const { apiLocation } = env;
 
 function ShowUnsubscribed({ unsubscribeId }) {
   return (
-    <Layout>
+    <Fragment>
       <Helmet>
         <title>You have been unsubscribed | freeCodeCamp.org</title>
       </Helmet>
@@ -41,7 +40,7 @@ function ShowUnsubscribed({ unsubscribeId }) {
           ) : null}
         </main>
       </Grid>
-    </Layout>
+    </Fragment>
   );
 }
 
diff --git a/client/src/client-only-routes/ShowUser.js b/client/src/client-only-routes/ShowUser.js
index 996ec546bc..c1b4b3e65f 100644
--- a/client/src/client-only-routes/ShowUser.js
+++ b/client/src/client-only-routes/ShowUser.js
@@ -1,4 +1,4 @@
-import React, { Component } from 'react';
+import React, { Component, Fragment } from 'react';
 import PropTypes from 'prop-types';
 import { bindActionCreators } from 'redux';
 import { Link, navigate } from 'gatsby';
@@ -20,7 +20,6 @@ import {
   userSelector,
   reportUser
 } from '../redux';
-import Layout from '../components/layouts/Default';
 import { Spacer, Loader, FullWidthRow } from '../components/helpers';
 
 const propTypes = {
@@ -91,52 +90,48 @@ class ShowUser extends Component {
     const { pending, complete, errored } = userFetchState;
     if (pending && !complete) {
       return (
-        <Layout>
-          <div className='loader-wrapper'>
-            <Loader />
-          </div>
-        </Layout>
+        <div className='loader-wrapper'>
+          <Loader />
+        </div>
       );
     }
 
     if ((complete || errored) && !isSignedIn) {
       this.setNavigationTimer();
       return (
-        <Layout>
-          <main>
-            <FullWidthRow>
-              <Spacer />
-              <Spacer />
-              <Panel bsStyle='info'>
-                <Panel.Heading>
-                  <Panel.Title componentClass='h3'>
-                    You need to be signed in to report a user
-                  </Panel.Title>
-                </Panel.Heading>
-                <Panel.Body className='text-center'>
-                  <Spacer />
-                  <p>
-                    You will be redirected to sign in to freeCodeCamp.org
-                    automatically in 5 seconds
-                  </p>
-                  <p>
-                    <Link to='/signin'>
-                      Or you can here if you do not want to wait
-                    </Link>
-                  </p>
-                  <Spacer />
-                </Panel.Body>
-              </Panel>
-            </FullWidthRow>
-          </main>
-        </Layout>
+        <main>
+          <FullWidthRow>
+            <Spacer />
+            <Spacer />
+            <Panel bsStyle='info'>
+              <Panel.Heading>
+                <Panel.Title componentClass='h3'>
+                  You need to be signed in to report a user
+                </Panel.Title>
+              </Panel.Heading>
+              <Panel.Body className='text-center'>
+                <Spacer />
+                <p>
+                  You will be redirected to sign in to freeCodeCamp.org
+                  automatically in 5 seconds
+                </p>
+                <p>
+                  <Link to='/signin'>
+                    Or you can here if you do not want to wait
+                  </Link>
+                </p>
+                <Spacer />
+              </Panel.Body>
+            </Panel>
+          </FullWidthRow>
+        </main>
       );
     }
 
     const { textarea } = this.state;
 
     return (
-      <Layout>
+      <Fragment>
         <Helmet>
           <title>Report a users profile | freeCodeCamp.org</title>
         </Helmet>
@@ -170,7 +165,7 @@ class ShowUser extends Component {
             </form>
           </Col>
         </FullWidthRow>
-      </Layout>
+      </Fragment>
     );
   }
 }
diff --git a/client/src/components/FourOhFour/index.js b/client/src/components/FourOhFour/index.js
index 1864f96669..9623145b74 100644
--- a/client/src/components/FourOhFour/index.js
+++ b/client/src/components/FourOhFour/index.js
@@ -3,8 +3,6 @@ import Helmet from 'react-helmet';
 import Spinner from 'react-spinkit';
 import { Link } from 'gatsby';
 
-import Layout from '../layouts/Default';
-
 import notFoundLogo from '../../images/freeCodeCamp-404.svg';
 import { quotes } from '../../resources/quotes.json';
 
@@ -30,33 +28,31 @@ class NotFoundPage extends Component {
 
   render() {
     return (
-      <Layout>
-        <div className='notfound-page-wrapper'>
-          <Helmet title='Page Not Found | freeCodeCamp' />
-          <img alt='404 Not Found' src={notFoundLogo} />
-          <h1>NOT FOUND</h1>
-          {this.state.randomQuote ? (
-            <div>
-              <p>
-                We couldn&#x27;t find what you were looking for, but here is a
-                quote:
+      <div className='notfound-page-wrapper'>
+        <Helmet title='Page Not Found | freeCodeCamp' />
+        <img alt='404 Not Found' src={notFoundLogo} />
+        <h1>NOT FOUND</h1>
+        {this.state.randomQuote ? (
+          <div>
+            <p>
+              We couldn&#x27;t find what you were looking for, but here is a
+              quote:
+            </p>
+            <div className='quote-wrapper'>
+              <p className='quote'>
+                <span>&#8220;</span>
+                {this.state.randomQuote.quote}
               </p>
-              <div className='quote-wrapper'>
-                <p className='quote'>
-                  <span>&#8220;</span>
-                  {this.state.randomQuote.quote}
-                </p>
-                <p className='author'>- {this.state.randomQuote.author}</p>
-              </div>
+              <p className='author'>- {this.state.randomQuote.author}</p>
             </div>
-          ) : (
-            <Spinner color='#006400' name='ball-clip-rotate-multiple' />
-          )}
-          <Link className='btn-curriculum' to='/learn'>
-            View the Curriculum
-          </Link>
-        </div>
-      </Layout>
+          </div>
+        ) : (
+          <Spinner color='#006400' name='ball-clip-rotate-multiple' />
+        )}
+        <Link className='btn-curriculum' to='/learn'>
+          View the Curriculum
+        </Link>
+      </div>
     );
   }
 }
diff --git a/client/src/components/layouts/GuideLayout.js b/client/src/components/layouts/GuideLayout.js
index 2407d66216..8beadd6450 100644
--- a/client/src/components/layouts/GuideLayout.js
+++ b/client/src/components/layouts/GuideLayout.js
@@ -1,10 +1,9 @@
-import React from 'react';
+import React, { Fragment } from 'react';
 import PropTypes from 'prop-types';
 import { StaticQuery, graphql } from 'gatsby';
 import { Grid, Col, Row } from '@freecodecamp/react-bootstrap';
 
 import { NavigationContext } from '../../contexts/GuideNavigationContext';
-import DefaultLayout from './Default';
 import SideNav from './components/guide/SideNav';
 import Spacer from '../helpers/Spacer';
 
@@ -59,7 +58,7 @@ const Layout = ({ children }) => (
             expandedState,
             toggleExpandedState
           }) => (
-            <DefaultLayout>
+            <Fragment>
               <Spacer size={2} />
               <Grid>
                 <Row>
@@ -87,7 +86,7 @@ const Layout = ({ children }) => (
                   </Col>
                 </Row>
               </Grid>
-            </DefaultLayout>
+            </Fragment>
           )}
         </NavigationContext>
       );
diff --git a/client/src/components/layouts/Learn.js b/client/src/components/layouts/Learn.js
index 87cc125afc..b6bda95557 100644
--- a/client/src/components/layouts/Learn.js
+++ b/client/src/components/layouts/Learn.js
@@ -1,7 +1,6 @@
 import React, { Fragment } from 'react';
 import PropTypes from 'prop-types';
 
-import DefaultLayout from './Default';
 import DonationModal from '../Donation';
 
 import 'prismjs/themes/prism.css';
@@ -11,9 +10,7 @@ import './learn.css';
 function LearnLayout({ children }) {
   return (
     <Fragment>
-      <DefaultLayout>
-        <main id='learn-app-wrapper'>{children}</main>
-      </DefaultLayout>
+      <main id='learn-app-wrapper'>{children}</main>
       <DonationModal />
     </Fragment>
   );
diff --git a/client/src/components/profile/Profile.js b/client/src/components/profile/Profile.js
index 1149ac4ecd..3943b6415c 100644
--- a/client/src/components/profile/Profile.js
+++ b/client/src/components/profile/Profile.js
@@ -4,7 +4,6 @@ import { Alert, Button, Grid, Row, Col } from '@freecodecamp/react-bootstrap';
 import Helmet from 'react-helmet';
 import { Link } from 'gatsby';
 
-import Layout from '../layouts/Default';
 import CurrentChallengeLink from '../helpers/CurrentChallengeLink';
 import FullWidthRow from '../helpers/FullWidthRow';
 import Spacer from '../helpers/Spacer';
@@ -44,7 +43,7 @@ function TakeMeToTheChallenges() {
 
 function renderIsLocked(username) {
   return (
-    <Layout>
+    <Fragment>
       <Helmet>
         <title>{username} | freeCodeCamp.org</title>
       </Helmet>
@@ -67,7 +66,7 @@ function renderIsLocked(username) {
           <TakeMeToTheChallenges />
         </FullWidthRow>
       </Grid>
-    </Layout>
+    </Fragment>
   );
 }
 
@@ -131,7 +130,7 @@ function Profile({ user, isSessionUser }) {
     return renderIsLocked(username);
   }
   return (
-    <Layout>
+    <Fragment>
       <Helmet>
         <title>{username} | freeCodeCamp.org</title>
       </Helmet>
@@ -166,7 +165,7 @@ function Profile({ user, isSessionUser }) {
           />
         ) : null}
       </Grid>
-    </Layout>
+    </Fragment>
   );
 }
 
diff --git a/client/src/pages/academic-honesty.js b/client/src/pages/academic-honesty.js
index e531a5a1b8..9bec57e588 100644
--- a/client/src/pages/academic-honesty.js
+++ b/client/src/pages/academic-honesty.js
@@ -1,16 +1,15 @@
-import React from 'react';
+import React, { Fragment } from 'react';
 import { Grid } from '@freecodecamp/react-bootstrap';
 import Helmet from 'react-helmet';
 
 import honesty from '../resources/honesty-policy';
 
-import Layout from '../components/layouts/Default';
 import Spacer from '../components/helpers/Spacer';
 import FullWidthRow from '../components/helpers/FullWidthRow';
 
 function AcademicHonesty() {
   return (
-    <Layout>
+    <Fragment>
       <Helmet>
         <title>Academic Honesty Policy | freeCodeCamp.org</title>
       </Helmet>
@@ -22,7 +21,7 @@ function AcademicHonesty() {
           {honesty}
         </FullWidthRow>
       </Grid>
-    </Layout>
+    </Fragment>
   );
 }
 
diff --git a/client/src/pages/accept-privacy-terms.js b/client/src/pages/accept-privacy-terms.js
index 3e8a9a1b33..d2354d9979 100644
--- a/client/src/pages/accept-privacy-terms.js
+++ b/client/src/pages/accept-privacy-terms.js
@@ -1,4 +1,4 @@
-import React, { Component } from 'react';
+import React, { Component, Fragment } from 'react';
 import PropTypes from 'prop-types';
 import { bindActionCreators } from 'redux';
 import { connect } from 'react-redux';
@@ -13,7 +13,6 @@ import {
 } from '@freecodecamp/react-bootstrap';
 import Helmet from 'react-helmet';
 
-import Layout from '../components/layouts/Default';
 import { ButtonSpacer, Spacer } from '../components/helpers';
 import { acceptTerms, userSelector } from '../redux';
 import { createSelector } from 'reselect';
@@ -71,7 +70,7 @@ class AcceptPrivacyTerms extends Component {
     }
     const { privacyPolicy, termsOfService, quincyEmail } = this.state;
     return (
-      <Layout>
+      <Fragment>
         <Helmet>
           <title>Privacy Policy and Terms of Service | freeCodeCamp.org</title>
         </Helmet>
@@ -165,7 +164,7 @@ class AcceptPrivacyTerms extends Component {
             </Col>
           </Row>
         </Grid>
-      </Layout>
+      </Fragment>
     );
   }
 }
diff --git a/client/src/pages/index.js b/client/src/pages/index.js
index e2ce28a589..7f7935362d 100644
--- a/client/src/pages/index.js
+++ b/client/src/pages/index.js
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { Fragment } from 'react';
 import { Grid, Row, Col, Image } from '@freecodecamp/react-bootstrap';
 import FontAwesomeIcon from '@fortawesome/react-fontawesome';
 import {
@@ -13,7 +13,6 @@ import { faDatabase } from '@fortawesome/free-solid-svg-icons';
 import Helmet from 'react-helmet';
 
 import { Spacer } from '../components/helpers';
-import Layout from '../components/layouts/Default';
 import Login from '../components/Header/components/Login';
 
 import './index.css';
@@ -27,7 +26,7 @@ const BigCallToAction = () => (
 );
 
 const IndexPage = () => (
-  <Layout disableSettings={true} landingPage={true}>
+  <Fragment>
     <Helmet>
       <title>Learn to code | freeCodeCamp.org</title>
     </Helmet>
@@ -246,7 +245,7 @@ const IndexPage = () => (
       <Spacer />
       <Spacer />
     </Grid>
-  </Layout>
+  </Fragment>
 );
 
 export default IndexPage;
diff --git a/client/src/pages/software-resources-for-nonprofits.js b/client/src/pages/software-resources-for-nonprofits.js
index d4879fb455..df8d5ae6f7 100644
--- a/client/src/pages/software-resources-for-nonprofits.js
+++ b/client/src/pages/software-resources-for-nonprofits.js
@@ -1,14 +1,13 @@
-import React from 'react';
+import React, { Fragment } from 'react';
 import { Grid } from '@freecodecamp/react-bootstrap';
 import Helmet from 'react-helmet';
 
-import Layout from '../components/layouts/Default';
 import FullWidthRow from '../components/helpers/FullWidthRow';
 import { Spacer } from '../components/helpers';
 
 function SoftwareResourcesForNonProfits() {
   return (
-    <Layout>
+    <Fragment>
       <Helmet>
         <title>Software Resources for Nonprofits | freeCodeCamp.org</title>
       </Helmet>
@@ -312,7 +311,7 @@ function SoftwareResourcesForNonProfits() {
           </ul>
         </FullWidthRow>
       </Grid>
-    </Layout>
+    </Fragment>
   );
 }
 
diff --git a/client/src/pages/update-email.js b/client/src/pages/update-email.js
index 204777b41d..7e84af27d3 100644
--- a/client/src/pages/update-email.js
+++ b/client/src/pages/update-email.js
@@ -1,4 +1,4 @@
-import React, { Component } from 'react';
+import React, { Component, Fragment } from 'react';
 import PropTypes from 'prop-types';
 import { Link } from 'gatsby';
 import { bindActionCreators } from 'redux';
@@ -18,7 +18,6 @@ import Helmet from 'react-helmet';
 import isEmail from 'validator/lib/isEmail';
 import { isString } from 'lodash';
 
-import Layout from '../components/layouts/Default';
 import { Spacer } from '../components/helpers';
 import './update-email.css';
 import { userSelector } from '../redux';
@@ -79,7 +78,7 @@ class UpdateEmail extends Component {
   render() {
     const { isNewEmail } = this.props;
     return (
-      <Layout>
+      <Fragment>
         <Helmet>
           <title>Update your email address | freeCodeCamp.org</title>
         </Helmet>
@@ -127,7 +126,7 @@ class UpdateEmail extends Component {
             </Col>
           </Row>
         </Grid>
-      </Layout>
+      </Fragment>
     );
   }
 }
diff --git a/client/src/pages/welcome.js b/client/src/pages/welcome.js
index 41d05671d3..54537834ab 100644
--- a/client/src/pages/welcome.js
+++ b/client/src/pages/welcome.js
@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { Fragment } from 'react';
 import PropTypes from 'prop-types';
 import { navigate } from 'gatsby';
 import { bindActionCreators } from 'redux';
@@ -9,7 +9,6 @@ import Helmet from 'react-helmet';
 
 import { Loader, Spacer } from '../components/helpers';
 import CurrentChallengeLink from '../components/helpers/CurrentChallengeLink';
-import Layout from '../components/layouts/Default';
 import Supporters from '../components/Supporters';
 import {
   userSelector,
@@ -70,11 +69,9 @@ function Welcome({
 }) {
   if (pending && !complete) {
     return (
-      <Layout>
-        <div className='loader-wrapper'>
-          <Loader />
-        </div>
-      </Layout>
+      <div className='loader-wrapper'>
+        <Loader />
+      </div>
     );
   }
 
@@ -90,7 +87,7 @@ function Welcome({
 
   const { quote, author } = randomQuote();
   return (
-    <Layout>
+    <Fragment>
       <Helmet>
         <title>Welcome {name ? name : 'Camper'} | freeCodeCamp.org</title>
       </Helmet>
@@ -147,17 +144,17 @@ function Welcome({
           <Spacer />
           <Row>
             <Col sm={8} smOffset={2} xs={12}>
-            <CurrentChallengeLink>
-              <Button block={true} bsStyle='primary' className='btn-cta-big'>
-                Go to my next challenge
-              </Button>
-            </CurrentChallengeLink>
+              <CurrentChallengeLink>
+                <Button block={true} bsStyle='primary' className='btn-cta-big'>
+                  Go to my next challenge
+                </Button>
+              </CurrentChallengeLink>
             </Col>
           </Row>
           <Spacer size={4} />
         </Grid>
       </main>
-    </Layout>
+    </Fragment>
   );
 }