![]() | |
---|---|
Item Name | Installation Step 2 Checkout Form andThank You Page |
Price | RM59.95 |
Description | Tutorial add code snippets to install custom checkout with automated e-mail invoicing and notifications. Add custom Thank You auto re-deirect page for personal touch. |
Stock/Size Available | Location Blogger Dashboard > Add Pages section |
More Details | Go to Pages > Add Page > Blank Page > write the page title like so " Checkout " (without quotes). Click HTML > copy below code to the Blogger editor body:- <center> <h2> Currently in your Cart</h2> </center> <div class="simpleCart_items"> </div> <div id="cartTotal"> <div class="total_quantity"> You have <strong><span class="simpleCart_quantity"></span></strong> items in cart.</div> <div class="total_amount"> Total Amount Due: <strong><span class="simpleCart_total"></span></strong></div> </div> <div class="clear"> </div> <br /> <div id="orderScroller"> <div id="contact-form"> <form action="" id="contact" method="post"> <fieldset> <label for="firstname">First Name</label> <input id="first_name" name="firstname" placeholder="First Name" title="Enter your First Name" type="text" /> <br /> <label for="lastname">Last Name</label> <input id="last_name" name="lastname" placeholder="Last Name" title="Enter your Last Name" type="text" /> <br /> <label for="email">Your E-mail</label> <input id="email" name="email" placeholder="yourname@domain.com" title="Your e-mail address" type="text" /> <br /> <label for="phone">Phone @ H/P</label> <input id="phone" name="phone" placeholder="Preferred mobile number" type="text" /> <br /> <label for="address">Delivery Address</label> <textarea id="address" name="address" placeholder="Full address please for prompt delivery, include unit number, street, area, state and country."></textarea> <br /> <label for="postcode">Postal Code</label> <input id="postcode" name="postcde" placeholder="Address postal code" type="text" /> <br /> <label for="message">Your Message</label> <textarea id="comments" name="message" placeholder="Optional"></textarea> </fieldset> <br /> Further details will be sent to you automatically via e-mail. We hope you had a great experience here at our store. We look forward for your next visit. Thank You. </form> <br /> <span style="float: right; font-size: 85%; margin-left: 2%; width: 48%;"> Please read through on our <a alt="terms and policy" href="http://goirsah.blogspot.com/p/policy.html"><strong>Terms and Policy</strong></a> for purchase orders submission. All details submitted are kept confidential and will not be published. </span> <!-- /end #contact-form --> <a class="simpleCart_checkout" href="javascript:;"><span class="checkout_btn">Send Order</span></a> </div> <script type="text/javascript"> simpleCart({ checkout: { type: "SendForm", url: "http://blogshop-cart.net76.net/sendcart.php", method: "POST", currency: "MYR", extra_data: { first_name: document.getElementById('first_name').value, last_name: document.getElementById('last_name').value, email: document.getElementById('email').value, phone: document.getElementById('phone').value, address: document.getElementById('address').value, postcode: document.getElementById('postcode').value, message: document.getElementById('comments').value, } } }); </script> </div> To change your checkout currency find this code:- currency: "MYR", Currently it is set to Malaysian Ringgit. You can enter "USD" for US Dollar, "GBR" for Great Britain Pound Sterling etc. Find more pre-assigned currency code at http://simplecartjs.org. You can also include your custom currency code through this template tutorial here. After finished, click Publish Page. Double check that your page has a " Checkout " title before saving! After your customer filled their details and cliked the send form button, the automated e-mail will re-direct to your own custom " Thank You " page. Custom Thank You PageYou can create a personal thank you page by going to Pages > Add Page > Blank Page. At the title area write " Thank You " (withput quotes). On the body of the page you can customised a special thank you page for your customer when they have successfully submitted the checkout form. A sample of the thank you page you can find here at http://my-blogshop-tool.blogspot.com Feel free to copy the codes by right clicking and select View Page Source > copy the HTML codes form this line:- <!-- Thank you page body starts --> To this line of code snippet <!-- Thank you page body ends --> After you're done, click Publish Page and view the page that you have built. Please cjeck that the URL of the bar will look like so:- http://your_blog_name.blogspot.com/p/thank-you.html If you do not have the above URL, create a new page a use the same steps stated. You will have a quick start in building your own " thank you " page and starting your on-line business. |