Visualforce Page :
---------------------
<apex:page standardStylesheets="false" sidebar="false" showHeader="false" contentType="html-5.0">
<script type='text/javascript'>
(
function(){
function handlePageLoad() {
var endpointMatcher = new RegExp("[\\?\\&]endpoint=([^&#]*)");
document.getElementById('prechatForm').setAttribute('action',
decodeURIComponent(endpointMatcher.exec(document.location.search)[1]));
}if(window.addEventListener){
window.addEventListener('load',handlePageLoad, false);
}else{
window.attachEvent('onload',handlePageLoad, false);
}
}
)();
</script>
<style type="text/css">
body { background: darkturquoise!important; }
</style>
<html lang="en">
<head>
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap.min.css" rel="stylesheet" media="screen"/>
<link href="//getbootstrap.com/examples/signin/signin.css" rel="stylesheet" media="screen"/>
</head>
<body>
<div class="container">
<form method='post' id='prechatForm' class="form-horizontal" role="form">
<img src="{!$Resource.AccentureWhiteLogo}" class="img-responsive"/><!--alt="Company Logo" width="180"; height="100"; style="margin-left: 200px;margin-top: -20px;"-->
<div class="form-group">
<div class="col-sm-10">
<input type='text' name='liveagent.prechat:ContactFirstName' id='firstName' placeholder="First Name" required="required" class="form-control"/>
</div>
</div>
<div class="form-group">
<div class="col-sm-10">
<input type='text' name='liveagent.prechat:ContactLastName' id='lastName' placeholder="Last Name" required="required" class="form-control"/>
</div>
</div>
<div class="form-group">
<div class="col-sm-10">
<input type='text' name='liveagent.prechat:ContactEmail' id='email' placeholder="Email ID" required="required" class="form-control"/>
</div>
</div>
<div class="form-group">
<div class="col-sm-10">
<input type='text' name='liveagent.prechat:ContactPhone' id='phone' placeholder="Phone" required="required" class="form-control"/>
</div>
</div>
<div class="form-group">
<div class="col-sm-10">
<textarea name='liveagent.prechat:ContactDescription' id='subject' placeholder="Case Description" required="required" class="form-control"></textarea>
</div>
</div>
<input type="hidden" name="liveagent.prechat:ContactTitle" value="Customer" />
<input type="hidden" name="liveagent.prechat:ContactLevel" value="Prospect" />
<input type="hidden" name="liveagent.prechat:ContactLeadSource" value="Click To Chat"/>
<input type="hidden" name="liveagent.prechat.name" id="prechat_field_name"/>
<input type="hidden" name="liveagent.prechat.findorcreate.map:Contact" value="FirstName,ContactFirstName;Title,ContactTitle;LeadSource,ContactLeadSource;Level,ContactLevel;LastName,ContactLastName;Email,ContactEmail;Phone,ContactPhone;MobilePhone,ContactPhone;HomePhone,ContactPhone;Desciption,ContactDescription" />
<input type="hidden" name="liveagent.prechat.findorcreate.map.doFind:Contact" value="Email,true" />
<input type="hidden" name="liveagent.prechat.findorcreate.map.isExactMatch:Contact" value="Email,true" />
<input type="hidden" name="liveagent.prechat.findorcreate.map.doCreate:Contact" value="FirstName,true;LastName,true;Email,true;Phone,true;MobilePhone,true;HomePhone,true" />
<input type="hidden" name="liveagent.prechat.findorcreate.showOnCreate:Contact" value="true" />
<input type="hidden" name="liveagent.prechat.findorcreate.saveToTranscript:Contact" value="ContactId" />
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<input type='submit' value='Chat Now' id='prechat_submit' onclick="setName()" class="btn btn-default"/><!-- style="padding-right: 50px; margin: 5px;margin-left: 32px;"-->
</div>
</div>
<script type="text/javascript">
function setName() {
document.getElementById("prechat_field_name").value = document.getElementById("firstName").value;
}
</script>
</form>
</div>
</body>
</html>
</apex:page>
Screenshot:
--------------
---------------------
<apex:page standardStylesheets="false" sidebar="false" showHeader="false" contentType="html-5.0">
<script type='text/javascript'>
(
function(){
function handlePageLoad() {
var endpointMatcher = new RegExp("[\\?\\&]endpoint=([^&#]*)");
document.getElementById('prechatForm').setAttribute('action',
decodeURIComponent(endpointMatcher.exec(document.location.search)[1]));
}if(window.addEventListener){
window.addEventListener('load',handlePageLoad, false);
}else{
window.attachEvent('onload',handlePageLoad, false);
}
}
)();
</script>
<style type="text/css">
body { background: darkturquoise!important; }
</style>
<html lang="en">
<head>
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap.min.css" rel="stylesheet" media="screen"/>
<link href="//getbootstrap.com/examples/signin/signin.css" rel="stylesheet" media="screen"/>
</head>
<body>
<div class="container">
<form method='post' id='prechatForm' class="form-horizontal" role="form">
<img src="{!$Resource.AccentureWhiteLogo}" class="img-responsive"/><!--alt="Company Logo" width="180"; height="100"; style="margin-left: 200px;margin-top: -20px;"-->
<div class="form-group">
<div class="col-sm-10">
<input type='text' name='liveagent.prechat:ContactFirstName' id='firstName' placeholder="First Name" required="required" class="form-control"/>
</div>
</div>
<div class="form-group">
<div class="col-sm-10">
<input type='text' name='liveagent.prechat:ContactLastName' id='lastName' placeholder="Last Name" required="required" class="form-control"/>
</div>
</div>
<div class="form-group">
<div class="col-sm-10">
<input type='text' name='liveagent.prechat:ContactEmail' id='email' placeholder="Email ID" required="required" class="form-control"/>
</div>
</div>
<div class="form-group">
<div class="col-sm-10">
<input type='text' name='liveagent.prechat:ContactPhone' id='phone' placeholder="Phone" required="required" class="form-control"/>
</div>
</div>
<div class="form-group">
<div class="col-sm-10">
<textarea name='liveagent.prechat:ContactDescription' id='subject' placeholder="Case Description" required="required" class="form-control"></textarea>
</div>
</div>
<input type="hidden" name="liveagent.prechat:ContactTitle" value="Customer" />
<input type="hidden" name="liveagent.prechat:ContactLevel" value="Prospect" />
<input type="hidden" name="liveagent.prechat:ContactLeadSource" value="Click To Chat"/>
<input type="hidden" name="liveagent.prechat.name" id="prechat_field_name"/>
<input type="hidden" name="liveagent.prechat.findorcreate.map:Contact" value="FirstName,ContactFirstName;Title,ContactTitle;LeadSource,ContactLeadSource;Level,ContactLevel;LastName,ContactLastName;Email,ContactEmail;Phone,ContactPhone;MobilePhone,ContactPhone;HomePhone,ContactPhone;Desciption,ContactDescription" />
<input type="hidden" name="liveagent.prechat.findorcreate.map.doFind:Contact" value="Email,true" />
<input type="hidden" name="liveagent.prechat.findorcreate.map.isExactMatch:Contact" value="Email,true" />
<input type="hidden" name="liveagent.prechat.findorcreate.map.doCreate:Contact" value="FirstName,true;LastName,true;Email,true;Phone,true;MobilePhone,true;HomePhone,true" />
<input type="hidden" name="liveagent.prechat.findorcreate.showOnCreate:Contact" value="true" />
<input type="hidden" name="liveagent.prechat.findorcreate.saveToTranscript:Contact" value="ContactId" />
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<input type='submit' value='Chat Now' id='prechat_submit' onclick="setName()" class="btn btn-default"/><!-- style="padding-right: 50px; margin: 5px;margin-left: 32px;"-->
</div>
</div>
<script type="text/javascript">
function setName() {
document.getElementById("prechat_field_name").value = document.getElementById("firstName").value;
}
</script>
</form>
</div>
</body>
</html>
</apex:page>
Screenshot:
--------------
No comments:
Post a Comment