Jan 13 2011

Fun with jQuery in a Yahoo Store Part 2

jquery_logo_color_onwhite2So here we are again, last time I posted about jQuery in your Yahoo! store we added a quantity box, that seemed to work well, this time we are going to give  you a “You may also like:” cross sale in a Merchant Starter store. This will not auto populate but will make it so you can use the default Accessories area and change the text with JavaScript and not RTML.

Like with everything I post you will need to test it and make sure it works!

With this code and add-on you will need to pay attention to what I post, if you used the code from jQuery part 1 you will need to add the code where I tell you and if you did not use the code from part one you will just copy the code from here.

So lets start with the basic code, this is for the user that did not add the quantity box from my first jQuery post, just add this to your header in variables.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
   $("#accessorytitle").replaceWith("<span>You may also like:</span>");
});
</script>

Notice that I gave that span a class so you can style with CSS and feel free to change the text from “You may also like:” to anything you would like.

NOW, if you did use the quantity box from the other jQuery post here is the code for you. All you will need to do is add one line after the current code, like this

<script type="text/javascript">
$(document).ready(function() {
     $(‘.itemform .sale-price-bold’).append(<div id=quantity><b>Quantity: </b><input type=text size=3 maxlength=3 value=1 name=vwquantity></div>);
     $(‘.itemform .price-bold’).append(<div id=quantity><b>Quantity: </b><input type=text size=3 maxlength=3 value=1 name=vwquantity></div>);
     $("#accessorytitle").replaceWith("<span>You may also like:</span>");
});
</script>

As always test! Keep in mind that the code should be able to be copy and paste from here but the formatting will not always show right. As always enjoy!

No Comments

No comments yet.

RSS feed for comments on this post.

Leave a comment

You must be logged in to post a comment.