Change Pages in Accelerator (Dynamic Text)
So Ben has requested that we do this in all of our new 6.0 stores, and at one time or another we've all seen how dynamic text has helped save us time (replacing zingers, bugs, etc) and cut down on hard-coding in our jsp files. It also helps make our sites more internationally friendly (since our international team can just grab the localized text files and edit them for what they need 
). So here we go, here is how to add some dynamic text into a page that you can then edit through accelerator.
To define the new dynamic text message for the store and the Change Pages page:
- 1. Navigate to the following directory:
* WC_eardir/Stores.war/WEB-INF/classes/ConsumerDirect
* Cloudscape workspace_dir\Stores\WebContent\WEB-INF\classes\ConsumerDirect - 2. Open the storetext_dynamic_locale.properties file for editing.
- 3. Insert the following text at the end of the file:
# ShoppingArea/DiscountSection/DiscountDetailsDisplay.jsp
Discount_Disclaimer = Some restrictions may apply. Discount cannot be combined with other offers. - 4. Save and close the file.
- 5. Open the storetext_dynamic_labels_locale.properties file, located in the same directory, for editing.
- 6. Insert the following text at the end of the file:
# ShoppingArea/DiscountSection/DiscountDetailsDisplay.jsp
DiscountDisclaimer = Discount disclaimer
DiscountDisclaimer_Text = - 7. Save and close the file.
- 8. Restart your WebSphere Commerce instance to load the changed properties files.
To add the option for setting the discount disclaimer text to the Change Pages page:
- 1. Navigate to the following directory:
* WC_eardir/Stores.war/WEB-INF/xml/tools/stores/ConsumerDirect/devtools/storefront
* Cloudscape workspace_dir\Stores\Web Content\WEB-INF\xml\tools\stores\ConsumerDirect\devtools\storefront - 2. Open the StoreFront.xml file for editing.
- 3. Add the following lines to the store-front-text element:
- 4. Save and close the file.
Open your jsp file and where you want your dynamic text to appear, insert the following.
- 1. <fmt:message key="Discount_Disclaimer" bundle="${storeDynamicText}"/>
- 2. Save and close the file.
That should do it... please note that WordPress strips out all the formatting, so we lose all our nice tabbing, that explains why the code above looks so poor. The bulk of this post was taken directly from IBM's tutorial website, so if you get lost, go there.
Print This Post
Updating Struts
So we all remember that you only edit the struts-config-ext.xml file right (you don't edit the plain struts-config.xml because IBM constantly overwrites that file when you push updates etc.)? Wrong, to avoid spinning wheels and wondering why nothing is working (your view that is) make sure that you edit both struts-config-ext and struts-config-live. This also cuts down on brow-beating, dead-horse-beating, and all around sheepishness.
Print This Post
jQuery… IBM endorsed?!?
Now that I have your attention, it's not completely what you are thinking, they haven't endorsed it for E-Com, but they have a very nice article written up in the DeveloperWorks under "XML - Web Development". I have toyed with jQuery a bit and I think it may be a better solution for simple animation and style changing. It is by no means a replacement for prototype (which is so powerful - for js - that it gives me headaches), but it is a nice solution to simple problems, and it has some very nice features (you can select anything, seriously, anything on the page). There's just one thing to remember... Unobtrusiveness is the key so remember to put everything in the "document ready" section.
$(document).ready(function() { // put all your jQuery goodness in here. }); |
OR you can use the short cut, like so...
$(function() { // Put more jQuery goodness here. }); |
So if you wanted to do a click event, you would do something like this.
$(document).ready(function() { $('#buttonDiv').click(function() { $('#grow').animate({height: 500, width: 500 }, "slow", function(){ alert('The element is done growing!'); }); //alert function }); //click function }); //ready function |
I threw in some extra commenting so you could more easily see the ending tags of each function (also this blog engine tends to remove all whitespace in the code section so while it looks pretty while typing, it usually comes out stripped...) Also something to keep in mind is that all javascript should be unobtrusive, meaning you shouldn't need to use onClick events unless you absolutely have to. So as typed in the jQuery example above, the line " $('#buttonDiv').click(function() {//do something} " would be something close to " docuement.getElementById('buttonDiv').click(function() {//do something} " in standard javascript.
Anyway, that is a quick intro to jQuery, check "Simplifiy Ajax development with jQuery" on DeveloperWorks for more.
Print This Post