ProductCart E-Commerce Solutions Homepage
Forum Home Forum Home > ProductCart > Customizing ProductCart
  New Posts New Posts RSS Feed - One Page Checkout Nickname and Order Comments
  FAQ FAQ  Forum Search   Events   Register Register  Login Login

One Page Checkout Nickname and Order Comments

 Post Reply Post Reply
Author
Message
dwg View Drop Down
Newbie
Newbie


Joined: 20-August-2012
Status: Offline
Points: 0
Post Options Post Options   Thanks (0) Thanks(0)   Quote dwg Quote  Post ReplyReply Direct Link To This Post Topic: One Page Checkout Nickname and Order Comments
    Posted: 07-September-2012 at 9:29am
In the One Page Checkout Under the Payment & Other Information Panel, I am trying to default Nickname and Order Comments to uncollapsed since customers are seemingly not seeing these fields.
 
can someone tell me how to make this happen?
Back to Top
Casey_ULA View Drop Down
Newbie
Newbie
Avatar

Joined: 10-July-2009
Location: Logan, UT
Status: Offline
Points: 0
Post Options Post Options   Thanks (0) Thanks(0)   Quote Casey_ULA Quote  Post ReplyReply Direct Link To This Post Posted: 01-October-2012 at 12:04pm
I want to follow up that I have the same request for Order Comments.

Casey
Casey
Fun Facilitator
www.ula-equipment [d]com
Back to Top
Casey_ULA View Drop Down
Newbie
Newbie
Avatar

Joined: 10-July-2009
Location: Logan, UT
Status: Offline
Points: 0
Post Options Post Options   Thanks (0) Thanks(0)   Quote Casey_ULA Quote  Post ReplyReply Direct Link To This Post Posted: 01-October-2012 at 12:39pm
Hello.  

My solution...  in pc/onepagecheckout.asp   line 1621 (in my set up) of v4.6 sp0

<table class="pcShowContent" id="comments" style="display:block; border: 1px #eee solid; margin-bottom: 10px;">

I changed display:none to  display:block.

Seems to be working.
Casey
Fun Facilitator
www.ula-equipment [d]com
Back to Top
Guests View Drop Down
Guest
Guest
Post Options Post Options   Thanks (0) Thanks(0)   Quote Guests Quote  Post ReplyReply Direct Link To This Post Posted: 02-October-2012 at 5:09am
Hi Casey,

IMHO, after many years of hard-core ProductCart development experience, I recommend avoiding changing PC source files -- ESP! when they are files that are highly likely to be updated with the next PC service pack -- whenever and however possible.

I would NOT edit this in the OPC markup. Rather, as it is simple to do and would not be affected by updates, I would recommend overriding the display with CSS. 

For example, using stock PC files, I would add the following to the bottom of the header/footer CSS file (stock file is pcHeaderFooter11.css for PC 4.5 & 4.6):
#PaymentContentArea #comments {
display: block !important;
}
Back to Top
Guests View Drop Down
Guest
Guest
Post Options Post Options   Thanks (0) Thanks(0)   Quote Guests Quote  Post ReplyReply Direct Link To This Post Posted: 02-October-2012 at 5:28am
@dwg,

I hear you! Thanks for raising this. On an earlier version (4.0?) these options were displayed by default. I suspect EI fell into the "damned if you do/damned if you don't" pit here, and the "hide it" greasy wheels squeaked louder than the folks that probably didn't even notice.

I personally prefer to see the comments field visible, and leave the nickname field collapsed. This is all very simple to control for with CSS, though. See my prior post to Casey.

This is one of those little things I've been meaning to mod on our templates. Thanks for putting a little heat under it for me. Meanwhile, the "Do It Yourself" is super simple (as per my post to Casey).
Back to Top
Guests View Drop Down
Guest
Guest
Post Options Post Options   Thanks (0) Thanks(0)   Quote Guests Quote  Post ReplyReply Direct Link To This Post Posted: 02-October-2012 at 6:57pm
I just noticed that EI recommends the same approach as Casey above (see http://wiki.earlyimpact.com/how_to/open_comment_field_opc ), but I still think it more advisable to use CSS to override rather than to change markup that will get overwritten by updates.
Back to Top
Hamish View Drop Down
Admin Group
Admin Group


Joined: 12-October-2006
Location: United Kingdom
Status: Offline
Points: 56
Post Options Post Options   Thanks (0) Thanks(0)   Quote Hamish Quote  Post ReplyReply Direct Link To This Post Posted: 02-October-2012 at 7:46pm
Sean, Thanks for adding your recommended solution to the WIKI. I've updated it again to remove the old technique and make yours the documented one as it's definately a better approach.
Back to Top
Guests View Drop Down
Guest
Guest
Post Options Post Options   Thanks (0) Thanks(0)   Quote Guests Quote  Post ReplyReply Direct Link To This Post Posted: 02-October-2012 at 8:10pm
Glad I could be helpful. 

I'm doing a lot of overriding stuff in PC's markup with CSS !important these days. In this particular case, I don't have any issue with display:none; in the markup as that is necessary if one assumes the default should be to have this field collapsed. 

However, there's just a lot of markup with either HTML properties or inline CSS that is lamentable. IMHO every instance of hard coded HTML (e.g. width, height, bgcolor, etc.) and inline CSS (style="") should be replaced with id's & classes and styled in the style sheets. I'm slowly but surely weeding it all out in our own set of template files for PC.
Back to Top
Casey_ULA View Drop Down
Newbie
Newbie
Avatar

Joined: 10-July-2009
Location: Logan, UT
Status: Offline
Points: 0
Post Options Post Options   Thanks (0) Thanks(0)   Quote Casey_ULA Quote  Post ReplyReply Direct Link To This Post Posted: 04-October-2012 at 10:21pm
Sean,

Thanks for the reminder to that CSS may be a better route.  I didn't get success with file "pc/pcHeaderFooter11.css",  I did get sucess with..." pc/pcStorefront.css"

 #PaymentContentArea #comments {
display: block !important;
}

