Select a site

CSS classes: Checkout widget

Following is the list of CSS classes applied to Checkout widget:
CSS class name  Class set to Default HTML tag
sfcheckoutTitle Title of checkout process <h1>
sfcheckoutTabstrip Wrapper of tabstrip which represents the checkout process steps <div>
sfCStep0 Wrapper of checkout process tabstrip when being on first step — Shipping information <div>
sfCStep1 Wrapper of checkout process tabstrip when being on second step — Shipping options <div>
sfCStep2 Wrapper of checkout process tabstrip when being on third step — Payment <div>
sfCStep3 Wrapper of checkout process tabstrip when being on fourth step — Preview <div>
sfCStep4 Wrapper of checkout process tabstrip when being on fifth step — Confirmation <div>
sfStep1 Wrapper of first step of checkout process — Shipping information <a>
sfStep2 Wrapper of second step of checkout process — Shipping options <a>
sfStep3 Wrapper of third step of checkout process — Payment <a>
sfStep4 Wrapper of fourth step of checkout process — Preview <a>
sfStep5 Wrapper of fifth step of checkout process — Confirmation <a>
sfcheckoutMulitPage Wrapper of checkout form of a particular step <div>
sfStep1Wrp Wrapper of checkout form on first step <div>
sfStep2Wrp Wrapper of checkout form on second step <div>
sfStep3Wrp Wrapper of checkout form on third step <div>
sfStep4Wrp Wrapper of checkout form on fourth step <div>
sfStep5Wrp Wrapper of checkout form on fifth step <div>
sfcheckoutFormWrp Wrapper of shipping or billing form <fieldset>
sfcheckoutShippingFormWrp Wrapper of shipping form <fieldset>
sfcheckoutBillingFormWrp Wrapper of billing form <fieldset>
sfcheckoutPaymentFormWrp Wrapper of payment form <fieldset>
sfcheckoutStepTitle Title of checkout step <h2>
sfcheckoutFormList List of checkout form fields <ul>
sfcheckoutFormItm Wrapper of checkout form single field <li>
sfcheckoutFormItmTxt Wrapper of checkout form text field <li>
sfcheckoutFormItmDdl Wrapper of checkout form dropdown list field <li>
sfcheckoutFormItmCodeTxt Wrapper of checkout form shorter text field <li>
sfcheckoutFormItmCheckboxList Wrapper of checkout form checkbox list <li>
sfcheckoutFormItmSep Wrapper of checkout form separator <li>
sfcheckoutFormItmCheckbox Wrapper of shipping or billing form checkbox field <div>
sfPaymentMethodList List of payment options <ol>
sfcheckoutBtnsWrp Wrapper of Continue button <div>
sfcheckoutContinueBtn Continue button <input>
sforderSummary Wrapper of order summary <div>
sfcheckoutStepSubTitle Order summary title <h3>
sforderSummaryTable Order summary table <table>
sforderSummaryRow Order summary row <tr>
sforderSummaryFirst First order summary row <tr>
sforderSummaryMiddle Middle order summary row <tr>
sforderSummaryLast Last order summary row <tr>
sforderSubTotalRow Subtotal price row — before any discounts have been applied <tr>
sforderDiscountRow Discount row <tr>
sforderSummarySep Order summary with visual separator <tr>
sforderSummaryTotal Total price row <tr>
sfDiscount Discount <span>
sfPrice Total price <span>
sfshippingOptionsWrp Shipping options wrapper <div>
sfcheckoutStepTitle Shipping options title <h2>
sfcheckoutFormItmCheckboxList Shipping options list <ol>
sfcheckoutPreviewWrp Wrapper of shipping and billing addresses and shipping and billing methods <div>
sfcheckoutPreviewAddress Wrapper of single address or method <address>, <div>
sfcheckoutPreviewProduct Wrapper of preview of products to be purchased <div>
sfcheckoutTotalPriceWrp Wrapper of total price, discounts, taxes, and fees <ul>
sfcheckoutSubtotal Wrapper of total price before any discounts, taxes and fees have been applied and number of products to be purchased <li>
sfAmount Wrapper of money field <span>
sfcheckoutDiscounts Wrapper of discounts <li>
sfDiscountsWrp Wrapper of discounts <div>
sfAmountCol Money column <td>
sfcheckoutShipping Wrapper of shipping price <li>
sfcheckoutBeforeTax Wrapper of subtotal before taxes have been calculated <li>
sfcheckoutTax Wrapper of taxes <li>
sfcheckoutTotal Wrapper of total price <li>

Back To Top

Next: CSS classes: Comments widget