diff --git a/app.js b/app.js
index 843aaa367f..db9a2ec031 100755
--- a/app.js
+++ b/app.js
@@ -502,8 +502,7 @@ app.get('/api/codepen/twitter/:screenName', resourcesController.codepenResources
 /**
  * Field Guide related routes
  */
-app.get('/field-guide/getFieldGuideList', fieldGuideController.showAllFieldGuides);
-
+app.get('/field-guide/all-articles', fieldGuideController.showAllFieldGuides);
 
 app.get('/field-guide/:fieldGuideName',
         fieldGuideController.returnIndividualFieldGuide
diff --git a/controllers/fieldGuide.js b/controllers/fieldGuide.js
index c498368f92..2d0809b6a3 100644
--- a/controllers/fieldGuide.js
+++ b/controllers/fieldGuide.js
@@ -54,16 +54,16 @@ exports.returnIndividualFieldGuide = function(req, res, next) {
 };
 
 exports.showAllFieldGuides = function(req, res) {
-  var data = {};
-  data.fieldGuideList = resources.allFieldGuideNames();
-  data.fieldGuideIds = resources.allFieldGuideIds();
+  var allFieldGuideNamesAndIds = resources.allFieldGuideNamesAndIds();
 
+  var completedFieldGuides = [];
   if (req.user && req.user.completedFieldGuides) {
-    data.completedFieldGuides = req.user.completedFieldGuides;
-  } else {
-    data.completedFieldGuides = [];
+    completedFieldGuides = req.user.completedFieldGuides;
   }
-  res.send(data);
+  res.render('field-guide/all-articles', {
+    allFieldGuideNamesAndIds: allFieldGuideNamesAndIds,
+    completedFieldGuides: completedFieldGuides
+  });
 };
 
 exports.returnNextFieldGuide = function(req, res, next) {
diff --git a/controllers/resources.js b/controllers/resources.js
index e9fb94849d..ff1205aa94 100644
--- a/controllers/resources.js
+++ b/controllers/resources.js
@@ -436,12 +436,12 @@ module.exports = {
     }
   },
 
-  allFieldGuideNames: function() {
+  allFieldGuideNamesAndIds: function() {
     if (allFieldGuideNames) {
       return allFieldGuideNames;
     } else {
       allFieldGuideNames = fieldGuides.map(function (elem) {
-        return { name: elem.name };
+        return { name: elem.name, id: elem._id };
       });
       return allFieldGuideNames;
     }
diff --git a/public/js/main.js b/public/js/main.js
index 9f2392fc00..3a3e6e4359 100644
--- a/public/js/main.js
+++ b/public/js/main.js
@@ -220,10 +220,6 @@ $(document).ready(function() {
     }
   });
 
-  $('#showAllButton').on('click', function() {
-    $('#show-all-dialog').modal('show');
-  });
-
   $('.next-challenge-button').on('click', function() {
     l = location.pathname.split('/');
     window.location = '/challenges/' + (parseInt(l[l.length - 1]) + 1);
diff --git a/views/field-guide/all-articles.jade b/views/field-guide/all-articles.jade
new file mode 100644
index 0000000000..32dc9d600b
--- /dev/null
+++ b/views/field-guide/all-articles.jade
@@ -0,0 +1,24 @@
+extends ../layout
+block content
+    .col-xs-12.col-sm-12.col-md-12
+        .panel.panel-info
+            .panel-heading.text-center Read our Field Guide in any order
+            .panel-body
+                .col-xs-12.col-md-8.col-md-offset-2
+                    .col-xs-12.no-right-padding
+                        h3
+                            ol
+                                each fieldGuide in allFieldGuideNamesAndIds
+                                    if completedFieldGuides.indexOf(fieldGuide.id) > -1
+                                        .row
+                                            .hidden-xs.col-sm-3.col-md-2.text-primary.ion-checkmark-circled.padded-ionic-icon.text-center
+                                            .col-xs-12.col-sm-9.col-md-10
+                                                li.faded
+                                                    a(href="/field-guide/#{fieldGuide.name}")= fieldGuide.name
+                                    else
+                                        .row
+                                            .hidden-xs.col-sm-3.col-md-2
+                                                span
+                                            .col-xs-12.col-sm-9.col-md-10
+                                                li
+                                                    a(href="/field-guide/#{fieldGuide.name}")= fieldGuide.name
diff --git a/views/field-guide/show.jade b/views/field-guide/show.jade
index 7fe274edcd..a81eb6682f 100644
--- a/views/field-guide/show.jade
+++ b/views/field-guide/show.jade
@@ -13,18 +13,11 @@ block content
                     if user && user.uncompletedFieldGuides.length > 0
                         .next-field-guide-button.btn.btn-primary.btn-big.btn-block Next article (ctrl + enter)
                         .ten-pixel-break
-                    #showAllButton.btn.btn-info.btn-big.btn-block Show me all articles
+                    a.btn.btn-info.btn-big.btn-block(href='/field-guide/all-articles') Show me all articles
                     if !user
                         .ten-pixel-break
-                        a.btn.btn-big.signup-btn.btn-block(href="/login") Start learning to code (it's free)
+                        a.btn.btn-big.signup-btn.btn-block(href='/login') Start learning to code (it's free)
         .spacer
-    #show-all-dialog.modal(tabindex='-1')
-        .modal-dialog.animated.fadeInUp.fast-animation
-            .modal-content
-                .modal-header.all-list-header Field Guide Articles
-                    a.close.closing-x(href='#', data-dismiss='modal', aria-hidden='true') ×
-                .modal-body
-                    include ../partials/field-guide
     #fieldGuideId.hidden= fieldGuideId
     script.
         $(document).ready(function() {
diff --git a/views/nonprofits/directory.jade b/views/nonprofits/directory.jade
index b39ce839fa..8fb6d2c14b 100644
--- a/views/nonprofits/directory.jade
+++ b/views/nonprofits/directory.jade
@@ -6,6 +6,8 @@ block content
         .panel.panel-info
             .panel-heading.text-center Nonprofits We Help
             .panel-body
+                .col-xs-12.col-md-8.col-md-offset-2
+            .no-right-padding
                 for nonprofit in nonprofits
                     .spacer
                     .row