diff --git a/themes/example/components/ExampleRecentComments.js b/themes/example/components/ExampleRecentComments.js
index 10db5cd8..32d11463 100644
--- a/themes/example/components/ExampleRecentComments.js
+++ b/themes/example/components/ExampleRecentComments.js
@@ -25,7 +25,7 @@ const ExampleRecentComments = (props) => {
          {onLoading && <div>Loading...<i className='ml-2 fas fa-spinner animate-spin' /></div>}
         {!onLoading && comments && comments.length === 0 && <div>No Comments</div>}
         {!onLoading && comments && comments.length > 0 && comments.map((comment) => <div key={comment.objectId} className='pb-2'>
-            <div className='dark:text-gray-300 text-gray-600 text-xs waline-recent-content' dangerouslySetInnerHTML={{ __html: comment.comment }} />
+            <div className='dark:text-gray-300 text-gray-600 text-xs waline-recent-content wl-content' dangerouslySetInnerHTML={{ __html: comment.comment }} />
             <div className='dark:text-gray-400 text-gray-400 font-sans text-sm text-right cursor-pointer hover:text-red-500 hover:underline pt-1'><Link href={{ pathname: comment.url, hash: comment.objectId, query: { target: 'comment' } }}><a >-- {comment.nick}</a></Link></div>
         </div>)}
 
diff --git a/themes/hexo/components/HexoRecentComments.js b/themes/hexo/components/HexoRecentComments.js
index b0313907..d23c0669 100644
--- a/themes/hexo/components/HexoRecentComments.js
+++ b/themes/hexo/components/HexoRecentComments.js
@@ -33,7 +33,7 @@ const HexoRecentComments = (props) => {
         {onLoading && <div>Loading...<i className='ml-2 fas fa-spinner animate-spin' /></div>}
         {!onLoading && comments && comments.length === 0 && <div>No Comments</div>}
         {!onLoading && comments && comments.length > 0 && comments.map((comment) => <div key={comment.objectId} className='pb-2 pl-1'>
-            <div className='dark:text-gray-200 text-sm waline-recent-content' dangerouslySetInnerHTML={{ __html: comment.comment }} />
+            <div className='dark:text-gray-200 text-sm waline-recent-content wl-content' dangerouslySetInnerHTML={{ __html: comment.comment }} />
             <div className='dark:text-gray-400 text-gray-400 font-sans text-sm text-right cursor-pointer hover:text-red-500 hover:underline pt-1 pr-2'><Link href={{ pathname: comment.url, hash: comment.objectId, query: { target: 'comment' } }}><a >-- {comment.nick}</a></Link></div>
         </div>)}
 
diff --git a/themes/next/components/NextRecentComments.js b/themes/next/components/NextRecentComments.js
index ab101db4..961c3e08 100644
--- a/themes/next/components/NextRecentComments.js
+++ b/themes/next/components/NextRecentComments.js
@@ -25,7 +25,7 @@ const NextRecentComments = (props) => {
         {onLoading && <div>Loading...<i className='ml-2 fas fa-spinner animate-spin' /></div>}
         {!onLoading && comments && comments.length === 0 && <div>No Comments</div>}
         {!onLoading && comments && comments.length > 0 && comments.map((comment) => <div key={comment.objectId} className='pb-2'>
-            <div className='dark:text-gray-300 text-gray-600 text-xs waline-recent-content' dangerouslySetInnerHTML={{ __html: comment.comment }} />
+            <div className='dark:text-gray-300 text-gray-600 text-xs waline-recent-content wl-content' dangerouslySetInnerHTML={{ __html: comment.comment }} />
             <div className='dark:text-gray-400 text-gray-400 font-sans text-sm text-right cursor-pointer hover:text-red-500 hover:underline pt-1'><Link href={{ pathname: comment.url, hash: comment.objectId, query: { target: 'comment' } } }><a >-- {comment.nick}</a></Link></div>
         </div>)}