EddieHubCommunity · VamshiReddy02 · Jan 1, 2023
diff --git a/package-lock.json b/package-lock.json
diff --git a/pages/docs/how-to-guides/bio.mdx b/pages/docs/how-to-guides/bio.mdx
@@ -1,4 +1,5 @@
 import DocsLayout from "../../../components/layouts/DocsLayout.js";
+import ClipboardCopy from "../../../components/ClipboardCopy"
 
 ## Bio
 
@@ -14,11 +15,13 @@ _If you need help on how to edit this file, please see the [Editing guide](/docs
 
 2. In the `bio` string, you can wrap text in double asterix to make it bold, here is an example
 
+<ClipboardCopy>
 ```js
 {
   "bio": "Open Source DevRel | Founder of **EddieHub** | **GitHub** Star"
 }
 ```
+</ClipboardCopy>
 
 ![LinkFree profile using markdown in bio](https://user-images.githubusercontent.com/624760/208985171-9f337433-92c6-43b7-86a4-05d6af691690.png)
 

diff --git a/pages/docs/how-to-guides/links.mdx b/pages/docs/how-to-guides/links.mdx
@@ -1,4 +1,5 @@
 import DocsLayout from "../../../components/layouts/DocsLayout.js";
+import ClipboardCopy from "../../../components/ClipboardCopy"
 
 ## Links
 
@@ -14,13 +15,15 @@ _If you need help on how to edit this file, please see the [Editing guide](/docs
 
 This is an example of a single link object:
 
+<ClipboardCopy>
 ```js
 {
   "name": "Follow me on Twitter",
   "url": "https://twitter.com/SaraJaoude",
   "icon": "FaTwitter"
 }
 ```
+</ClipboardCopy>
 
 | field | type   | description                                                                                                |
 | :---- | :----- | :--------------------------------------------------------------------------------------------------------- |
@@ -30,6 +33,7 @@ This is an example of a single link object:
 
 To add more links add another object inside the links collection. For example:
 
+<ClipboardCopy>
 ```js
   "links": [
     {
@@ -44,6 +48,7 @@ To add more links add another object inside the links collection. For example:
     }
   ]
 ```
+</ClipboardCopy>
 
 3. Now you can commit your file and create a Pull Request, for more details please see [Editing guide](/docs/how-to-guides/editing)
 

diff --git a/pages/docs/how-to-guides/milestones.mdx b/pages/docs/how-to-guides/milestones.mdx
@@ -1,4 +1,5 @@
 import DocsLayout from "../../../components/layouts/DocsLayout.js";
+import ClipboardCopy from "../../../components/ClipboardCopy"
 
 ## Milestones
 
@@ -14,6 +15,7 @@ _If you need help on how to edit this file, please see the [Editing guide](/docs
 
 2. Add a collection called `milestones` at the root of your `json` file which will contain one or more social objects. Each social object must have six fields, `title`, `date`, `icon`, `color`, `description` and `url`, which will look like this:
 
+<ClipboardCopy>
 ```js
 {
     "title": "Started Freelancing",
@@ -24,6 +26,7 @@ _If you need help on how to edit this file, please see the [Editing guide](/docs
     "url": "https://www.eddiejaoude.io/"
 }
 ```
+</ClipboardCopy>
 
 | Property    | Description                                                 |
 | :---------- | :---------------------------------------------------------- |
@@ -36,6 +39,7 @@ _If you need help on how to edit this file, please see the [Editing guide](/docs
 
 This is what a complete example looks like:
 
+<ClipboardCopy>
 ```js
 "milestones": [
     {
@@ -48,6 +52,7 @@ This is what a complete example looks like:
     }
 ]
 ```
+</ClipboardCopy>
 
 3. Now you can commit your file and create a Pull Request, for more details please see [Editing guide](/docs/how-to-guides/editing)
 

diff --git a/pages/docs/how-to-guides/socials-shortcuts.mdx b/pages/docs/how-to-guides/socials-shortcuts.mdx
@@ -1,4 +1,5 @@
 import DocsLayout from "../../../components/layouts/DocsLayout.js";
+import ClipboardCopy from "../../../components/ClipboardCopy"
 
 ## Social shortcuts
 
@@ -14,22 +15,26 @@ _If you need help on how to edit this file, please see the [Editing guide](/docs
 
 2. Add a collection called `socials` at the root of your json file which will contain one or more social objects. Each social object must have two fields, `platform` and `url`, which will look like this:
 
+<ClipboardCopy>
 ```js
 {
   "icon": "FaTwitter",
   "url": "https://twitter.com/eddiejaoude"
 }
 ```
+</ClipboardCopy>
 
 This is what a complete example looks like:
 
+<ClipboardCopy>
 ```js
 "socials": [
   { "icon": "FaTwitter", "url": "https://twitter.com/eddiejaoude" },
   { "icon": "FaGithub", "url": "https://github.com/eddiejaoude" },
   { "icon": "FaYoutube", "url": "https://youtube.com/eddiejaoude" }
 ]
 ```
+</ClipboardCopy>
 
 3. Now you can commit your file and create a Pull Request, for more details please see [Editing guide](/docs/how-to-guides/editing)
 

diff --git a/pages/docs/how-to-guides/statistics.mdx b/pages/docs/how-to-guides/statistics.mdx
@@ -1,4 +1,5 @@
 import DocsLayout from "../../../components/layouts/DocsLayout.js";
+import ClipboardCopy from "../../../components/ClipboardCopy"
 
 ## Statistics
 
@@ -16,6 +17,7 @@ _If you need help on how to edit this file, please see the [Editing guide](/docs
 
 2. Add another field under your name that is `displayStatsPublic` this will need the value `true` and it should look like this:
 
+<ClipboardCopy>
 ```js
 {
   "name": "Sara Jaoude",
@@ -25,6 +27,7 @@ _If you need help on how to edit this file, please see the [Editing guide](/docs
   "avatar": "https://github.com/SaraJaoude.png",
 }
 ```
+</ClipboardCopy>
 
 3. Now you can commit your file and create a Pull Request, for more details please see [Editing guide](/docs/how-to-guides/editing)
 

diff --git a/pages/docs/how-to-guides/tags.mdx b/pages/docs/how-to-guides/tags.mdx
@@ -1,4 +1,5 @@
 import DocsLayout from "../../../components/layouts/DocsLayout.js";
+import ClipboardCopy from "../../../components/ClipboardCopy"
 
 ## Tags
 
@@ -16,6 +17,7 @@ _If you need help on how to edit this file, please see the [Editing guide](/docs
 
 This is what an example looks like:
 
+<ClipboardCopy>
 ```js
 "tags": [
   "Open Source",
@@ -26,6 +28,7 @@ This is what an example looks like:
   "DevRel"
 ]
 ```
+</ClipboardCopy>
 
 3. Now you can commit your file and create a Pull Request, for more details please see [Editing guide](/docs/how-to-guides/editing)
 

diff --git a/pages/docs/how-to-guides/testimonials.mdx b/pages/docs/how-to-guides/testimonials.mdx
@@ -1,4 +1,5 @@
 import DocsLayout from "../../../components/layouts/DocsLayout.js";
+import ClipboardCopy from "../../../components/ClipboardCopy"
 
 ## Testimonials
 
@@ -12,20 +13,23 @@ You can give a Testimonial for another LinkFree user by submitting an issue http
 
 Also you can add a Testimonial manually by creating the `json` file `data/<username>/testimonials/<your-username>.json` with the content:
 
+<ClipboardCopy>
 ```js
 {
   "title": "Founder of an Amazing Community",
   "description": "Eddie founded EddieHub, an opensource community, which aparked my interest in all things FOSS and FOSH. Eddie's YouTube videos are also inspiring, especially the livestreams, where one can really see the community come together. My number one reccommendation to anyone who's starting thier opensource jouney :sparkles:",
   "date": "2022-26-11"
 }
 ```
+</ClipboardCopy>
 
 ### Including a Testimonial on your Profile
 
 If you receive a Testimonials, you can include this in the Testimonial section of your Profile.
 
 You can do this by including the usernames of the testimonials you wish to show on your profile with the following `json` code:
 
+<ClipboardCopy>
 ```js
 "testimonials": [
   "CBID2",
@@ -34,6 +38,7 @@ You can do this by including the usernames of the testimonials you wish to show
   "krupalitrivedi"
 ]
 ```
+</ClipboardCopy>
 
 export default ({ children }) => (
   <DocsLayout title="LinkFree Testimonials Documentation">