Displays a button that redirects to a link. You can also specify your link's colour (using HTML Color Names like red, blue, green or hex color codes).
Tip: You can enhance your simple ButtonType by pairing it with iconType keyword.
You can also specify the color of the button in two ways:
- After the link column index, simply add the color (can be a hex code or a classic color like green, white or pink)
- If you want to have different buttons colors depending on the row, you can also reference the index of a column containing colors (hex code or classic colors)
warning ButtonType keyword cannot contain index reference of the column that has ImageType keyword.
You can use this keyword in the:
Comments
25 comments
Article does not clearly state how the 'EDIT FILE' text gets inserted into the sheet.
Hello Brandon Carraway,
Actually, it means the buttonType display the "EDIT FILE" text and it is linked to the link in the D column. As you can see we used buttonType(D,#ffc107), so it means we reference the D column as the link column.
Kind regards.
Thomas
Thomas,
Thank you for the clarification, this definitely saved me a lot of headache because I was also having a problem with this... However, how do the words "Edit File" get entered into the spreadsheet?
I see the code in the 'Template' tab, but it isn't translating over into my Awesome Table. 🤦♂️
Hello Brandon,
I created a ticket, it will be easier to discuss with you.
Kind regards.
Thomas
I also have the same question as Brandon. How does the button text get entered in the spreadsheet upon the trigger from the form?
Hello Elizabeth,
Maybe this article could help you?
https://support.awesome-table.com/hc/en-us/community/posts/360002591519-Create-an-Update-Button-when-using-a-Google-Form
Please let me know if it helped.
Nicolas
Elizabeth, it's all in the 'Template' tab (if you don't have one, then make sure to create one).
In this tab, you make a column header equal to the header in your data. (Photo below).
The code in the example is a little bit out of alignment with the tutorials, however, in your case, it the code should look like this:
<div class"button-container"> <a class="button" href="{{Job #}}" target="_blank">EDIT FILE</a> </div>
I hope this helps you, as most of the guides are not very clear. Please let me know if you are still having issues.
-Brandon
Hello, I don't know why I'm getting these errors messages...
Any idea? Thanks in advance.
Spreadsheet:
https://docs.google.com/spreadsheets/d/1ngPfFD8_YpA1TuR5lXx93FxLqUVhWRVi1BofFkyjcT0/edit?usp=sharing
Visualisation:
https://sites.google.com/view/jourde/activit%C3%A9s
Hi @François.
If you rename one of the duplicate headers appropriately, this should be fixed (see screenshot below).
Just remember that you also need to use the same header / label if you used that same column (marker) on your HTML & CSS templates (e.g., replace LIEN [column H] with LIEN2 on your CSS template).
Hope this helps.
- Randy
Dear Randy: it worked like a charm.
Thanks a lot.
Glad to be of service, François :)
Rather than a drop down as a sort criteria is there a way to have button instead with a pre-selected choice? For example "House" is either a yes or no. I want folks to be able to select House and it automatically selects those with a house (the yes's). Same for Full Time. This would make things a lot easier for our end users.
Hi @Creston Communications.
Please create a Feature Request with the specifications you mentioned.
- Randy
Hello,
Is it possible to make a ButtonType open 2 links at the same time?
Thx
Hi @Erp.
This is not possible with our buttonType keyword.
- Randy
Hola buenos días!
He estado intentando hacer uso del buttonType pero no me funciona, no se si estoy ingresando algo equivocadamente. Me podrían ayudar por favor.
Hi @Jefry.
1) Please try putting a header on cell C1 (for example: Click here).
Then refresh or reload your view by pressing F5 on your keyboard.
2) Also, check that column C is included in your data-range. More about it here.
If these don't help, please share your:
AwesomeTable link - Share with us your AwesomeTable & Google Sheets datasource so we can pinpoint where the problem is and provide the right solution at the soonest possible time. Detailed instructions here.
Google Sheets datasource - It's best to set the sharing settings to Anyone with the link. Click here to learn more.
* You can opt to anonymize your content by using dummy data (fake, but realistic) if your Sheets contain confidential info.
- Randy
I have the link in the column G and status in Column H but I also want to display the "Delivered" status in the row without the button link in the awsome table, Can you help me on this?
Hi Muhammed Aadhil,
Could you please raise a ticket so our support team will investigate further on your issue: https://support.awesome-table.com/hc/en-us/requests/new
Please be sure to share your view and spreadsheet with support@awesome-table.com
Best
How can i use buttonType for row ?
I want to create button in row? how can i create?
Hello gsrathore97
Keywords can only be specified in top of the column, always on the second row for a data in the column.
Please describe your use case that would require to use buttonType in a row, so I can have a better idea on what you are trying to achieve and can provide some possible solutions.
Thanks
Hello, Is there any way to center the buttons in the table? I've tried a couple of different options with no success.
The button in column G is linking to the link in column D instead of column F
Hi Mary Klempke,
Thanks for your comment
Indeed, the reason why the button in column G is linked with column D is because you've associated both in the button keyword: buttonType(D....) instead of buttonType(F....).
If you change from D to F it will works
Thanks
I have created a unique use case for Awesome Table.
I would like the current Google Site webpage (tab) to close when I click one of the four Awesome Table navigation buttons.
I am using a simple Awesome Table with four buttons to produce dynamic navigation bar for a Google Sites webpage. I found a piece of code that hijacks the Google Form onsubmit action.
I use this hijacked onsubmit action to load my Awesome Table navigation buttons. The users response to the Google Form then, dynamically changes the URLs associated with the buttons in my Awesome Table navigation bar. My Awesome Table navigation bar looks like this.
My question is...
Can anyone suggest a way that I can close the current tab after my Awesome Table navigation button opens the new tab? Or, overwrite, that is, load the new page over the existing page using the new URL from the Awesome Table navigation bar.
I tried embedding some HTML and CSS code with the Buttontype URL reference, but that simple destroys the button. I also tried HTML, CSS and Javascript in the embed code area of where I am embedding the Awesome Table navigation buttons link. None of what I tried worked.
Thank you kindly for any suggestions.
Keep loving on Awesome Tables!
❤️
Please sign in to leave a comment.