Post by astott2014 » Tue Jun 16, 2015 11:05 pm

I have been trying for months to remove the mini-cart popup from my header and I can not figure it out. Can someone PLEASE, PEASE, help me?

I don't want to remove the cart fully from my header, only the mini-cart that pops up when you hover the cart.

If someone knows how to do this, please help me, I would really appreciate it. It is driving my insane! ???
Last edited by astott2014 on Fri Jun 19, 2015 11:32 am, edited 2 times in total.

Active Member

Posts

Joined
Thu Sep 18, 2014 4:39 pm

Post by deepvision » Tue Jun 16, 2015 11:24 pm

It can be done with css

Code: Select all

div#cart .content {
display: none !important;
}

ImageImageImage


User avatar
Active Member

Posts

Joined
Tue May 19, 2015 1:03 am

Post by IP_CAM » Tue Jun 16, 2015 11:25 pm

...or then, just remove the Cart out of the Header!
It then will NOT use any Server Power, compared with, if it is called,
and placed on the Page, but just not visible...
You even could use the empty Space to display something else, instead!
Ernie
ipc.li/cart/

My Github OC Site: https://github.com/IP-CAM
5'200 + FREE OC Extensions, on the World's largest private Github OC Repository Archive Site.


User avatar
Legendary Member

Posts

Joined
Tue Mar 04, 2014 1:37 am
Location - Switzerland

Post by astott2014 » Tue Jun 16, 2015 11:34 pm

IP_CAM wrote:...or then, just remove the Cart out of the Header!
I didn't want to remove the cart fully out of the header, only the mini cart pop up when the cart is hovered :) .
deepvision wrote:It can be done with css

Code: Select all

div#cart .content {
display: none !important;
}
Thanks very much, that has worked ;D . I am really happy!

The only problem is, I can no longer click the "Cart" and it takes me to checkout? I only wanted to remove the cart popup, not deactivate the cart going to checkout?
Last edited by astott2014 on Fri Jun 19, 2015 11:32 am, edited 1 time in total.

Active Member

Posts

Joined
Thu Sep 18, 2014 4:39 pm

Post by deepvision » Wed Jun 17, 2015 2:51 am

You can try to add something like this to the template

Code: Select all

<script>
$(function(){
    $('#cart').on('click',function(){
        window.location = '/index.php?route=checkout/cart'
    });
});
</script>

ImageImageImage


User avatar
Active Member

Posts

Joined
Tue May 19, 2015 1:03 am

Post by IP_CAM » Wed Jun 17, 2015 3:38 am

just to complete it, removing the small cart from the header does not mean, to remove the Cart, or links to it, from anywhere else!
Ernie

My Github OC Site: https://github.com/IP-CAM
5'200 + FREE OC Extensions, on the World's largest private Github OC Repository Archive Site.


User avatar
Legendary Member

Posts

Joined
Tue Mar 04, 2014 1:37 am
Location - Switzerland

Post by deepvision » Wed Jun 17, 2015 4:32 am

IP_CAM wrote:just to complete it, removing the small cart from the header does not mean, to remove the Cart, or links to it, from anywhere else!
Ernie
Removing

Code: Select all

<?php echo $cart; ?>

will effectively remove the entire cart section from the header in journal template.
Which I believe is the one used on .
Last edited by deepvision on Fri Jun 19, 2015 11:38 am, edited 1 time in total.

ImageImageImage


User avatar
Active Member

Posts

Joined
Tue May 19, 2015 1:03 am

Post by IP_CAM » Wed Jun 17, 2015 6:20 am

The Page Source, in your Theme, it looks like this:

Code: Select all

<div class="journal-cart j-min xs-100 sm-100 md-33 lg-25 xl-25">
            <div id="cart">
  <div class="heading" >
    <a><span id="cart-total">BAG (0) - £0.00</span><i></i></a>
  </div>
  <div class="content">
    <div class="cart-wrapper">
        <div class="empty">Your shopping bag is empty!</div>
      </div>
</div>
</div>        </div>
Ernie

My Github OC Site: https://github.com/IP-CAM
5'200 + FREE OC Extensions, on the World's largest private Github OC Repository Archive Site.


User avatar
Legendary Member

Posts

Joined
Tue Mar 04, 2014 1:37 am
Location - Switzerland

Post by deepvision » Wed Jun 17, 2015 11:41 am

Yes.
And everything between

Code: Select all

<div id="cart">
...
<div>
comes from the $cart variable.

The cart code can be edited in /catalog/view/theme/journal2/template/module/cart.tpl :

Code: Select all

