Hi I have successfully created a mailto link that opens the email Client with the correct email and subject but for reasons I cannot figure out it refuses to pull in the body content.. Can anyone help? Does wix somehow block the body content?
import wixLocation from 'wix-location';
$w.onReady(function () {
$w('#text3').onClick(function () {
wixLocation.to("mailto:?subject=stay at home!&body=hello")
})
})
Hi,
Currently, the only option is adding the Email address and the subject as you can see in the documentation here. Other parameters within the "mailto" are not supported. In order to add those parameters, you can use an iFrame.
Best,
Tal.
Hi, I need to gather variable values and embed them in the email. Tried mailto: in iFrame and got error like "cannot connect to mail.google.com". Configuration: win7, Chrome, default client gmail. Suggestions?
<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head>
<script type="text/javascript">
var sCrLf = "\r\n";
var sTo = "hbrown@jamestownr.com"
var sBcc = "chaimjeffrey@gmail.com";
function inits() {
var oTheForm = document.getElementById("theForm");
var oTheFormBox = oTheForm.getBoundingClientRect();
var iAvailable = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);
var iUsing = oTheFormBox.bottom - oTheFormBox.top;
var iPad = (iAvailable - iUsing) / 2;
if (iPad > 0) oTheForm.style.paddingTop = iPad.toString() + "px";
}
function doit() {
var oSubject = document.getElementById("subject");
var oPrefix = document.getElementById("prefix");
var oName = document.getElementById("name");
var oAddr1 = document.getElementById("addr1");
var oAddr2 = document.getElementById("addr2");
var oCity = document.getElementById("city");
var oState = document.getElementById("state");
var oZip = document.getElementById("zip");
var oBody = document.getElementById("body");
oSubject.className = "";
oName.className = "";
oAddr1.className = "";
oCity.className = "";
oZip.className = "";
oBody.className = "";
var iErrCnt = 0;
var sErrMsg = "";
if (oSubject.value == "") {
iErrCnt++;
sErrMsg += sCrLf + "Email Subject";
oSubject.className = "missing";
}
if (oPrefix.value == "") {
iErrCnt++;
sErrMsg += sCrLf + "Your Prefix/Name";
oPrefix.className = "missing";
}
if (oName.value == "") {
iErrCnt++;
sErrMsg += sCrLf + "Your Name";
oName.className = "missing";
}
if (oAddr1.value == "") {
iErrCnt++;
sErrMsg += sCrLf + "Address Line 1";
oAddr1.className = "missing";
}
if (oCity.value == "") {
iErrCnt++;
sErrMsg += sCrLf + "City";
oCity.className = "missing";
}
if (oZip.value == "") {
iErrCnt++;
sErrMsg += sCrLf + "Zip Code";
oZip.className = "missing";
}
if (oBody.value == "") {
iErrCnt++;
sErrMsg += sCrLf + "Email Body";
oBody.className = "missing";
}
if (iErrCnt > 0) {
var z = "The following field";
if (iErrCnt != 1) z += "s";
alert(z + " can not be blank:" + sCrLf + sErrMsg);
} else {
var sUrl = "mailto:" + encodeURIComponent(sTo)
+ "?bcc=" + encodeURIComponent(sBcc)
+ "&subject=" + encodeURIComponent(oSubject.value)
+ "&body=" + encodeURIComponent(oPrefix.value + " " + oName.value + sCrLf)
+ encodeURIComponent(oAddr1.value + sCrLf);
if (oAddr2.value != "") sUrl += encodeURIComponent(oAddr2.value + sCrLf);
sUrl += encodeURIComponent(oCity.value + ", " + oState.value + " " + oZip.value + sCrLf)
+ encodeURIComponent(sCrLf)
+ encodeURIComponent(oBody.value);
window.location.href = sUrl; // could fail if URL > 2048 bytes
}
}
function closeMe() {
window.opener = self;
window.close();
}
</script>
<style type="text/css">
body
{
background-color: #3d9be9;
}
#theForm,
body
{
padding: 0px;
border: 0px;
margin: 0px;
}
#theForm
{
margin-left: auto;
margin-right: auto;
}
#theForm tbody td:nth-child(1)
{
text-align: right;
padding-right: 1em;
}
.missing
{
background-color: Red;
}
.noShow
{
display: none;
}
</style>
</head>
<body onload="inits();" onresize="inits();" onorientationchange="inits();">
<table id="theForm" border="0">
<tbody>
<tr class="noShow">
<td>Email Subject</td>
<td><input type="text" id="subject" size="45" value="SUPPORT THE PEOPLE" /></td>
</tr>
<tr>
<td><b>From:</b> Your Prefix/Name</td>
<td><input type="text" id="prefix" size="6" /><input type="text" id="name" size="45" /></td>
</tr>
<tr>
<td>Address Line 1</td>
<td><input type="text" id="addr1" size="45" /></td>
</tr>
<tr>
<td>Address Line 2</td>
<td><input type="text" id="addr2" size="45" /></td>
</tr>
<tr>
<td>City, State Zip</td>
<td>
<input type="text" id="city" size="25" />
<select id="state">
<option title="Alabama" value="AL">AL</option>
<option title="Alaska" value="AK">AK</option>
<option title="Arizona" value="AZ">AZ</option>
<option title="Arkansas" value="AR">AR</option>
<option title="California" value="CA">CA</option>
<option title="Colorado" value="CO">CO</option>
<option title="Connecticut" value="CT">CT</option>
<option title="Delaware" value="DE">DE</option>
<option title="Florida" value="FL">FL</option>
<option title="Georgia" value="GA">GA</option>
<option title="Hawaii" value="HI">HI</option>
<option title="Idaho" value="ID">ID</option>
<option title="Illinois" value="IL">IL</option>
<option title="Indiana" value="IN">IN</option>
<option title="Iowa" value="IA">IA</option>
<option title="Kansas" value="KS">KS</option>
<option title="Kentucky" value="KY">KY</option>
<option title="Louisiana" value="LA">LA</option>
<option title="Maine" value="ME">ME</option>
<option title="Maryland" value="MD">MD</option>
<option title="Massachusetts" value="MA">MA</option>
<option title="Michigan" value="MI">MI</option>
<option title="Minnesota" value="MN">MN</option>
<option title="Mississippi" value="MS">MS</option>
<option title="Missouri" value="MO">MO</option>
<option title="Montana" value="MT">MT</option>
<option title="Nebraska" value="NE">NE</option>
<option title="Nevada" value="NV">NV</option>
<option title="New Hampshire" value="NH">NH</option>
<option title="New Jersey" value="NJ">NJ</option>
<option title="New Mexico" value="NM">NM</option>
<option title="New York" value="NY">NY</option>
<option title="North Carolina" value="NC">NC</option>
<option title="North Dakota" value="ND">ND</option>
<option title="Ohio" value="OH">OH</option>
<option title="Oklahoma" value="OK">OK</option>
<option title="Oregon" value="OR">OR</option>
<option title="Pennsylvania" value="PA">PA</option>
<option title="Rhode Island" value="RI" selected="selected">RI</option>
<option title="South Carolina" value="SC">SC</option>
<option title="South Dakota" value="SD">SD</option>
<option title="Tennessee" value="TN">TN</option>
<option title="Texas" value="TX">TX</option>
<option title="Utah" value="UT">UT</option>
<option title="Vermont" value="VT">VT</option>
<option title="Virginia" value="VA">VA</option>
<option title="Washington" value="WA">WA</option>
<option title="West Virginia" value="WV">WV</option>
<option title="Wisconsin" value="WI">WI</option>
<option title="Wyoming" value="WY">WY</option>
</select>
<input type="text" id="zip" size="10" />
</td>
</tr>
<tr class="noShow">
<td>Email Body</td>
<td><textarea id="body" rows="15" cols="70">
Dear Sir,
Please make a public statement in support of this vital executive action before the end of 2019.
Thank you.
</textarea></td>
</tr>
<tr>
<td><input type="button" value="Submit" onclick="doit();" /></td>
</tr>
</tbody>
</table>
</body>
</html>
UPDATE: I successfully created a share to email link using an iframe. But now, it's come to my attention - it works on desktop, but not on mobile. The strange thing is, when I go to mobile view in the editor's preview, the share to email link works! But when I go to the live mobile site, it doesn't, it merely registers as an image with the option to "copy." Any thoughts?
HTML Iframe code:
<a href="mailto:?Subject=This%20is%20a%20Story&Body=I%20found%20the%20site%20www.wix.com"> <img src="https://static.wixstatic.com/media/e7f4d5_593ab50f0ca54ba68c36ebed5c4327d5~mv2.png/v1/fill/w_64,h_64,al_c/e7f4d5_593ab50f0ca54ba68c36ebed5c4327d5~mv2.png" alt="Email" /> </a>
(Also, ultimately, I want to share a dynamic page link to email, if anyone has an update or helpful suggestions on that subject - that would be wonderful!)
following...
Hi Ashley you can host your image at https://imgbb.com/ and change your src link accordingly.
Yes, I came to the same conclusion last night, but wasn't certain. Thank you Tal for confirming! I also successfully managed to create an email share button using an html iframe borrowing from www.simplesharebuttons.com... However... I want to change the image to either one of the images in my media folder or from the free wix photo folder... How do I find the correct image url to change the image?
"<a href="mailto:?Subject=Simple Share Buttons&Body=I%20saw%20this%20and%20thought%20of%20you!%20 https://simplesharebuttons.com"> <img src="https://simplesharebuttons.com/images/somacro/email.png" alt="Email" /> </a>
OK thanks for all your help Tal!
Hey,
After checking Stackoverflow, it seems like it's impossible.
Best,
Tal.
OK I came to the same conclusion and embedded the mailto in an Iframe. Do you know if there is a way to do it with Javascript so that an html coded email can be sent in the body, through the default email client.
Will do I hope one of us figures it out soon.
Following! Copied your code and put on my site (I'm in the processing of adding and coding a bunch of different share links myself) and I have the same problem. Have tried every combo I can think of, but it either inserts the body message into the subject line or the body message just doesn't appear at all...
I will keep trying and let you know what I discover! Keep me posted if you find a solution!