Forward to a friend to customize the form

[c-krajadovercom]

Hi All,

If anyone tried to customize the Forward to Friend form? we would like to change the field name and title instead of friend word. 

Please advice on this.

Thanks,

[Darshil_Shah1]

Yes, that's possible! You can customize the look and feel of the Forward to Friend form with some custom development. Check out Sandy's blog on Building a better Forward-to-Friend with Velocity for pulling this off. Hope this helps.

[c-krajadovercom]

I have tried this option. But this is not working. showing this tag while click on view as web page -> populating this tag. 

[SanfordWhiteman]

You’ll need to provide more information — can’t troubleshoot a screenshot. Need 2 links: a standard Forward 2 Friend and then one you’ve tried to enhance using my method.

[c-krajadovercom]

Hi,

Please review the below screenshot. it is coming like this.

[SanfordWhiteman]

Again... we can’t troubleshoot a screenshot. What you’re showing indicates a basic unclosed HTML tag, but there’s nothing we can suggest without seeing your code.

[Darshil_Shah1]

Would appreciate it if you're able to share the URL you used to navigate to this page so we can have a look at the page, see what's not working, and recommend a fix for it.

[c-krajadovercom]

Hi,

The below code I have used in custom token (Email Script Token) and that token used as a hyperlink in email template (which is shown in the previous screenshot that incomplete HTML tag)

#if ( !$mktmail.DefaultTrackingHost || $mktmail.DefaultTrackingHost.equals("localhost") )
<link href="https://fonts.googleapis.com/css?family=Quicksand" rel="stylesheet">
<style>
#forwardtoFriendDropDown {
box-shadow: #777 2px 2px 1px !important;
padding: 20px 20px 10px 20px !important;
top: 10px !important;
background-color: cornsilk !important;
border-radius: 4px !important;
font-family: 'Quicksand' !important;
font-size: 14px !important;
}
</style>
<script>
var ftfConfig = {
title : "Forward to!",
firstName : "<strong>First Name</strong>",
lastName : "<strong>Last Name</strong>",
email : "<strong>Email</strong>"
};
</script>
## --- NO NEED TO EDIT BELOW THIS LINE! ---
<script>
document.addEventListener('DOMContentLoaded',function(e){
jQuery(document).ready(function(e){
var ftfRoot = document.querySelector('#forwardtoFriendDropDown'),
ftfIds = {
firstName : 'ftf_friend_fname',
lastName : 'ftf_friend_lname',
email : 'ftf_friend_email'
},
ftfDefaultTitle = 'Forward to a Friend';

var arrayFrom = Function.prototype.call.bind(Array.prototype.slice);

arrayFrom(ftfRoot.querySelectorAll('*'))
.filter(function(el){
return arrayFrom(el.childNodes).every(function(el){
return el.nodeType == document.TEXT_NODE && el.textContent == ftfDefaultTitle;
});
})
.forEach(function(el){
el.innerHTML = ftfConfig.title;
});

Object.keys(ftfIds)
.forEach(function(field){
ftfRoot.querySelector('label[for="'+ftfIds[field]+'"]').innerHTML= ftfConfig[field];
});
});
});
</script>
#end

[c-krajadovercom]

Hi Friend,

If anyone tried and worked on this, please let me know. At least like to know if it is possibility or not.

Please advise me.

[SanfordWhiteman]

Sorry, you’re not providing sufficient information for someone outside your organization to help with this.