Edit Options at Basket Page
Edit Options at the basket (Modal pop up!)
If the website is currently NOT using ajax add to cart:
On the BASK page, add this if statement at the top:
PRODUCT PAGE CHANGES
Check to see if the client is using alternative page displays for products. If they are, make either a Ready
Theme content to call on each pages (instead of editOptions), or use toolkit to call a page. This way all the
code for the “pop up” is in the same spot.
- Create an item with the code editOptions, and module of cmp-mv-content
- Assign the editOptions item to the PROD page.
- At the top of the PROD details, add the following if statement:
You can add more logic to see if they have selected an option for the add-on product, which will prevent
them from checking out if they have not. Should also display an error message.
4. I n the editOptions tab, add the following code (this can vary depending on if the client wants it
styled a certain way or not, or if they are not using bootstrap! Make sure you make the appropriate
changes. This includes the ID of the price (price-value))
BASKET PAGE CHANGES
- Look for the item:options array
- Right AFTER the foreach loop, add the following code:
This is first checking to see if the basket item has options. If it does, the link will show.
It is going to pass the following variables to your modal pop up:
– Product Code
– Quantity currently in basket
– The current basket line item (we need this to delete it)
Using Miva9’s Add-on Product with Attributes? Use the following (REQUIRES TOOLKIT):
3. You can change the “Edit Options” text, or add an icon (check out photodon.com’s basket optionchanger, it uses a cog).
4. Go to the Footer of the basket page and add your modal information needed (this could be a lightbox too).
Once you had added all the code/ components needed, test to make sure the following are happening:
Modal (or lightbox) is popping up with the correct product
The correct options are showing (go to the product page to compare)
Change the options, and make sure that the previous basket item is removed, and is now replaced with
the new one (aka: the options changed).
Here are some examples:
http://tguefen.mivamerchantdev.com/mm5/merchant.mvc?Screen=PROD&Store_Code=DTS&Product_Code=home-for-the-holidays-candle CLICK HERE
(Add it to cart and edit the options on the basket page — the Price varies with the size)