diff --git a/components/MDContent.js b/components/MDContent.js
index 274a4ce..f521ce0 100644
--- a/components/MDContent.js
+++ b/components/MDContent.js
@@ -18,7 +18,7 @@ function BackLinks({linkList}) {
                         <Link href={aLink.slug}>
                             <a >
                                     <p className="backlink-title">{aLink.title}</p>
-                                    <p className="backlink-preview">Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsumLorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum  </p>
+                                    <p className="backlink-preview">{aLink.shortSummary} </p>
                             </a>
                         </Link>
 
@@ -50,8 +50,8 @@ function MDContent({content, fileNames, backLinks, handleOpenNewContent}) {
                 href="https://twitter.com/tuancm">@tuancm</a></span>
             </Alert>
             <div dangerouslySetInnerHTML={{__html: content}}/>
-            <button onClick={handleInternalLinkClick}>Click me</button>
-            <hr/>
+            {/*<button onClick={handleInternalLinkClick}>Click me</button>*/}
+            {/*<hr/>*/}
             <div>
                 <BackLinks linkList={backLinks}/>
             </div>
diff --git a/lib/utils.js b/lib/utils.js
index 2ce4e17..dc69103 100644
--- a/lib/utils.js
+++ b/lib/utils.js
@@ -1,6 +1,29 @@
 import path from 'path'
 import {Node} from "./node"
 import {Transformer} from "./transformer";
+import unified from "unified";
+import markdown from "remark-parse";
+import {toString} from 'mdast-util-to-string'
+
+export function getContent(filename) {
+    let { currentFilePath} = getFileNames(filename);
+    //console.log("currentFilePath: ", currentFilePath)
+    if (currentFilePath === undefined || currentFilePath == null) return null
+    return  Node.readFileSync(currentFilePath)
+}
+
+export function getShortSummary(filename) {
+    const content = getContent(filename)
+    if (content === undefined || content === null) {
+        return
+    }
+
+    const tree = unified().use(markdown)
+        .parse(content)
+    let plainText = toString(tree)
+    return plainText.split(" ").splice(0, 40).join(" ")
+}
+
 
 const dirTree = require("directory-tree");
 const postsDirectory = path.join(process.cwd(), 'posts')
@@ -78,6 +101,8 @@ export function constructBackLinks() {
                 }
                 edges.push(anEdge)
                 if (nodes.findIndex(aNode => aNode.slug === aLink.slug) === -1) {
+                    aLink.shortSummary = getShortSummary(aLink.slug)
+                    console.log(aLink.shortSummary)
                     nodes.push(aLink)
                 }
             })
diff --git a/package.json b/package.json
index 1951ffe..7f3c13a 100644
--- a/package.json
+++ b/package.json
@@ -23,6 +23,7 @@
     "fs": "^0.0.1-security",
     "gray-matter": "^4.0.2",
     "jsnetworkx": "^0.3.4",
+    "mdast-util-to-string": "^3.1.0",
     "next": "12",
     "path": "^0.12.7",
     "react": "^17.0.2",
diff --git a/styles/style.css b/styles/style.css
index 0c206f4..37222c7 100644
--- a/styles/style.css
+++ b/styles/style.css
@@ -12,14 +12,13 @@ a:hover {
     height: 100%;
     overflow: hidden;
     position: relative;
-    display: flex;
     flex-direction: row;
     justify-content: center;
 }
 /* Foooter section BEGIN */
 .note-footer {
     display: block;
-    background-color: rgba(238, 238, 238, 0.8);
+    background-color: rgba(238, 238, 238, 0.5);
     border-radius: 16px;
     margin-top: 24px;
     padding: 16px;
@@ -55,7 +54,7 @@ a:hover {
 }
 
 .backlink-container .backlink:hover {
-    background-color: rgba(180, 177, 177, 0.3);
+    background-color: rgba(199, 199, 199, 0.3);
 }
 
 .backlink-container  .backlink-title {
diff --git a/yarn.lock b/yarn.lock
index 77205e9..4d0a625 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1488,6 +1488,11 @@ mdast-util-to-string@^2.0.0:
   resolved "https://registry.npmjs.org/mdast-util-to-string/-/mdast-util-to-string-2.0.0.tgz"
   integrity sha512-AW4DRS3QbBayY/jJmD8437V1Gombjf8RSOUCMFBuo5iHi58AGEgVCKQ+ezHkZZDpAQS75hcBMpLqjpJTjtUL7w==
 
+mdast-util-to-string@^3.1.0:
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/mdast-util-to-string/-/mdast-util-to-string-3.1.0.tgz#56c506d065fbf769515235e577b5a261552d56e9"
+  integrity sha512-n4Vypz/DZgwo0iMHLQL49dJzlp7YtAJP+N07MZHpjPf/5XJuHUWstviF4Mn2jEiR/GNmtnRRqnwsXExk3igfFA==
+
 mdast-util-wiki-link@^0.0.2:
   version "0.0.2"
   resolved "https://registry.npmjs.org/mdast-util-wiki-link/-/mdast-util-wiki-link-0.0.2.tgz"