Advanced Cart Styling

This page describes advanced techniques to modify the look and feel of the checkout pages.

These examples use javascript to modify the page.   We're compiling this page as requests come in, so it will continue to grow.

Question: I want to remove the Company Textbox and mask the Address 1 line to a certain number of characters. How?

To remove the company field, you'll need to hide 3 rows.  They are 1) a spacer row, 2) the label, and 3) the field.

To adjust the max length of a field, you simply need to set the attribute to whatever you desire.

<script type='text/javascript' src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type='text/javascript'>
jQuery(document).ready(function(){
	jQuery('input[name=company]').closest('tr').hide().prev().hide().prev().hide();
	jQuery('input[name=address1]').attr('maxlength', 20);
});
</script>

Question: I want to added an example phone format to the shipping page.  How? 

<script type='text/javascript' src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type='text/javascript'>
jQuery(document).ready(function(){
    jQuery('#ucShippingDayPhoneSectionId').append(" (example: xxx-xxx-xxxx)");
});
</script>