<details>
<summary>📄 View Full Workflow JSON</summary>
```json
{
"name": "Team LinkedIn Profile Directory Page",
"nodes": [
{
"parameters": {
"path": "team-linkedin",
"responseMode": "responseNode",
"options": {}
},
"id": "85902fe6-27ba-4cff-96e1-8872a699bf0c",
"name": "Webhook Trigger",
"type": "n8n-nodes-base.webhook",
"typeVersion": 2.1,
"position": [
0,
0
],
"webhookId": "70944de0-5ba0-46a0-9702-80aa195324d3"
},
{
"parameters": {
"respondWith": "text",
"responseBody": "<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n <meta charset=\"utf-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>Connect with Our Team on LinkedIn</title>\n <style>\n body {\n font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;\n background: #f5f5f5;\n max-width: 600px;\n padding: 2rem;\n margin: 0 auto;\n }\n \n h1 {\n margin-bottom: 0.25rem;\n }\n \n .subtitle {\n margin-top: 0;\n margin-bottom: 1.5rem;\n color: #555;\n }\n \n ul {\n list-style: none;\n padding: 0;\n }\n \n li {\n margin: 0.5rem 0;\n background: #fff;\n border-radius: 0.5rem;\n padding: 0.75rem 1rem;\n box-shadow: 0 1px 3px rgba(0,0,0,0.08);\n }\n \n a {\n color: #0A66C2;\n font-size: 1.05rem;\n font-weight: 500;\n word-break: break-all;\n text-decoration: none;\n }\n \n small {\n display: block;\n margin-top: 0.25rem;\n color: #777;\n font-size: 0.8rem;\n }\n </style>\n</head>\n<body>\n <h1>Connect with Our Team</h1>\n <p class=\"subtitle\">Tap a name below to open their LinkedIn profile</p>\n \n <ul>\n <li>\n <a href=\"https://linkedin.com/in/andre-exilien-61897515b\" target=\"_blank\">\n Andre Exilien\n <small>linkedin.com/in/andre-exilien-61897515b</small>\n </a>\n </li>\n <li>\n <a href=\"https://linkedin.com/in/aztuxmann\" target=\"_blank\">\n Jason Mann\n <small>linkedin.com/in/aztuxmann</small>\n </a>\n </li>\n <li>\n <a href=\"https://linkedin.com/in/safa-matin-4177678\" target=\"_blank\">\n Safa Martin\n <small>linkedin.com/in/safa-matin-4177678</small>\n </a>\n </li>\n <li>\n <a href=\"https://linkedin.com/in/steven-johnson-coding\" target=\"_blank\">\n Steven Johnson\n <small>linkedin.com/in/steven-johnson-coding</small>\n </a>\n </li>\n <li>\n <a href=\"https://linkedin.com/in/daricaceres\" target=\"_blank\">\n Dari Caceres\n <small>linkedin.com/in/daricaceres</small>\n </a>\n </li>\n </ul>\n</body>\n</html>",
"options": {
"responseHeaders": {
"entries": [
{
"name": "Content-Type",
"value": "text/html"
}
]
}
}
},
"id": "608a0580-ec9f-4f80-a355-890278321e5e",
"name": "Return HTML Page",
"type": "n8n-nodes-base.respondToWebhook",
"typeVersion": 1.5,
"position": [
224,
0
]
},
{
"parameters": {},
"id": "e0e4f26b-f1b6-433f-94e3-3c61e8da65a7",
"name": "Manual Trigger",
"type": "n8n-nodes-base.manualTrigger",
"typeVersion": 1,
"position": [
0,
224
]
},
{
"parameters": {
"assignments": {
"assignments": [
{
"id": "id-1",
"name": "url",
"value": "https://stevenrhett.app.n8n.cloud/webhook/team-linkedin",
"type": "string"
}
]
},
"options": {}
},
"id": "59429c36-f91a-4e0e-b1c4-045fabdc9637",
"name": "Set Hub URL",
"type": "n8n-nodes-base.set",
"typeVersion": 3.4,
"position": [
224,
224
]
},
{
"parameters": {
"url": "=https://api.qrserver.com/v1/create-qr-code/?size=400x400&data={{ $json.url }}",
"options": {
"response": {
"response": {
"responseFormat": "file"
}
}
}
},
"id": "57699557-8a0b-46bd-a331-654178d84038",
"name": "Generate QR Code",
"type": "n8n-nodes-base.httpRequest",
"typeVersion": 4.3,
"position": [
448,
224
]
}
],
"pinData": {},
"connections": {
"Webhook Trigger": {
"main": [
[
{
"node": "Return HTML Page",
"type": "main",
"index": 0
}
]
]
},
"Manual Trigger": {
"main": [
[
{
"node": "Set Hub URL",
"type": "main",
"index": 0
}
]
]
},
"Set Hub URL": {
"main": [
[
{
"node": "Generate QR Code",
"type": "main",
"index": 0
}
]
]
}
},
"active": true,
"settings": {
"executionOrder": "v1"
},
"versionId": "9f8abeb1-0c70-4635-8fc8-3bbba71c8761",
"meta": {
"instanceId": "b2174c815ee80f3b0ced9bbe80cc59e2446ebd3a64dffdfcf412cfa6252b0740"
},
"id": "CHLYi4huASbk3A64",
"tags": []
}
```
</details>
---
# Team LinkedIn Profile Directory Page
An n8n workflow that hosts a mobile-friendly team directory page and generates a QR code for easy sharing.
## Overview
This automation serves two purposes:
1. **Directory Page** — A webhook serves a styled HTML page listing team LinkedIn profiles
2. **QR Code Generator** — A manual trigger creates a scannable QR code linking to the directory
## How It Works
### Flow 1: Serve the Directory Page
#### **Webhook Trigger → Return HTML Page**
When someone visits the webhook URL, they see a clean page with tappable links to each team member's LinkedIn profile.
### Flow 2: Generate a QR Code
`
Manual Trigger → Set Hub URL → Generate QR Code
`
Running this manually calls the QR Server API to create a 400×400 QR code pointing to the directory.
## Configuration
| Setting | Value |
|---------|-------|
| Endpoint | `/webhook/team-linkedin` |
| Full URL | `https://stevenrhett.app.n8n.cloud/webhook/team-linkedin` |
| QR Code Size | 400×400px |
| Status | Active |
## Team Members
- Andre Exilien — [linkedin.com/in/andre-exilien-61897515b](https://linkedin.com/in/andre-exilien-61897515b)
- Jason Mann — [linkedin.com/in/aztuxmann](https://linkedin.com/in/aztuxmann)
- Safa Martin — [linkedin.com/in/safa-matin-4177678](https://linkedin.com/in/safa-matin-4177678)
- Steven Johnson — [linkedin.com/in/steven-johnson-coding](https://linkedin.com/in/steven-johnson-coding)
- Dari Caceres — [linkedin.com/in/daricaceres](https://linkedin.com/in/daricaceres)
## Use Cases
- **Networking events** — Print the QR code on badges or posters
- **Email signatures** — Link to one directory instead of individual profiles
- **Presentations** — Add the QR code to your final slide
- **Business cards** — Single QR code for the whole team
## Workflow JSON
```json
{
"name": "Team LinkedIn Profile Directory Page",
"nodes": [
{
"parameters": {
"path": "team-linkedin",
"responseMode": "responseNode",
"options": {}
},
"id": "85902fe6-27ba-4cff-96e1-8872a699bf0c",
"name": "Webhook Trigger",
"type": "n8n-nodes-base.webhook",
"typeVersion": 2.1,
"position": [0, 0],
"webhookId": "70944de0-5ba0-46a0-9702-80aa195324d3"
},
{
"parameters": {
"respondWith": "text",
"responseBody": "<!DOCTYPE html>...</html>",
"options": {
"responseHeaders": {
"entries": [
{
"name": "Content-Type",
"value": "text/html"
}
]
}
}
},
"id": "608a0580-ec9f-4f80-a355-890278321e5e",
"name": "Return HTML Page",
"type": "n8n-nodes-base.respondToWebhook",
"typeVersion": 1.5,
"position": [224, 0]
},
{
"parameters": {},
"id": "e0e4f26b-f1b6-433f-94e3-3c61e8da65a7",
"name": "Manual Trigger",
"type": "n8n-nodes-base.manualTrigger",
"typeVersion": 1,
"position": [0, 224]
},
{
"parameters": {
"assignments": {
"assignments": [
{
"id": "id-1",
"name": "url",
"value": "https://stevenrhett.app.n8n.cloud/webhook/team-linkedin",
"type": "string"
}
]
},
"options": {}
},
"id": "59429c36-f91a-4e0e-b1c4-045fabdc9637",
"name": "Set Hub URL",
"type": "n8n-nodes-base.set",
"typeVersion": 3.4,
"position": [224, 224]
},
{
"parameters": {
"url": "=https://api.qrserver.com/v1/create-qr-code/?size=400x400&data={{ $json.url }}",
"options": {
"response": {
"response": {
"responseFormat": "file"
}
}
}
},
"id": "57699557-8a0b-46bd-a331-654178d84038",
"name": "Generate QR Code",
"type": "n8n-nodes-base.httpRequest",
"typeVersion": 4.3,
"position": [448, 224]
}
],
"connections": {
"Webhook Trigger": {
"main": [[{"node": "Return HTML Page", "type": "main", "index": 0}]]
},
"Manual Trigger": {
"main": [[{"node": "Set Hub URL", "type": "main", "index": 0}]]
},
"Set Hub URL": {
"main": [[{"node": "Generate QR Code", "type": "main", "index": 0}]]
}
},
"active": true,
"settings": {
"executionOrder": "v1"
},
"id": "CHLYi4huASbk3A64"
}
```
## Notes
- The HTML response is self-contained with inline CSS
- QR codes are generated via the free [QR Server API](https://goqr.me/api/)
- The workflow must be set to **Active** for the webhook to respond
---