# Tweet a Link

{% hint style="info" %}
🍎 Before you begin this tutorial, make sure you've completed the [Developer Quick Start Guide](/quick-start/mod-developer.md).
{% endhint %}

This tutorial will show you how to create a Quick Bar action to grab a link and draft a tweet with just a click.

1. It works by adding a Quick Bar action that you can trigger from any page on the web.
2. When triggering the action, it will grab the current page’s URL and open a new tab with a tweet compose box drafted with the URL.
3. You can then customize your message and send the tweet.

### 1. Add a Quick Bar <a href="#block-3fbe718d65a84532821b1c75c9aff287" id="block-3fbe718d65a84532821b1c75c9aff287"></a>

You can navigate to any URL, but you can start on a YouTube page, like [our YouTube channel](https://www.youtube.com/@pixiebrix)!&#x20;

The tutorial's first step is adding a QuickBar to this page, so let’s [open the PixieBrix Page Editor](/platform-overview/page-editor/open-the-page-editor.md). *You can do this by pressing F12 or inspecting the page and then navigating to the PixieBrix tab.*

Once the Page Editor is open, click **New Mod** and select a **Quick Bar** trigger from the top left menu.

<figure><img src="/files/9GYVURiGjLuP98o3yJm8" alt=""><figcaption></figcaption></figure>

Once the Quick Bar has been added, we can configure the action!

**Name:** `Tweet This Link`

**Action Title:** `Tweet This Link`

Under **Advanced**, I selected the Icon to be the `Twitter` icon

Once you’re done, it should look like this!

<figure><img src="https://images.spr.so/cdn-cgi/imagedelivery/j42No7y-dcokJuNgXeA0ig/7ed72c77-65c5-481e-9743-ea7b037779a9/Untitled/w=3840,quality=80" alt=""><figcaption></figcaption></figure>

### 2. Add the **Tweet in a new tab brick** <a href="#block-c83ef31b037d465ea23d29b6d7f6c0dc" id="block-c83ef31b037d465ea23d29b6d7f6c0dc"></a>

To add another brick, select the **+** button below the Quick Bar brick.

<figure><img src="https://images.spr.so/cdn-cgi/imagedelivery/j42No7y-dcokJuNgXeA0ig/e6a12462-b2f0-436e-880d-5effbdf92a28/Untitled/w=3840,quality=80" alt="" width="375"><figcaption></figcaption></figure>

Now we’re going to add a brick that, as the name implies, will open a new tab and draft a tweet with whatever content we desire.

Let’s go ahead and add it by adding the brick by searching for `Tweet in a new tab`

<figure><img src="https://images.spr.so/cdn-cgi/imagedelivery/j42No7y-dcokJuNgXeA0ig/8b84639b-8bab-4704-a2b3-4a5365a434ad/Untitled/w=3840,quality=80" alt=""><figcaption></figcaption></figure>

Now we need to configure the brick with any details we want to pass it.

We’ll add the URL we will post (from the page we triggered the mod).

Optionally we can also define a “via” field - which would let us append an account to the append of the tweet saying “via @account”. We’ll select the “ABC” and choose to exclude this.

<figure><img src="https://images.spr.so/cdn-cgi/imagedelivery/j42No7y-dcokJuNgXeA0ig/c78c5d18-5fc4-4fff-8eaa-13bd51110060/Untitled/w=3840,quality=80" alt=""><figcaption></figcaption></figure>

* **url:** You can reference the URL of the page you triggered the action with using `@input.url`.
* **via:** Click on the drop-down (by default ABC) and click Exclude it
* **text:** This will be the text of our tweet. If you often include some text in your tweet, you’re welcome to add something here; just keep in mind anything you add will show up every time you use this mod.
* **hashtags:** You can leave it empty or add any hashtags you’d generally use (and notice that you should do so without the preceding # character)

<figure><img src="https://images.spr.so/cdn-cgi/imagedelivery/j42No7y-dcokJuNgXeA0ig/695834f9-7174-4faf-9363-8761541514c1/Untitled/w=3840,quality=80" alt=""><figcaption></figcaption></figure>

Let’s test it out and see how it looks.

<figure><img src="https://assets.super.so/ba851d67-1c75-48a9-b05e-2423d4987620/images/f535e450-a006-4a99-9f2c-7579185e04a2/tweet-this-link-demo.gif?w=1500" alt=""><figcaption></figcaption></figure>

Now all you have to do is add any text you want to share to your tweet and press send.&#x20;

{% hint style="info" %}
*You can do that manually by pressing the send button or use a couple of extra PixieBrix bricks to get it done (this would be using the bricks “Wait for DOM event” and “Simulate DOM event”)*
{% endhint %}

## 3. Editing Quick Bar shortcut <a href="#block-9832bbffd7664ae1bdfcadef4f42f813" id="block-9832bbffd7664ae1bdfcadef4f42f813"></a>

Ready to test this out? By default, you'll open your Quick Bar by pressing `CMD/CTRL + M` . If you would like to change that, you can[ change your Quick Bar shortcut](/how-to/changing-the-quick-bar-shortcut.md) to another combination of keystrokes.

{% hint style="info" %}
🙋Need some help with building? [Head over to the Slack Community](https://slack.pixiebrix.com/), and we’ll gladly help you!
{% endhint %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.pixiebrix.com/tutorials/developer-tutorials/beginner/tweet-a-link.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
