Skip to content

Fix: Open tutorial GIFs in lightbox overlay instead of new tab [#173] #174

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
Tharindu-Senanayake12 wants to merge 2 commits into
base: main
Choose a base branch
from
Open

Fix: Open tutorial GIFs in lightbox overlay instead of new tab [#173] #174

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
d74a008
Fix: Enable GLightbox for GIF demonstrations
Tharindu-Senanayake12 Mar 23, 2026
6c66f19
update view
Tharindu-Senanayake12 Mar 23, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 4 additions & 4 deletions en/docs/quick-start-guides/develop-your-first-event-integration.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,7 @@ This redirects you to the **Create New Integration in VS Code** page.
| `username` | `string` |
| `password` | `string` |

<a href="{{base_path}}/assets/img/get-started/deploy-your-first-event-integration/add-configurables.gif"><img src="{{base_path}}/assets/img/get-started/deploy-your-first-event-integration/add-configurables.gif" alt="Add Configurations" width="80%"></a>
<a href="{{base_path}}/assets/img/get-started/deploy-your-first-event-integration/add-configurables.gif" class="glightbox"><img src="{{base_path}}/assets/img/get-started/deploy-your-first-event-integration/add-configurables.gif" alt="Add Configurations" width="80%"></a>

2. Go to the **Design View** by clicking the Home icon on the top left corner and click **Add Artifact**.
3. Select **RabbitMQ Event Handler**. Choosing the **Event Integration** from the Devant console disables the other options.
Expand All @@ -59,13 +59,13 @@ This redirects you to the **Create New Integration in VS Code** page.

7. Add `Orders` as the **Queue Name** and click **Create**. If there is no queue named `Orders` in RabbitMQ server, this will create a new queue with this name.

<a href="{{base_path}}/assets/img/get-started/deploy-your-first-event-integration/add-event-listener.gif"><img src="{{base_path}}/assets/img/get-started/deploy-your-first-event-integration/add-event-listener.gif" alt="Add Configurations" width="80%"></a>
<a href="{{base_path}}/assets/img/get-started/deploy-your-first-event-integration/add-event-listener.gif" class="glightbox"><img src="{{base_path}}/assets/img/get-started/deploy-your-first-event-integration/add-event-listener.gif" alt="Add Configurations" width="80%"></a>

8. In the **Design** view, click the `onMessage` function box. It will redirect you to the flow diagram view.
9. Click the plus icon after the **Start** node to open the node panel.
10. Add a **Log Info** node with the **Msg** as `message.toString()`.

<a href="{{base_path}}/assets/img/get-started/deploy-your-first-event-integration/implement-event-handler.gif"><img src="{{base_path}}/assets/img/get-started/deploy-your-first-event-integration/implement-event-handler.gif" alt="Add Configurations" width="80%"></a>
<a href="{{base_path}}/assets/img/get-started/deploy-your-first-event-integration/implement-event-handler.gif" class="glightbox"><img src="{{base_path}}/assets/img/get-started/deploy-your-first-event-integration/implement-event-handler.gif" alt="Add Configurations" width="80%"></a>

## Step 4: Push to Devant

Expand Down Expand Up @@ -102,4 +102,4 @@ This redirects you to the **Create New Integration in VS Code** page.

5. After successfully testing, you can promote your event integration to production by clicking the **Promote** button.

Now you have gained hands-on experience in creating, configuring, deploying, and testing an event integration.
Now you have gained hands-on experience in creating, configuring, deploying, and testing an event integration.