<div id="cart">
  <div class="heading" >
    <a><span id="cart-total"><?php echo $text_items; ?></span><i></i></a>
  </div>
  <div class="content">
    <div class="cart-wrapper">
    <?php if ($products || $vouchers) { ?>
    <div class="mini-cart-info">
      <table>
        <?php foreach ($products as $product) { ?>
        <tr>
          <td class="image"><?php if ($product['thumb']) { ?>
            <a href="<?php echo $product['href']; ?>"><img src="<?php echo $product['thumb']; ?>" alt="<?php echo $product['name']; ?>" title="<?php echo $product['name']; ?>" /></a>
            <?php } ?></td>
          <td class="name"><a href="<?php echo $product['href']; ?>"><?php echo $product['name']; ?></a>
            <div>
              <?php foreach ($product['option'] as $option) { ?>
              - <small><?php echo $option['name']; ?> <?php echo $option['value']; ?></small><br />
              <?php } ?>
              <?php if (isset($product['recurring'])) : /* v156 compatibility */ ?>
              <?php if ($product['recurring']): ?>
              - <small><?php echo $text_payment_profile ?> <?php echo $product['profile']; ?></small><br />
              <?php endif; ?>
              <?php endif; /* end v156 compatibility */ ?>
            </div></td>
          <td class="quantity">x&nbsp;<?php echo $product['quantity']; ?></td>
          <td class="total"><?php echo $product['total']; ?></td>
          <td class="remove"><i onclick="(getURLVar('route') == 'checkout/cart' || getURLVar('route') == 'checkout/checkout') ? location = 'index.php?route=checkout/cart&remove=<?php echo $product['key']; ?>' : $('#cart').load('index.php?route=module/cart&remove=<?php echo $product['key']; ?>' + ' #cart > *');"></i></td>
        </tr>
        <?php } ?>
        <?php foreach ($vouchers as $voucher) { ?>
        <tr>
          <td class="image"></td>
          <td class="name"><?php echo $voucher['description']; ?></td>
          <td class="quantity">x&nbsp;1</td>
          <td class="total"><?php echo $voucher['amount']; ?></td>
          <td class="remove"><i onclick="(getURLVar('route') == 'checkout/cart' || getURLVar('route') == 'checkout/checkout') ? location = 'index.php?route=checkout/cart&remove=<?php echo $voucher['key']; ?>' : $('#cart').load('index.php?route=module/cart&remove=<?php echo $voucher['key']; ?>' + ' #cart > *');"></i></td>
        </tr>
        <?php } ?>
      </table>
    </div>
    <div class="mini-cart-total">
      <table>
        <?php foreach ($totals as $total) { ?>
        <tr>
          <td class="right"><b><?php echo $total['title']; ?>:</b></td>
          <td class="right"><?php echo $total['text']; ?></td>
        </tr>
        <?php } ?>
      </table>
    </div>
    <div class="checkout"><a class="button" href="<?php echo $cart; ?>"><?php echo $text_cart; ?></a> <a class="button" href="<?php echo $checkout; ?>"><?php echo $text_checkout; ?></a></div>
    <?php } else { ?>
    <div class="empty"><?php echo $text_empty; ?></div>
    <?php } ?>
  </div>
</div>
</div>

ImageImageImage


User avatar
Active Member

Posts

Joined
Tue May 19, 2015 1:03 am

Post by astott2014 » Thu Jun 18, 2015 10:38 pm

Ok ok, I'm confused!!!

So who's right here, and what do I need to remove?

I currently have the CSS code implemented as suggested in one of the posts above. That indeed de-activated the mini cart on hover, but when I click the cart now, I doesn't take me to the main cart/checkout as it used too. I only wanted to remove the mini cart on hover.

Can one of you please explain a little more clearer what I need to do, and let me know if I need to remove the CSS code I implemented.

Active Member

Posts

Joined
Thu Sep 18, 2014 4:39 pm

Post by deepvision » Thu Jun 18, 2015 10:50 pm

You can try both solutions and choose one :)

ImageImageImage


User avatar
Active Member

Posts

Joined
Tue May 19, 2015 1:03 am

Post by IP_CAM » Thu Jun 18, 2015 10:52 pm

Basically, the question is, if one want's to have Code, just delaying Loading time, and enlarging the data-size of a document, if an Option, or whatever, is not required anyhow, ever... ???

You may drive around with your Car, 4 wheel drive switched on, always, and you carry a 100kg. Load, in your trunk, just to make sure, your Car will have enough weight on the rear Wheels, to avoid the wheels to spin, if the road is wet and slipry.

