[fix] add directions on link grouping

pages/docs/environments/gitpod.mdx

@@ -86,7 +86,7 @@ If you encounter permission issues, follow the next steps:
 - Click on the 3 dots after Github and choose _Edit Permissions_
 - Make sure that you have checked _public_repo_ and _workflow_
 
-[![Open LinkFree on Gitpod](https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod)](https://gitpod.io/#https://github.com/EddieHubCommunity/LinkFree)
+[![Open LinkFree on Gitpod](https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod)](https://gitpod.io#https://github.com/EddieHubCommunity/LinkFree)
 
 export default ({ children }) => (
   <DocsLayout

pages/docs/how-to-guides/links.mdx

@@ -33,7 +33,9 @@ This is an example of a single link object:
 | icon  | string | true     | The icon you would like displayed. We support the following icon sets: **Fa** and **Si** from React Icons.                                                                                     |
 | group | string | false    | Optional property to group links together, any without a group will be added to the end in a new group called "Others". If no groups are used then no groups are displayed including "Others". |
 
-To add more links add another object inside the links collection. For example:
+To add more links add another object inside the links collection. 
+
+For example:
 
 <ClipboardCopy>
 ```js
@@ -56,8 +58,53 @@ To add more links add another object inside the links collection. For example:
 
 _Clicks on these social shortcuts that match any of your links will also increment their respective counters_
 
-### What Links with grouping looks like
+### Grouping your Links (optional)
+To place your social links into categories, you can use names like `Business`,  `Socials Primary`, or `:sparkles: Personal` in the `group` string.
+
+These can include any alphanumeric, unicode characters and symbols.
+
+<ClipboardCopy>
+```js
+"links": [
+ {
+      "group": "Business",
+      "name": "Business: DevRel Services",
+      "url": "http://eddiejaoude.io",
+      "icon": "FaLink"
+    },
+    {
+      "group": "Socials Primary",
+      "name": "Twitter: Follow me",
+      "url": "https://twitter.com/eddiejaoude",
+      "icon": "FaTwitter",
+      "color": "#00ACEE"
+    },
+    {
+      "group": "Socials Primary",
+      "name": "YouTube: Learn more about Open Source",
+      "url": "https://youtube.com/eddiejaoude",
+      "icon": "FaYoutube",
+      "color": "#FF0000"
+    },
+    {
+      "group": "Socials Primary",
+      "name": "GitHub: Collaborate on Open Source",
+      "url": "https://github.com/eddiejaoude",
+      "icon": "FaGithub"
+    },
+    {
+      "group": "Socials Primary",
+      "name": "LinkedIn: Let's connect",
+      "url": "https://linkedin.com/in/eddiejaoude",
+      "icon": "FaLinkedin"
+    }
+
+]
+
+  ```
+</ClipboardCopy>
 
+Here is how the links with grouping will appear on your Profile:
 ![LinkFree profile with grouped links](https://user-images.githubusercontent.com/624760/214538171-099cac71-d2f7-49a8-b3bb-2747506a1bac.png)
 
 export default ({ children }) => (