Shoppingcart/Freeship in Header support

autoace - Looking at your site, one way to arrange the buttons as you describe is to add wrappers for the groups:

Code:

---

<div id="cartHeader">
<h3>Shopping Cart</h3>
<div id="cartCountWrapper">
<div id="cartCount">
 0 item(s) in cart</div>
<div id="cartTotal">Subtotal: $0.00</div>
</div>
<div id="viewCartWrapper">
<div id="viewCart"><a href="https://www.automotiveace.com/index.php?main_page=shopping_cart"><img width="119" height="26" title=" Checkout " alt="Checkout" src="includes/templates/2009AA/buttons/english/button_checkout.gif"></a></div><br><br><!--view cart button-->
<div id="checkout"><a href="https://www.automotiveace.com/index.php?main_page=checkout_shipping"><img width="116" height="26" title=" Buy Now " alt="Buy Now" src="includes/templates/2009AA/buttons/english/button_buy_now.gif"></a></div><!--checkout/buy now button-->
</div>
</div>

---

Delete the two <br> as they don't do anything useful.
Style like this:

Code:

---

/*Shoppingcart/Freeship in Header*/
#headerWrapper {position: relative;}

#cartHeader {
    width: 22em;/*17 30*/
    position: absolute;
    top: 0.1em;/*4.0em*/
    right: 2.0em;
        /*bottom:0.1em;/*added 0.1em*/
    background: #d7d7d7;/*cacaca*/
    color: #000000;
    border: 1px solid #999999;/*888888*/
    }
       
#cartHeader h3 {
        display: none;/*added*/
    /*text-align: center;*/
        /*color: #005599;/*added*/
        /*margin:0.1em 0;/*added*/
    }
#cartCountWrapper {
    float: left;
        width: 50%;
        }
#cartCount {
    /*border-top: 1px solid #999999;*/
    text-align: left;/*center*/
        padding: 0.5em ;/*added*/
        }
#cartCount a {
        /*float: right;*/
        width: 20px;
        }
       
#cartTotal {
        float: left;
        padding: 0.5em ;/*added*/
        }
       
#cartFreeShip {
    margin: 0 0.3em;
    }
#cartCheckout {
    float: right;/*right center*/
    /*margin: 0.3em;*/
        padding-right: 5px;
        }
#cartButton {
        display: block;
    float: right;
    width: 123px; /*adjust to fit*/
    }
#viewCartWrapper {
    float: right;
        }
#viewCart {
    float: right;/*right center*/
    /*margin: 0.3em;*/
        padding-right: 5px;
        }
#checkout {
    float: right;/*right center*/
    /*margin: 0.3em;*/
        padding-right: 5px;
        }

/*eof Shoppingcart/Freeship Header*/

---

This could be cleaned up, but will work as shown. There may be some changes not highlighted.

gjh42 - thanks for the code!

I believe I made the changes you gave correctly, but the 'Subtotal' is on the right NOT below 'items' line.

Can you take one more look and show me the error of my ways, please.

#cartCountWrapper is supposed to enclose #cartCount and #cartTotal; you have just changed #cartCount to #cartCountWrapper.

thank you, I'll check it out.

Glenn, success! Got it corrected and styled nicely - thanks for your help.

This is a great mod if you want to move your sidebox shopping cart to the header!

Just a note in case someone runs into this issue.

I was trying to add this mod on top of the CSS Flyout Header Menu w/ Categories by Jade True (also a great mod) and every time I added the modifications from this mod to the style sheet, it would kill my CSS menu and turn it into a bunch of ugly text links. If I took out the CSS for this mod, the menu would be back.

