.comment-link {margin-left:.6em;}

Creative Web Development - CSS, XHTML, Javascript and RTML for Yahoo Store

Sunday, January 22, 2006

Adding custom properties in RTML; Adding a JavaScript onsubmit handler to a FORM

Someone on the forums today needed to add a Google Urchin (Analytics) onsubmit handler to their FORM command in RTML. I'm not sure if my answer solved their problem, but it leads to today's post, "Adding custom properties in RTML".

RTML used to be limited, in that whatever the Edit screen showed was what you had. For example, the TABLE operator has width, but not height. FORM only takes an action. And so on...until the latest RTML update. When I was out visiting Yahoo a while back, I was working with their RTML developer and he had this neat "Add" command on his Edit screen, where he could add custom properties with ease to any operator. My jaw dropped...I saw a piece of heaven! I told him how much this would help development and reduce hacks (see below) to the system, and he looked into it...a few weeks later, it was public. I'm just ecstatic about that.

The hack mentioned above went like this: if you had a command, say TABLE-CELL, and you wanted to add a class parameter to the TD tag, you had to trick the string to combine two parameters in one. What used to look like this:

TABLE-CELL align "center"
<td align="center">

now had to look like this

TABLE-CELL align "center\" class=\"someclass"
<td align="center" class="someclass">

The underlined quotes were created with the \" in the string, while the outer two were created by the TABLE-CELL operator.

Well, that's a thing of the past, since you can now add any parameter you want to any RTML command. Here is the example I typed up tonight using the FORM operator and the onsubmit handler.

  1. In your RTML, if you go to the ordering template...usually STORENAME-order, however this may be modified.
  2. Find the FORM command in RTML, usually it says FORM ORDER id.
  3. Click the FORM command in the RTML.
  4. Click Edit at the top of the screen.
  5. In the bottom box, type onsubmit and click Add (do not press Enter!)
  6. On the next page, where it says onsubmit, put this "javascript:__utmLinkPost(this)" (include quotes)
  7. Update the screen and give it a test


Original
<form method=post action="...wg-order?yhst-XXXXXXXXXXXXXX+itemid">

Modified
<form method=post action="...?yhst-XXXXXXXXXXXXXX+itemid" onSubmit="javascript:__utmLinkPost(this)">

Also, Pirates still exist. Garrr!

5 Comments:

  • I have employed this solution on my Yahoo store, but it does not work. The HTML which is created is absolutely what you would want to see (as you described). However, you will notice when running the site, the cookies are not passed across the domains (from www.mystore.com to order.store.yahoo.net). What is suppose to happen, is that the referring information from the orginal site (www.mystore.com) should be passed to the referred site order.store.yahoo.net) by appending the cookies into the called url. In the Yahoo stores, we do not see the appending of the cookies onto the called url stream. I have highlighted this issue to Yahoo, but they responded that they do not support "other programming languages"??? I am stymied. If the HTML code looks to be accurate, why is it not executing properly? I have verified with colleagues that when they take the generated HTML code, and post it elsewhere (not within the Store manager), it DOES execute properly?

    Do you have any suggestions/advice? Anyone?

    By Anonymous Bill Howard, at 2:48 PM  

  • I should also mention that we have implemented this method flawlessy on numerous other shopping carts (Miva, OSCommerce, etc.), and the Yahoo Stores are the only ones that we cannot get to work.

    By Anonymous Bill Howard - Experienced analytics expert, at 3:41 PM  

  • I have gotten this working on my site with the new asynchronous tracking code, but the authentication on the cart doesn't seem to be working.

    At first I got something like...

    Item option key[{item id}] and value[] are not allowed for {item}

    And then I set the store to allow all product options. After doing so, I could add the item to my cart but all of the Google Analytics parameters went in with it as product options (_utma, etc.).

    Any ideas?

    By Blogger Danny, at 7:09 PM  

  • Nevermind. I found a writeup on this issue here:

    http://www.mystore-solutions.com/google-analytics.html

    I needed to use the _setAllowLinker()
    function.

    By Blogger Danny, at 9:45 PM  

  • I mean _setAllowAnchor()

    :)

    By Blogger Danny, at 10:11 PM  

Post a Comment

Links to this post:

Create a Link

<< Home

Google
 
nunzi.blogspot.com    Web