After several attempts, I’ve resigned myself to asking my question here. I created a longtext column in HTML and two buttons allowing the user to contact the person by email or WhatsApp. Currently, I’m using the following formula for WhatsApp: “CONCATENATE(”<a href=“,CONCATENATE(“Share on WhatsApp”,ENCODEURL([Phone Number])),”>“) and for email: CONCATENATE(”<a href=“,CONCATENATE(“https://mail.google.com/mail/?view=cm&to=”,ENCODEURL([Email])
),”>").
But this isn’t optimal. Isn’t there a way to use “Mailto”, for example, for email?
Also, I’m trying to perform internal app actions like deep links by embedding them in my “a href” tags, but it’s impossible because it switches me to another view (on PC : opens a new tab, and on phone : opens a bug page). Is there anyone who could help me?
PS: I’m not sure if I’m asking my question in the right place.
Thank you very much. I’ve also attached a photo of my two buttons created in SVG.
1 Like
Could you clarify , how exactly you have attached those Concatenate expressions to the SVG code for buttons in the column. I mean , are you able to separate out the “click” event for each of the buttons within the single column?
1 Like
Yes, to assign a click to each button, simply wrap each SVG code with the “a href” tag. The only problem is that this currently only works for websites external to the app (like Maps, WhatsApp, etc.). Here’s an example of a clickable SVG code to link to Maps (be sure to format your Longtext column as HTML).
Example :
CONCATENATE(
“<a href =”,CONCATENATE(
“ Link google maps”, (link maps:https://www.google.com/maps/search/?api=1&query=)
ENCODEURL([Adresse])
),“>”,CONCATENATE(
“<img src=”“data:image/svg+xml;utf8,”,
ENCODEURL(SUBSTITUTE(CONCATENATE(
“<svg xmlns=”“ http://www.w3.org/2000/svg ”" width=““280"” height=”“90"”>
<linearGradient id=““bg”” x1=““0"” x2=”“0"” y1=““0"” y2=”“1"”>
<stop offset=““0"” stop-color=”“#d1d9e3"”/>
<stop offset=““1"” stop-color=”“#b7c3d1"”/>
<filter id=““shadow”” x=“”-50%“” y=“”-50%“” width=““200%”” height=““200%””>
<feDropShadow dx=““0"” dy=”“4"” stdDeviation=““8"” flood-color=”“#000"” flood-opacity="“0.15"”/>
.txt {
font-family: Inter, 'Segoe UI', Roboto, Arial, sans-serif;
font-size: 13px;
font-weight: bold;
fill: #1f2b38;
line-height: 1.3;
text-align:center;
}
",
[Adresse],"
“);”&“;”&“)),
“””/>"
),“”)
I don’t know if my explanation is very clear, feel free to ask if you have any questions.
1 Like
I believe for internal navigation of the app to different views, if you use the above approach ( a URL linked to an image) , the app view will open in another window.
As an alternative, although a bit less elegant, you could have two long text HTML columns , one below the other. These columns can have the SVG code with the buttons shape and the necessary details ( email and phone number) being displayed through SVG code. You could then attach two inline actions , one each to those long text HTML columns to have the necessary navigation within the app or outside the app.
2 Likes
Yes, that’s what I’m currently doing, but I’d like to combine “buttons” on the same rows rather than duplicating them. Isn’t there a way to create a formula that would be the formula for a native AppSheet action?
I do not believe so.
However someone else may suggest you an option/workaround. AppSheet community has come up with impressive workarounds/solutions in many such cases.
4 Likes