After I uninstalled and reinstalled both mods about a zillion times, I finally got the idea to put the style sheet modifications from Shoppingcart/Freeship in Header onto the CSS Flyout Header Menu w/ Categories stylesheet and it worked (duh, right? I should've tried that after the second uninstall/reinstall.) Both mods are now installed successfully.

That's a curious report. There should be no way that the cartHeader styling could affect the styling of the flyout menu, except for possibly the #headerWrapper rule. The typo mentioned above (post 29) might cause a problem with following rules, but only in the same stylesheet file. Have you corrected that? If you have a minify script running, all of your stylesheets will be combined into one, and this would cause an error to wipe out _all_ following styling.
I could offer better advice if I could see your site.

Quote:

---

Originally Posted by gjh42

That's a curious report. There should be no way that the cartHeader styling could affect the styling of the flyout menu, except for possibly the #headerWrapper rule. The typo mentioned above (post 29) might cause a problem with following rules, but only in the same stylesheet file. Have you corrected that? If you have a minify script running, all of your stylesheets will be combined into one, and this would cause an error to wipe out _all_ following styling.
I could offer better advice if I could see your site.

---

Glenn, you really are too nice! :clap: I really appreciate it. I did try the fix in post 29 but it didn't fix the issue. I am running a minify script but the mod works perfectly with the style added to the alternate CSS sheet. I just wanted to put it out there in case another noob is as stubborn as I am and really wants to add this mod to their site. If you still want to look at it, my link is w w w.theburningbutterfly.com.

Just don't laugh - it's still under construction and I haven't styled the shopping cart yet - too much CSS at one time makes my headache.

Thanks again!

Hi gjh42,

You gave me this code:

PHP Code:

---

<div id="viewCart"><a href="https://www.mydomain.com/index.php?main_page=shopping_cart"><img width="110" height="20" title="ViewCart" alt="ViewCart" src="includes/templates/xxxxxx/buttons/english/button_checkout.gif"></a></div>
<div id="checkout"><a href="https://www.mydomain.com/index.php?main_page=checkout_shipping"><img width="110" height="20" title="Checkout" alt="Checkout" src="includes/templates/xxxxxx/buttons/english/button_buy_now.gif"></a></div> 


---

awhile back to make the buttons work correctly and they do!

However, I have been trying to replace the code with ZC code after reading this tutorial and have not been successful at all.

The code:

PHP Code:

---

<div id="viewCart"><a href="' . zen_href_link(FILENAME_SHOPPING_CART, '', 'SSL') . '">' . zen_image_button(BUTTON_IMAGE_CHECKOUT, BUTTON_CHECKOUT_ALT) . '</a></div>
<div id="checkout"><a href="' . zen_href_link(FILENAME_CHECKOUT_SHIPPING, '', 'SSL') . '">' . zen_image_button(BUTTON_IMAGE_BUY_NOW, BUTTON_BUY_NOW_ALT) . '</a></div> 


---

Could you show me the error of my ways? Been trying to find the right way to do it but so far with little success. :lamo:

This needs more context to be certain, but it looks like you are applying PHP code in HTML without specifying that it is PHP. Your syntax as shown would be correct for a part of a PHP statement that includes some HTML as output; this would need to look something like

PHP Code:

---

<?php echo '<div id="viewCart"><a href="' . zen_href_link(FILENAME_SHOPPING_CART, '', 'SSL') . '">' . zen_image_button(BUTTON_IMAGE_CHECKOUT, BUTTON_CHECKOUT_ALT) . '</a></div>
<div id="checkout"><a href="' . zen_href_link(FILENAME_CHECKOUT_SHIPPING, '', 'SSL') . '">' . zen_image_button(BUTTON_IMAGE_BUY_NOW, BUTTON_BUY_NOW_ALT) . '</a></div>'; ?>

---

Alternatively, you could do this:

PHP Code:

---

<div id="viewCart"><a href="<?php echo zen_href_link(FILENAME_SHOPPING_CART, '', 'SSL') ?>"><?php echo zen_image_button(BUTTON_IMAGE_CHECKOUT, BUTTON_CHECKOUT_ALT) ?></a></div>
<div id="checkout"><a href="<?php echo zen_href_link(FILENAME_CHECKOUT_SHIPPING, '', 'SSL') ?>"><?php echo zen_image_button(BUTTON_IMAGE_BUY_NOW, BUTTON_BUY_NOW_ALT) ?></a></div>

---