diff --git a/packages/vulcan-base-components/lib/posts/PostsList.jsx b/packages/vulcan-base-components/lib/posts/PostsList.jsx
index 99ef1b9c5..fe35636fb 100644
--- a/packages/vulcan-base-components/lib/posts/PostsList.jsx
+++ b/packages/vulcan-base-components/lib/posts/PostsList.jsx
@@ -23,7 +23,12 @@ const PostsList = ({className, results, loading, count, totalCount, loadMore, sh
         <div className="posts-list-content">
           {results.map(post => <Components.PostsItem post={post} key={post._id} currentUser={currentUser} terms={terms} />)}
         </div>
-        {showLoadMore ? hasMore ? (loadingMore ? <Components.PostsLoading/> : <Components.PostsLoadMore loadMore={loadMore} count={count} totalCount={totalCount} />) : <Components.PostsNoMore/> : null}
+        {showLoadMore ? 
+          hasMore ? 
+            <Components.PostsLoadMore loading={loadingMore} loadMore={loadMore} count={count} totalCount={totalCount} /> : 
+            <Components.PostsNoMore/> : 
+          null
+        }
       </div>
     )
   } else if (loading) {
diff --git a/packages/vulcan-base-components/lib/posts/PostsLoadMore.jsx b/packages/vulcan-base-components/lib/posts/PostsLoadMore.jsx
index 30909ad66..72fc25b26 100644
--- a/packages/vulcan-base-components/lib/posts/PostsLoadMore.jsx
+++ b/packages/vulcan-base-components/lib/posts/PostsLoadMore.jsx
@@ -1,14 +1,18 @@
-import { registerComponent } from 'meteor/vulcan:core';
+import { Components, registerComponent } from 'meteor/vulcan:core';
 import React from 'react';
 import { FormattedMessage } from 'meteor/vulcan:i18n';
+import classNames from 'classnames';
 
-const PostsLoadMore = ({loadMore, count, totalCount}) => {
+const PostsLoadMore = ({loading, loadMore, count, totalCount}) => {
   return (
-    <a className="posts-load-more" href="#" onClick={e => {e.preventDefault(); loadMore();}}>
-      <span><FormattedMessage id="posts.load_more"/></span>
-      &nbsp;
-      {totalCount ? <span className="load-more-count">{`(${count}/${totalCount})`}</span> : null}
-    </a>
+    <div className={classNames('posts-load-more', {'posts-load-more-loading': loading})}>
+      <a className="posts-load-more-link" href="#" onClick={e => {e.preventDefault(); loadMore();}}>
+        <span><FormattedMessage id="posts.load_more"/></span>
+        &nbsp;
+        {totalCount ? <span className="load-more-count">{`(${count}/${totalCount})`}</span> : null}
+      </a>
+      {loading ? <div className="posts-load-more-loader"><Components.Loading/></div> : null}
+    </div>
   )
 }