It does not really matter, what you do, if you have shop with 100 Products, and possibly 100 Visitors a day, who cares. But if you want to participate in a real Competition-Race, where performance counts, and nothing else, you cannot afford to carry ANY spare LOAD, just for fun.

Opening the Cart, and checking it for existing Orders, placed, EVERY TIME, ANY PAGE is opened, is just highly unprofessional Coding. Regardless of the Fact, that it's just a waste of loading time, to check the CART for it's possibly CONTENT, with every single Shop Site Page loaded, IT JUST MAKES NO SENSE.

You can HIDE Content, but it still exists, regardless on how it is HIDDEN, by a CSS-Command.Or, you can REMOVE the ROUTINE, wich does make no sense, and IT's GONE, for good! And every sinlge Page, loaded from your Site, will load a little faster, than before. This is, what Customers like to see, I assume...

That's what I'm trying to say, nothing else. ;)

Good Luck
Ernie
ipc.li/cart/
Last edited by IP_CAM on Thu Jun 18, 2015 10:59 pm, edited 1 time in total.

My Github OC Site: https://github.com/IP-CAM
5'200 + FREE OC Extensions, on the World's largest private Github OC Repository Archive Site.


User avatar
Legendary Member

Posts

Joined
Tue Mar 04, 2014 1:37 am
Location - Switzerland

Post by deepvision » Thu Jun 18, 2015 10:59 pm

I agree with IP_CAM .
The best way would be to remove the content of the mini cart popup for good.
I just did not agree with the proposed way how to achieve it. Because it would not work.
It can be done by direct editing of the following file
/catalog/view/theme/journal2/template/module/cart.tpl
Or by implementing required changes with vqmod which might be better for future journal2 updates.
I believe the proposed css change would be better compatible with future updates and it does not look like it makes any difference regarding loading time.

ImageImageImage


User avatar
Active Member

Posts

Joined
Tue May 19, 2015 1:03 am

Post by IP_CAM » Thu Jun 18, 2015 11:02 pm

deepvision wrote:I agree with IP_CAM ....... Because it would not work.
just to make clear, I'm takling about the DEFAULT THEME only, the code may look different by use of other Themes!
Ernie

My Github OC Site: https://github.com/IP-CAM
5'200 + FREE OC Extensions, on the World's largest private Github OC Repository Archive Site.


User avatar
Legendary Member

Posts

Joined
Tue Mar 04, 2014 1:37 am
Location - Switzerland

Post by astott2014 » Fri Jun 19, 2015 1:05 am

Firstly, thank you BOTH for taking the time to look into this for me, I do appreciate your time.

To be honest, I am not quite sure which option to go for yet, the CSS code does seem more simple as i'd be unsure what script to remove from the template, i'd be a little worried messing with something I don't know what I am doing with..

On the other hand, as I said earlier, with the CSS implement I made, I am unable to click the cart to take me to the checkout/cart? How would I overcome this, or would that not be possible after I disabled the mini-cart?

Active Member

Posts

Joined
Thu Sep 18, 2014 4:39 pm

Post by deepvision » Fri Jun 19, 2015 1:21 am

Yesterday I posted the code to solve the problem with clicks.

Actually I posted it two days ago :)

ImageImageImage


User avatar
Active Member

Posts

Joined
Tue May 19, 2015 1:03 am

Post by astott2014 » Fri Jun 19, 2015 2:49 am

deepvision wrote:Yesterday I posted the code to solve the problem with clicks.

Actually I posted it two days ago :)

Code: Select all

<script>
$(function(){
    $('#cart').on('click',function(){
        window.location = '/index.php?route=checkout/cart'
    });
});
</script>
Where exactly do I add this code? I am thinking of removing the script completely too rather than using the temp fix with CSS code.

Active Member

Posts

Joined
Thu Sep 18, 2014 4:39 pm

Post by deepvision » Fri Jun 19, 2015 4:31 am

Can be added to the
/catalog/view/theme/journal2/template/common/footer.tpl

ImageImageImage


User avatar
Active Member

Posts

Joined
Tue May 19, 2015 1:03 am

Post by astott2014 » Fri Jun 19, 2015 5:03 am

deepvision wrote:Can be added to the
/catalog/view/theme/journal2/template/common/footer.tpl
Just done that and it worked, thanks very much. You did mean footer.tpl, and not head, right?

Active Member

Posts

Joined
Thu Sep 18, 2014 4:39 pm

Post by deepvision » Fri Jun 19, 2015 5:12 am

yes, better to the footer.

ImageImageImage


User avatar
Active Member

Posts

Joined
Tue May 19, 2015 1:03 am
Who is online

Users browsing this forum: No registered users and 83 guests