A REALLY nice Shopsite checkout experience

[knucklehead]

Looked at the https://www.-.com site you had linked on your
home page because I am trying to find other shopsite users that have successfully generated a shopping cart and check out atmosphere that looks legitimate. I have always been dissatisfied with the aesthetics of the check out experience.

Can someone provide the instructions and css file that will show me to replicate what https://www.-.com has done?

I can't even figure out how to make ANY changes between the header and footer.

[knucklehead]

I know what I asked above seems to be a tall order. Basically I just cannot figure out where to go or what to edit in order to manipulate the look of the content between the header and footer of the checkout pages.

I've looked at the cookbook and I see references to [-- SC_Cart --] but I do not see any instruction on how to format what [-- SC_Cart --] produces.

[Jim]

There are styles assigned to the various fields such as
<td class="cart_sku">
<td class="cart_name">
If you view the source of a shopping cart screen you can see all the styles that are available.

You edit the style sheet used in the shopping cart template and change the styles to display things as you want them. You would probably need to edit the styles under Merchandising > Custom Templates and then either Shopping cart or Includes

[mustangfanatic]

Yea I have also noticed that there is nothing that really defines each tag and what it does and how to customize it. The custom template cookbook helps but leaves a lot of questions unanswered. Same with the help index.

[knucklehead]

I am trying to change the the way the Shopping cart items are displayed on the screen that is asking for credit card info.

Can you help?

I want to change the font color and make the table that's there 800 pixels wide instead in 100% of the page

[loren_d_c]

For the font color, just look at the source of the screen to see what the classes are that are assigned to these table elements, then add your own CSS to define the color of text within these classes of elements somewhere in your custom cart template somewhere before the [-- SC_Cart --] tag and it should render as you define it in your custom CSS.

As far as the size specified in the table tag created by [-- SC_cart --], you cannot change that however this one is easy enough to control, just put your own table tags around the [-- SC_Cart --] tag in your custom template and specify the 800 pixel width there. The 100% wide table will then be nested inside your 800 pixel wide table and it will only take up 100% of your 800 pixels, not the entire width of the page.

-Loren

[knucklehead]

This makes no sense to me?...

"For the font color, just look at the source of the screen to see what the classes are that are assigned to these table elements, then add your own CSS to define the color of text within these classes of elements somewhere in your custom cart template somewhere before the [-- SC_Cart --] tag and it should render as you define it in your custom CSS. "

If I want the font to be say red, what would the solution look like?

[knucklehead]

OK... whew got the stuff above to happen...

Now...

How do I get the EXPIRATION DATE field to appear beneath the CVV field. Right now it's all the way at the bottom of the payment screen - its an unnatural flow/request for info.

Also. I would like the COMMENTS MORE INFO box to be AFTER the payment fields, how to I move it down to the bottom the check out page.

[Jim]

The order of the fields in the payment section isn't changable so you probably won't be able to move the expiration date up.

The tag for the comment box is [-- SC_Comments --] so find that tag and move it to where you want it as long as it remains inside the form for the page.