Send SMS with GatewayAPI
- Last updated on March 30, 2023 at 8:48 AM
Send text messages directly from the Dixa sidebar with GatewayAPI.
NOTE: You need to have an GatewayAPI account. It is not possible for the recipient to reply to the SMS.
- Go to Settings > Integrations.
- Click Configure Custom Cards.
- Click Create Custom card.
- Enter a Title.
You will need to replace the following placeholders in the below code snippet:
[sender name] = This is will be shown to the recipient. The maximum length of sender name is 11 characters and only a-z, A-Z, and 0-9 are valid characters.
[api key] = Insert the API key from GatewayAPI.
Optional:
DENNE BESKED KAN IKKE BESVARES = This will be added to all sent messages. It says "This message can't be answered".
Enter this in Template Content:
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <form | |
| target="custom-card-gatewayapi-iframe" | |
| action="https://gatewayapi.com/rest/mtsms" | |
| method="get" | |
| onsubmit="document.getElementById(`custom-card-send-button`).disabled = true;document.getElementById(`custom-card-sms-textarea`).value += `\nDENNE BESKED KAN IKKE BESVARES`;setTimeout(function(){ document.getElementById(`custom-card-send-button`).disabled = false;document.getElementById(`custom-card-sms-input`).value = `+45`;document.getElementById(`custom-card-sms-textarea`).value = '';}, 2000)"> | |
| <div> | |
| <label for="recipients.0.msisdn"><b>Phone number</b> (ie. +4525116832):</label> | |
| <input name="recipients.0.msisdn" id="custom-card-sms-input" value="+45"> | |
| </div> | |
| <input type="hidden" name="sender" value="[sender name]"> | |
| <input type="hidden" name="token" value="[api key]"> | |
| <br /> | |
| <div> | |
| <label for="message"><b>Text:</b></label> | |
| <br /> | |
| <textarea name="message" id="custom-card-sms-textarea" placeholder="message"></textarea> | |
| </div> | |
| <br /> | |
| <div> | |
| <button id="custom-card-send-button" type="submit" > | |
| <span id="custom-card-send-text">Send SMS</span> | |
| </button> | |
| </div> | |
| </form> | |
| <iframe name="custom-card-gatewayapi-iframe" style="display:none"></iframe> | |
| <style> | |
| #custom-card-sms-textarea { | |
| width: 100%; | |
| min-height: 100px; | |
| border-radius: 6px; | |
| border: 1px solid #737373; | |
| } | |
| #custom-card-sms-input { | |
| width: 100%; | |
| border-radius: 6px; | |
| border: 1px solid #737373; | |
| } | |
| #custom-card-send-button { | |
| position: relative; | |
| background-color: #5644d8; | |
| border: none; | |
| font-size: 14px; | |
| color: #FFFFFF; | |
| padding: 10px; | |
| width: 100%; | |
| text-align: center; | |
| -webkit-transition-duration: 0.4s; /* Safari */ | |
| transition-duration: 0.4s; | |
| text-decoration: none; | |
| overflow: hidden; | |
| cursor: pointer; | |
| outline: 0; | |
| border-radius: 6px; | |
| } | |
| #custom-card-send-button:focus { | |
| outline: 0; | |
| } | |
| #custom-card-send-button:after { | |
| content: ""; | |
| background: #3f329d; | |
| display: block; | |
| position: absolute; | |
| padding-top: 300%; | |
| padding-left: 350%; | |
| margin-left: -20px!important; | |
| margin-top: -120%; | |
| opacity: 0; | |
| transition: all 0.8s | |
| } | |
| #custom-card-send-button:active:after { | |
| padding: 0; | |
| margin: 0; | |
| opacity: 1; | |
| transition: 0s | |
| } | |
| #custom-card-send-button.disabled { | |
| cursor: not-allowed; | |
| opacity: .5; | |
| } | |
| #custom-card-send-text { | |
| background: transparent; | |
| } | |
| </style> |