hi guys any ideas why line 104 won’t run. all the other social links work just fine
I am able to open my email popup from any other site / email(mailto) button
thanks
Adam
Okay, so your issue is that you have simply copied @code-queen example again and not paid attention to her video tutorial from around 6mins onwards where she clearly states that you have to use them as stated in the code.
https://support.totallycodable.com/en/article/create-custom-share-buttons-for-social-media-platforms
https://www.youtube.com/watch?v=cb31PIBP5LQ - youtube video of tutorial above
Make sure that you read code supplied as it clearly states that she has updated the code too.
To share via Email Wix says the only pieces of information supported at the moment are the TO email and the Subject. So I have updated the code below to show the URL in the Subject line.
So your mailShare link should be like this
$w(“#mailShare”).link =mailto:?subject=${link};
Finally, if you watch the video from around 11mins, you will notice that she refers to her previous tutorial about this which you can find here.
https://codequeen.wixsite.com/email-download
https://www.youtube.com/watch?v=BPMZzcfayUg - youtube video of tutorial above
Update 21:24hrs, having added the correct code that you shared with me (thanks) to the page and published to test, it still will not work for me.
$w(" #mailShare ").link =mailto:?subject=${link}; is this link supposed to work as a standalone? forgetting about capturing user emails or triggering automated emails.
I am now confused because there are three videos in Code Queen’s series relating to
- Triggered emails using wix shoutouts,
- How to collect emails
and 3. the social share button that includes the mailto:
As the mailShare link above does not initiate any action when my site is published am i missing something else. Do i need to create a triggered email for the code detailed in Create Custom Share Buttons Video. There are some gaps and assumptions between consistency of videos explaining how to from code queen.
I have added the new mailto code line as follows
and the button should be fine as all the other buttons work
Thanks
Adam
what should happen when i click on the export function mailShare click? Should an email popup be generated on the users screen?
This is how is believe it might work because i think the triggered email from capturing a users email address is a different function altogether. I am right or not?
Thanks
Adam
I have tried this example to see if there is an issue with my mail, but there isn’t on any other site when i click on a mailto link i am able to send that site an email.
As you can see on this previous forum post, the only way that this will work is with the mailto and subject.
https://www.wix.com/corvid/forum/community-discussion/create-mailto-link-to-pull-in-body-into-email
Another thing to note is that are you working on a static page or a dynamic page for this as there are two code versions to use.
https://support.totallycodable.com/en/article/create-custom-share-buttons-for-social-media-platforms
The Code to share a page with an image file
This code can be for a dynamic page
/*
To share on Facebook Messenger you need a Facebook App ID (app_id=). You have to create one using this link via Facebook https://developers.facebook.com/quickstarts/.
The Facebook Messenger share API requires a redirect URL and it looks like this in the code below: uri=https%3A%2F%2Fwww.totallycodable.com
To share via Email Wix says the only pieces of information supported at the moment are the TO email and the Subject. So I have updated the code below to show the URL in the Subject line.
*/
import wixLocation from 'wix-location';
import wixCRM from 'wix-crm';
let picture;
let url;
let filename;
let link;
$w.onReady(function () {
link = wixLocation.url;
let item = $w('#dynamicDataset').getCurrentItem();
picture = item.image;
url = picture.split("/")[3];
filename = item.title;
$w("#pinterestShare").link = `https://www.pinterest.com/pin/create/button/?url=${link}&media=https%3A%2F%2Fstatic.wixstatic.com/media/${url}?&description=${filename}&display=popup`;
$w("#twitterShare").link = `https://twitter.com/share?url=${link}&display=popup`;
$w("#facebookShare").link = `https://www.facebook.com/sharer/sharer.php?u=${link}&display=popup`;
$w("#tumblrShare").link = `http://www.tumblr.com/share/link?url=${link}&display=popup`;
$w("#mailShare").link =`mailto:?subject=${link}`;
$w("#whatsappShare").link = `https://api.whatsapp.com/send?phone=&text=${link}&display=popup`;
$w("#googleShare").link = `https://plus.google.com/share?url=${link}&display=popup`;
$w("#linkedShare").link = `https://www.linkedin.com/shareArticle?mini=true&url=${link}&display=popup`;
$w("#redditShare").link = `http://www.reddit.com/submit?url=${link}&display=popup`;
$w("#bookmarkGoogle").link = `https://www.google.com/bookmarks/mark?op=edit&bkmk=${link}&title=${filename}&annotation=${filename}&labels=${filename}&display=popup`;
$w("#bloggerShare").link = `https://www.blogger.com/blog-this.g?u=${link}&n=${filename}&t=${filename}&display=popup`;
$w("#messengerShare").link = `https://www.facebook.com/dialog/send?link=${link}&app_id=985159018329177&redirect_uri=https%3A%2F%2Fwww.totallycodable.com&display=popup`;
$w("#kikShare").link = `http://share-api.kik.com/share.do?url=${link}&title=${filename}`;
});
export function pinterestShare_click(event) {
$w("#pinterestShare").target = "_blank";
}
export function twitterShare_click(event) {
$w("#twitterShare").target = "_blank";
}
export function facebookShare_click(event) {
$w("#facebookShare").target = "_blank";
}
export function tumblrShare_click(event) {
$w("#tumblrShare").target = "_blank";
}
export function mailShare_click(event) {
$w("#mailShare").target = "_blank";
}
export function whatsappShare_click(event) {
$w("#whatsappShare").target = "_blank";
}
export function googleShare_click(event) {
$w("#googleShare").target = "_blank";
}
export function linkedShare_click(event) {
$w("#linkedShare").target = "_blank";
}
export function redditShare_click(event) {
$w("#redditShare").target = "_blank";
}
export function bookmarkGoogle_click(event) {
$w("#bookmarkGoogle").target = "_blank";
}
export function bloggerShare_click(event) {
$w("#bloggerShare").target = "_blank";
}
export function messengerShare_click(event) {
$w("#messengerShare").target = "_blank";
}
export function kikShare_click(event) {
$w("#kikShare").target = "_blank";
}
export function downloadButton_click(event, $w) {
wixLocation.to(`https://static.wixstatic.com/media/${url}?dn=${filename}`);
}
The Code to share a page with no image file
This code can be for a regular page
/*
To share on Facebook Messenger you need a Facebook App ID (app_id=). You have to create one using this link via Facebook https://developers.facebook.com/quickstarts/.
The Facebook Messenger share API requires a redirect URL and it looks like this in the code below: uri=https%3A%2F%2Fwww.totallycodable.com
To share via Email Wix says the only pieces of information supported at the moment are the TO email and the Subject. So I have updated the code below to show the URL in the Subject line.
*/
import wixLocation from 'wix-location';
import wixCRM from 'wix-crm';
let link;
$w.onReady(function () {
link = wixLocation.url;
$w("#twitterShare").link = `https://twitter.com/share?url=${link}&display=popup`;
$w("#facebookShare").link = `https://www.facebook.com/sharer/sharer.php?u=${link}&display=popup`;
$w("#tumblrShare").link = `http://www.tumblr.com/share/link?url=${link}&display=popup`;
$w("#mailShare").link =`mailto:?subject=${link}`;
$w("#whatsappShare").link = `https://api.whatsapp.com/send?phone=&text=${link}&display=popup`;
$w("#googleShare").link = `https://plus.google.com/share?url=${link}&display=popup`;
$w("#linkedShare").link = `https://www.linkedin.com/shareArticle?mini=true&url=${link}&display=popup`;
$w("#redditShare").link = `http://www.reddit.com/submit?url=${link}&display=popup`;
$w("#bookmarkGoogle").link = `https://www.google.com/bookmarks/mark?op=edit&bkmk=${link}&display=popup`;
$w("#bloggerShare").link = `https://www.blogger.com/blog-this.g?u=${link}&display=popup`;
$w("#messengerShare").link = `https://www.facebook.com/dialog/send?link=${link}&app_id=985159018329177&redirect_uri=https%3A%2F%2Fwww.totallycodable.com&display=popup`;
$w("#kikShare").link = `http://share-api.kik.com/share.do?url=${link}`;
});
export function twitterShare_click(event) {
$w("#twitterShare").target = "_blank";
}
export function facebookShare_click(event) {
$w("#facebookShare").target = "_blank";
}
export function tumblrShare_click(event) {
$w("#tumblrShare").target = "_blank";
}
export function mailShare_click(event) {
$w("#mailShare").target = "_blank";
}
export function whatsappShare_click(event) {
$w("#whatsappShare").target = "_blank";
}
export function googleShare_click(event) {
$w("#googleShare").target = "_blank";
}
export function linkedShare_click(event) {
$w("#linkedShare").target = "_blank";
}
export function redditShare_click(event) {
$w("#redditShare").target = "_blank";
}
export function bookmarkGoogle_click(event) {
$w("#bookmarkGoogle").target = "_blank";
}
export function bloggerShare_click(event) {
$w("#bloggerShare").target = "_blank";
}
export function messengerShare_click(event) {
$w("#messengerShare").target = "_blank";
}
export function kikShare_click(event) {
$w("#kikShare").target = "_blank";
}
Finally, just to clarify, if you use the code above for the mailShare it should open up a new email with whatever email client you are using with the subject line being the link from the dynamic page if using images or from the static page if using no images.
Obviously it will have left the to field blank so that you can add your own email address to whoever.
To test it yourself, simply add ‘mailto:?subject=enter-your-subject-here’ into your web browser address bar and the email appears.
excellent. Thanks so i have tried that and the popup does open albeit with a browser message “this website has been blocked from automatically composing an email” Allow or Ignore. If i allow it works. So is the issue with settings in my browser for this website i.e. my wix site, I do not get the warning message when trying to open the link from my published site, it just doesn’t open
I am working on a dynamic page
is this an issue with the wixLocation.url that it points to a photo and not the actual dynamic page url?
ok some progress. I have changed the code slightly based on your link above. The email client does now appear but only on page refresh. The email client will still not open upon initial click of the mailto link on my page. So it doesn’t perform as expected because it is not associated with the email client link at the correct time i.e. when the link is clicked (which of course is only a possibility by users)
and the link does not show the dynamic page url
$w(“#mailShare”).link = wixLocation.to(“mailto:adcatch@<someplace.com>?subject=${link}”);
I have just tried it on a new blank site with a dynamic page and it all works fine for me, it opens up new email straight away with the page url as the subject line.
import wixLocation from 'wix-location';
import wixCRM from 'wix-crm';
let picture;
let url;
let filename;
let link;
$w.onReady(function () {
link = wixLocation.url;
let item = $w('#dynamicDataset').getCurrentItem();
picture = item.image;
url = picture.split("/")[3];
filename = item.title;
$w("#mailShare").link =`mailto:?subject=${link}`;
});
export function mailShare_click(event) {
$w("#mailShare").target = "_blank";
}
our code is like for like. I have disabled content blockers and enabled popup windows on my published site, still nothing
@adcatch02
How have you setup your dynamic pages for for the repeater page and the link page that you want people to be able to share from?
Did you just set those up as dynamic pages or did you use index and category pages?
https://support.wix.com/en/article/dynamic-page-example
https://support.wix.com/en/article/creating-an-index-page-for-your-dynamic-pages
https://support.wix.com/en/article/adding-and-setting-up-a-dynamic-category-page