diff --git a/content/css/blog.scss b/content/css/blog.scss
index 1624004..6b524e9 100644
--- a/content/css/blog.scss
+++ b/content/css/blog.scss
@@ -192,7 +192,7 @@ p {
 }
 
 .blog-sidebar {
-  padding: 0 15px 70px 15px;
+  padding: 100px 15px 70px 15px;
   grid-column: 3 / 4;
   grid-row: 2 / 3;
   background-color: $white;//$gray-lighter;
diff --git a/content/css/mobile-styles.scss b/content/css/mobile-styles.scss
index 28b5681..52b7f8e 100644
--- a/content/css/mobile-styles.scss
+++ b/content/css/mobile-styles.scss
@@ -10,6 +10,9 @@
 	display: none;
     }
 
+    .recent-posts{
+	display:none;
+    }
     
     body {
     height: auto;
@@ -439,7 +442,11 @@
 }
 
 @media screen and (max-width: 992px) and (max-height: 450px) {
-  .banner {
+    .recent-posts{
+	display:none;
+    }
+
+    .banner {
     background-size: 200px;
     background-position: 100% 200%;
     h1 {
@@ -454,7 +461,11 @@
 }
 
 @media screen and (max-width: 768px) and (min-width: 500px) and (max-height: 450px) and (min-height: 200px) {
-  .banner {
+    .recent-posts{
+	display:none;
+    }
+
+    .banner {
     background-size: 300px;
     background-position: 110% -50%;
   }
@@ -474,6 +485,10 @@
   }
 }
 @media screen and (max-width: 500px) {
+    .recent-posts{
+	display: none;
+    }
+
     .github-corner {
 	display: none;
     }
@@ -496,6 +511,11 @@
 
 @media screen and (max-width: 330px) {
 
+    .recent-posts{
+	display:none;
+    }
+
+    
     .github-corner {
 	display: none;
     }
diff --git a/content/css/stylesheet.scss b/content/css/stylesheet.scss
index 2996467..70094ed 100644
--- a/content/css/stylesheet.scss
+++ b/content/css/stylesheet.scss
@@ -27,6 +27,31 @@ $white: #fff;
     
 }
 
+
+.list-view{
+d-topics-list iframe{
+	width: 300px !important;
+	margin-left: auto;
+	margin-right: auto;
+	font-size: 12px;
+	font-weight: 700;
+	
+}}
+
+.full-view{
+d-topics-list iframe{
+	width: 600px !important;
+	margin-left: auto;
+	margin-right: auto;
+	background-color: #FFFFFF;
+	font-size: 20px;
+	font-weight: 700;
+	font-color: $black;
+}}
+
+
+
+
 // Kat added for ROS explainer video 
 .explainer {
     color: $gray-lighter; 
@@ -396,6 +421,9 @@ header {
       .main-menu-mobile {
         display: none;
       }
+      .recent-posts{
+	  display:none;
+      }
     }
 
     #dropdown-dots {
@@ -988,6 +1016,9 @@ button.owl-next {
   height: 100%;
   display: grid;
   grid-template-columns: 600px 270px;
+
+
+
   grid-template-rows: 50px 225px 250px;
   grid-gap: 30px;
   justify-content: center;
diff --git a/content/index.html b/content/index.html
index 70f38c9..4c29df1 100644
--- a/content/index.html
+++ b/content/index.html
@@ -157,63 +157,19 @@ <h3>Support</h3>
   </div>
   <div class="blog-newsletter">
     <div class="blog-grid">
-      <h4>Recent Updates and Highlights</h4>
+      <h4>Recent Highlights from ROS Discourse</h4>
       <div class="highlighted-post">
-        <div class="highlighted-post-title">
-          <h1>ROS 2 Rolling Ridley</h1>
-        </div>
-        <div class="highlighted-post-subtitle">
-          <h2>The bleeding edge of ROS 2</h2>
-        </div>
-        <div class="highlighted-post-author-date">
-          <h3>8/11/2021 - Katherine Scott</h3>
-        </div>
-        <div class="highlighted-post-content">
-          <p>
-	    It has been <a href="https://docs.ros.org/en/foxy/Releases/Release-Rolling-Ridley.html">well over a
-	    year</a>
-	    since we quietly rolled out the first rolling release for ROS 2
-	    under the codename Rolling Ridley. For those of you who are still
-	    unfamiliar with our rolling release, it is our new approach to
-	    synchronizing and releasing code. The ROS 2 Rolling Ridley release
-	    is simply the bleeding edge of ROS 2 development delivered at a
-	    regular cadence. Unlike our long term support (LTS) and off year
-	    releases, the Rolling Ridley release is essentially a snapshot of
-	    the most current branch of each ROS 2 repository. The advantage of
-	    this approach it that it gives package developers and easy way to
-	    keep up to date with all the new features that are constantly being
-	    added to ROS 2.
-          </p>
-          <a href="https://discourse.ros.org/t/ros-2-rolling-ridley-logo-reveal-t-shirts-swag/21808" class="read-more">READ MORE</a>
-        </div>
+	<div class="full-view">
+        <!-- <d-topics-list class="discourse-big" discourse-url="https://discourse.ros.org" category="8" per-page="1" template="complete" top-period="quarterly" theme="ROSOrgEmbed"></d-topics-list> -->
+        <d-topics-list class="full-view" discourse-url="https://discourse.ros.org" category="8" per-page="3" top-period="weekly" template="complete"></d-topics-list>
+	</div>
       </div>
       <div class="recent-posts">
-        <h1>Recent ROS Discourse Posts</h1>
-        <div class="recent-post">
-          <div class="recent-post-title">
-            <a href="https://discourse.ros.org/t/micro-ros-enabled-robot-and-kinematics/22662"><h2>micro-ROS Enabled Robot and Kinematics</h2></a>
-          </div>
-          <div class="recent-post-author-date">
-            <h3>10/12/2021 - ROS Discourse</h3>
-          </div>
-        </div>
-        <div class="recent-post">
-          <div class="recent-post-title">
-            <a href="https://discourse.ros.org/t/nav2-composition/22175"><h2>Nav 2 Composition</h2></a>
-          </div>
-          <div class="recent-post-author-date">
-            <h3>9/5/2021 - ROS Discourse</h3>
-          </div>
-        </div>
-        <div class="recent-post">
-          <div class="recent-post-title">
-            <a href="https://discourse.ros.org/t/rep-2008-rfc-ros-2-hardware-acceleration-architecture-and-conventions/22026"><h2>REP-2008 RFC - ROS 2 Hardware Acceleration Architecture and Conventions</h2></a>
-          </div>
-          <div class="recent-post-author-date">
-            <h3>8/25/2021 - ROS Discourse</h3>
-          </div>
-        </div>
+        <h1>Top  Discourse Posts</h1>
+	<div class="list-view">
+	  <d-topics-list  discourse-url="https://discourse.ros.org" category="8" per-page="5" top-period="quarterly" template="basic"></d-topics-list>
         <!-- <a href="/blog/archive/" class="blog-archives">blog archive</a> -->
+	</div>
       </div>
       <!-- <div class="newsletter-signup"> -->
       <!--   <h2>Stay Up-to-Date - Subscribe Now!</h2> -->
diff --git a/layouts/_head.html.erb b/layouts/_head.html.erb
index 01a7e63..19f614f 100644
--- a/layouts/_head.html.erb
+++ b/layouts/_head.html.erb
@@ -33,6 +33,8 @@
     href="https://www.ros.org/wp-content/uploads/2013/10/rosorg-favicon.png"
     type="image/x-icon"
   />
+  <script src="https://discourse.ros.org/javascripts/embed-topics.js"></script>
+
   <script src="/javascript/default.js"></script>
   <script src="/javascript/masonry.pkgd.js"></script>
   <!-- you don't need to keep this, but it's cool for stats! -->
diff --git a/layouts/blog/_sidebar.html.erb b/layouts/blog/_sidebar.html.erb
index 91eee16..50ef6ec 100644
--- a/layouts/blog/_sidebar.html.erb
+++ b/layouts/blog/_sidebar.html.erb
@@ -3,6 +3,9 @@
 <!-- I added the nbsp to keep proportionality until we can fill it up. -->
 
 <div class="blog-sidebar">
+    <h2>Recent ROS Discourse Posts</h2>
+    <d-topics-list discourse-url="https://discourse.ros.org" category="8" per-page="10"></d-topics-list>
+
   <!-- <h1>Articles</h1> -->
   <% sorted_articles.first(8).each do |recent_post| %>