I just looked at the wiki and saw EI recommends "pc/onepagecheckout.css"


Edited by Casey_ULA - 04-October-2012 at 10:23pm
Casey
Fun Facilitator
www.ula-equipment [d]com
Back to Top
Guests View Drop Down
Guest
Guest
Post Options Post Options   Thanks (0) Thanks(0)   Quote Guests Quote  Post ReplyReply Direct Link To This Post Posted: 04-October-2012 at 11:38pm
Hi Casey,

Yeah, I edited the wiki to add this as an alternative approach, and then Hamish decided it should be their official take on it, removing the prior approach of editing inline markukp entirely.

I added pc/onepagecheckout.css as that would be the rather "natural" file to edit, but it is also prone to updates ... and frankly I'm getting tired of managing so many style sheets in PC. These days I'm painting my style sheets red with !important to override other style sheets and markup. I stick to a variation on pcHeaderFooter.css for more global design issues and modify pcStorefront.css for more store-level stuff, adding overrides and new stuff to the bottom of it.

Just a bit of a primer for the annals for anyone stumbling upon this: 

It doesn't really matter much which style sheet one edits for their design, ultimately. The only important thing to understand is that the first "C" in CSS stands for "Cascading", which means that by default, styles are inherited from the rules applied to parent objects unless modified with a more location specific identifier (ex: body {} vs body #pcHeaderContainer) OR a set of rules is defined lower down either on the same style sheet, or an external style sheet is called subsequently, or style rules are applied within the <head> tag of the page, or are applied inline in the markup (ex: <div style="">) -- in that order. That's the cascading nature of CSS. 

So, if you run into something that's hard coded in the markup (I'd really love to make ALL of that go away in PC like a bad dream) or something defined in subsequently loaded style sheets (such as pc/onepagecheckout.css), then you can pull out the magic trump card !important in your rule to override the values that might be down-line in the cascading nature of CSS -- including HTML markup properties (ex: <img width="100">). To learn more, see: http://webdesign.about.com/od/css/f/blcssfaqimportn.htm (I couldn't find anything on this in W3C School, hmm).

Most especially when the display you would like to override is inline in the markup (either an HTML property or an inline style rule), it is best practice with PC to use a primary style sheet to override the display as the markup has a probability of being overwritten by an update (and if you're like me, you'd prefer to minimize how much of that to keep track of even with code compare tools such as WinMerge). Some pages have a very high probability of being overwritten, esp. when they are involved with the core shopping cart functionalities of displaying products and providing a user interface for adding them to cart and ordering them.

Similarly, all of the other subordinate style sheets in PC (such as pc/onepagecheckout.asp and others involved in the OPC) might get updated ... and frankly, why hassle with editing /maintaining so many style sheets?! Again, just override the rules in subordinate style sheets from your primary style sheets.

By primary style sheets I mean pc/pcStoreFront.css (which I prefer to leave named that) and your more global site design style sheet (out of the box, this would be something like pcHeaderFooter*.css which you may have just left named whatever your release came with or you might prefer to just create your own MySiteTheme.css style sheet). Whatever you do in this global design style sheet will not be affected at all by any updates. The core pcStorefront.css style sheet will change with update, however. That one I prefer to leave named the same and to manage manually as it really is the core style sheet for ProductCart. 

My advice for managing pc/pcStorefront.css is to keep it as close to stock as possible to make it easier to run code compares on to see what the new update might have added. To do this, don't change the order of the rules or rule properties. Leave them as is and add your customizations below the rule properties in a give rule, add new rules at the bottom of this style sheet with comments about the regions you're adding rules to. For example:
pcStyleRule {
  pcStyleProperty: values;
  myStyleProperty: values;
}
myStyleRule {
  myStyleProperty: values;
}

Finally, a word to the wise: Be careful with this !important commend! Use it only to override display rules and properties in ProductCarts markup and subordinate style sheets. Do NOT get carried way with it such that you end up overriding your own site theme & design display rules lest you give yourself or your design team unnecessary headaches (for which I prescribe Google Chrome's Inspect Element feature in their Development Tools, but even that takes a careful eye to read what rules have been trumped by !important commands).

These practices will make your update experiences much more efficient, esp. on highly customized designs.  

Forgive me if I've been overly pedantic, but there are many who could benefit from my little lecture here IMHO. Looks to me like a draft of a blog post I should probably write ;-)


Edited by Sean@WMS - 05-October-2012 at 12:33am
Back to Top
 Post Reply Post Reply
  Share Topic   

Forum Jump Forum Permissions View Drop Down

Forum Software by Web Wiz Forums® version 12.04
Copyright ©2001-2021 Web Wiz Ltd.

This page was generated in 0.094 seconds.