1. Overview
  2. Button Setup
  3. Button Action And Variables

Button Action And Variables

What Is An Action

Depending on the button type you select, the action works a little differently

In A "GET Hook" Action

The action is the URL you want to ping. Make sure that it's a valid URL. You can use a Query String to pass data to your hook. For example, if you wanted to pass the current tab title to your hook, it might look like:

https://www.hookurl.com?tab={tab_title}

Make sure that if you are passing the tab url as a query string, you use the tab_url_encoded variable and decode it on the other end.

In A "POST" Action

The action of a POST button is a little bit more complicated because it has two parts - 

  1. The URL you want to POST to.
  2. The body of the POST request (what you send to that URL)

The URL works just like the GET or New Tab actions. The body is typically a JSON object. The two together might look like

https://www.someapi.com/user
{
  "name": "{tab_title}"
}
Make sure you add quotes around the property names ("name") and any text values ("{tab_title}") to make it valid JSON.

In An "Open New Tab" Action

The action is the URL you want to open a new tab to. For example, if you wanted to add a button that opens a new tab and searches for the tab title in Google (this is useful in CRMs where the title of the tab is the name of the person or company), you might have an action like:

https://google.com/search?q={tab_title}

In A "Send Email" Action

For this button type, the action involves sending an email. You’ll need to specify:

  1. Recipient (email address).
  2. Subject (a dynamic or static subject line).
  3. Body (the content of the email).

For example, if you want the email subject to include the tab title, the action might look like

example@example.com
Follow up on {tab_title}
Hello!
Regarding {tab_title}, here is the information you requested...

In A "Copy To Clipboard" Action

The action for this button is straightforward—it copies specific text or data to the clipboard. For instance, if you are on LinkedIn and want to copy the person or company name from page and tab title to the clipboard, your action might look like:

name: {Person or Company Name}, link: {tab_title}

In A "Paste From Clipboard" Action

For this button type, the clipboard data is stored with delimiter , in a format like 

data1,data2,data3

The action specifies how to paste this data into designated fields. You can map the clipboard data to specific input fields by using variables such as 

{value_of_input1},{value_of_input2},{value_of_input3}

For more details on how to configure the value variables, see Value Of variable.

 

Using Variables

There are several types of variables you can use. All variables are evaluated when the button is clicked which means that it will always have the value based on the page you're on when you click the button even if it had a different value on the page when you made the button.

In some browsers, adding any type of variable sometimes adds a space before the variable. Usually, that's OK, but please double check that you don't have unnecessary spaces in your action before saving.

Basic Variables

You can add a basic variable by typing a curly bracket { into the action field.

  • {tab_title} - This will get replaced with the name of the tab. For example, a button on this page would replace {tab_title} with "Button Action And Variables"
  • {tab_url} - This will get replaced with the URL of the current page including all Query String variables and hashes.
  • {tab_url_encoded} - This will get replaced with the encodeURIComponent version of the current tab URL. This is helpful if you're using it as part of a different url like in a Query String.
  • {tab_path} - This will get replaced with the path of the current url. If the URL is https://app.com/something/another?a=b, the path is /something/another. It does not include the Query String.
  • {tab_querystring} - This will get replaced with the query string of the current url. If the url is https://app.com/something/another?q=123&a=456, the query string is ?q=123&a=456.
  • {user_name} - This will get replaced with the current logged in user's name from profile settings.
  • {user_first_name} - This will get replaced with the current logged in user's first name.
  • {user_email} - This will get replaced with the current logged in user's email.

"Value Of" Variables

You can add a "value of" variable by typing a hash/pound # into the action field. This will bring up all form elements on the current page with their current values. Pick the one that you need from the dropdown menu. Keep in mind that when the button is clicked, it will try to find this element on the page it's clicked on and get the value of the element at that moment. If the element doesn't exist, it will replace the variable with "NOT_FOUND".

"Text Of" Variables

You can add a "text of" variable by typing a percent sign % into the action field. This will bring up all text elements (p and span for the technical folks) on the current page with their current contents (innerText). Pick the one that you need from the dropdown menu. Keep in mind that when the button is clicked, it will try to find this element on the page it's clicked on and get the text of the element at that moment. If the element doesn't exist, it will replace the variable with "NOT_FOUND".

Table Variables

For buttons placed in table rows, you can use table variables by typing c: into the action field. This will bring up all the available columns in the current table. Note that a button placed in a table row operates on each individual row.

To get data from each column within a row, use c:1 for the name data, c:2 for the email data, and c:3 and c:4 for phone and city data, respectively.

Name Email Phone City
Natalie Smith        Copy Info natalie_s@mail.com +1 555-333-4455 New York
Carl Williams        Copy Info carl_w@mail.com +1 555-333-4456 Boston
Madison Clark      Copy Info medison_c@mail.com +1 555-333-4457 Los Angeles

The action for copying info might look like:

name: {column$1},
email: {column$2},
phone: {column$3},
city: {column$4}

By clicking the button in the 2nd row, this data will be copied to the clipboard:

name: Carl Williams,
email: carl_w@mail.com,
phone: +1 555-333-4456,
city: Boston

Question Variables

You can add additional questions to configure your button action. Use question variables by typing q: into the action field. This will bring up all the available questions for current button. For more details about configuring button with questions see Button Action Questions.

App Specific Variables

For certain applications, you may need a specific variable that cannot be selected on the page or is nested deeper within the system. Please let us know if you need assistance with this.


Was this article helpful?
© 2024 AppButtons