Insert PayPal Express button into OpenCart mini-cart module

Hi there,

I’m trying to add a “Checkout with PayPal” (PayPal Express) button into my cart script. I have two carts. A main cart page and a mini-cart which is accessed via a drop-down from the top of any page (site: http://www.sconchtextiles.co.uk)

The code for the mini-cart is:

[php]<?php
class ControllerModuleCart extends Controller {
public function index() {
$this->language->load(‘module/cart’);

  	if (isset($this->request->get['remove'])) {
      	$this->cart->remove($this->request->get['remove']);
		
		unset($this->session->data['vouchers'][$this->request->get['remove']]);
  	}	
		
	// Totals
	$this->load->model('setting/extension');
	
	$total_data = array();					
	$total = 0;
	$taxes = $this->cart->getTaxes();
	
	// Display prices
	if (($this->config->get('config_customer_price') && $this->customer->isLogged()) || !$this->config->get('config_customer_price')) {
		$sort_order = array(); 
		
		$results = $this->model_setting_extension->getExtensions('total');
		
		foreach ($results as $key => $value) {
			$sort_order[$key] = $this->config->get($value['code'] . '_sort_order');
		}
		
		array_multisort($sort_order, SORT_ASC, $results);
		
		foreach ($results as $result) {
			if ($this->config->get($result['code'] . '_status')) {
				$this->load->model('total/' . $result['code']);
	
				$this->{'model_total_' . $result['code']}->getTotal($total_data, $total, $taxes);
			}
			
			$sort_order = array(); 
		  
			foreach ($total_data as $key => $value) {
				$sort_order[$key] = $value['sort_order'];
			}

			array_multisort($sort_order, SORT_ASC, $total_data);			
		}		
	}
	
	$this->data['totals'] = $total_data;
	
	$this->data['heading_title'] = $this->language->get('heading_title');
	
	$this->data['text_items'] = sprintf($this->language->get('text_items'), $this->cart->countProducts() + (isset($this->session->data['vouchers']) ? count($this->session->data['vouchers']) : 0), $this->currency->format($total));
	$this->data['text_empty'] = $this->language->get('text_empty');
	$this->data['text_cart'] = $this->language->get('text_cart');
	$this->data['text_checkout'] = $this->language->get('text_checkout');
	
	$this->data['button_remove'] = $this->language->get('button_remove');
	
	$this->load->model('tool/image');
	
	$this->data['products'] = array();
		
	foreach ($this->cart->getProducts() as $product) {
		if ($product['image']) {
			$image = $this->model_tool_image->resize($product['image'], $this->config->get('config_image_cart_width'), $this->config->get('config_image_cart_height'));
		} else {
			$image = '';
		}
						
		$option_data = array();
		
		foreach ($product['option'] as $option) {
			if ($option['type'] != 'file') {
				$value = $option['option_value'];	
			} else {
				$filename = $this->encryption->decrypt($option['option_value']);
				
				$value = utf8_substr($filename, 0, utf8_strrpos($filename, '.'));
			}				
			
			$option_data[] = array(								   
				'name'  => $option['name'],
				'value' => (utf8_strlen($value) > 20 ? utf8_substr($value, 0, 20) . '..' : $value),
				'type'  => $option['type']
			);
		}
		
		// Display prices
		if (($this->config->get('config_customer_price') && $this->customer->isLogged()) || !$this->config->get('config_customer_price')) {
			$price = $this->currency->format($this->tax->calculate($product['price'], $product['tax_class_id'], $this->config->get('config_tax')));
		} else {
			$price = false;
		}
		
		// Display prices
		if (($this->config->get('config_customer_price') && $this->customer->isLogged()) || !$this->config->get('config_customer_price')) {
			$total = $this->currency->format($this->tax->calculate($product['price'], $product['tax_class_id'], $this->config->get('config_tax')) * $product['quantity']);
		} else {
			$total = false;
		}
												
		$this->data['products'][] = array(
			'key'      => $product['key'],
			'thumb'    => $image,
			'name'     => $product['name'],
			'model'    => $product['model'], 
			'option'   => $option_data,
			'quantity' => $product['quantity'],
			'price'    => $price,	
			'total'    => $total,	
			'href'     => $this->url->link('product/product', 'product_id=' . $product['product_id'])		
		);
	}
	
	// Gift Voucher
	$this->data['vouchers'] = array();
	
	if (!empty($this->session->data['vouchers'])) {
		foreach ($this->session->data['vouchers'] as $key => $voucher) {
			$this->data['vouchers'][] = array(
				'key'         => $key,
				'description' => $voucher['description'],
				'amount'      => $this->currency->format($voucher['amount'])
			);
		}
	}
				
	$this->data['cart'] = $this->url->link('checkout/cart');
					
	$this->data['checkout'] = $this->url->link('checkout/checkout', '', 'SSL');

	if (file_exists(DIR_TEMPLATE . $this->config->get('config_template') . '/template/module/cart.tpl')) {
		$this->template = $this->config->get('config_template') . '/template/module/cart.tpl';
	} else {
		$this->template = 'default/template/module/cart.tpl';
	}
			
	$this->response->setOutput($this->render());		
}

}
?>[/php]

How do I insert the code for the PayPal Express button into this? I have tried a couple of times and it ends in a weird place on the page.

The code for the PayPal Express button is:

<a href="index.php?route=payment/pp_express/set_payment"><img src="https://www.paypalobjects.com/en_US/i/btn/btn_xpressCheckout.gif" align="left" style="padding-right: 7px; vertical-align: baseline;"/></a>-OR- 

The whole site is responsive using Bootstrap and am feeling a little out of my depth!

Please help…

Apologies, copied the wrong mini-cart code! Correct code here:

[php]

<?php echo $text_items; ?>
<?php if ($products || $vouchers) { ?>
<?php foreach ($products as $product) { ?> <?php } ?> <?php foreach ($vouchers as $voucher) { ?> <?php } ?>
<?php if ($product['thumb']) { ?> <?php echo $product['name']; ?> <?php } ?> <?php echo $product['name']; ?>
<?php foreach ($product['option'] as $option) { ?> - <?php echo $option['name']; ?> <?php echo $option['value']; ?>
<?php } ?>
x <?php echo $product['quantity']; ?> <?php echo $product['total']; ?> <?php echo $button_remove; ?>
<?php echo $voucher['description']; ?> x 1 <?php echo $voucher['amount']; ?> <?php echo $button_remove; ?>
<?php foreach ($totals as $total) { ?> <?php } ?>
<?php echo $total['title']; ?>: <?php echo $total['text']; ?>
<?php } else { ?>
<?php echo $text_empty; ?>
<?php } ?>
[/php]

It’s going to be really hard for us to know where you want the button, this should place it just to the right of the “Checkout” button. You website is very nice. I edited your website live and I think the code below will give you the desire effect your looking for.

Change:

[php]

<?php echo $text_cart; ?>   <?php echo $text_checkout; ?>
[/php]

To:

[php]

<?php echo $text_cart; ?>   <?php echo $text_checkout; ?>   
[/php]

Hi there,

Thanks for the quick response and the kind words about the site - it’s taken a lot of work to get it to this stage :slight_smile:

Unfortunately, whilst that code works perfectly for full size pages once you shrink the browser (or view the site on a smartphone) it pushes the PayPal Express button to the next line and the formatting is slightly off:

See here for picture of problem: http://www.sconchtextiles.co.uk/image/data/ppe.png

I assume I need to alter the CSS styling to accommodate the extra button in the narrow width but again, not sure where to start with this.

Thanks,

Hugh

Yeah, it’s just too much to fit on such a small screen, that paypal button is super large. You can always get rid of the PayPal “Graphic” button and go with a standard red button that says paypal.

Or you can adjust your html so the paypal button is centered on the other 2 buttons with a little spacing in between so it will look the same in a small or large screen.

Hi there,

I like the second option so that it looks the same in each size and that was what I was trying to do originally.

I placed the PayPal button in a second Div class but it ended up in a strange place - outside of the cart itself…

How should I modify the HTML correctly to place it underneath and centrally so that works across the responsive sizes?

Do the same thing I said above, but use this code instead.

Then only thing I did was replaced the three $nbsp; with two
to move it to the next line.

[php]

<?php echo $text_cart; ?>   <?php echo $text_checkout; ?>

[/php]
Sponsor our Newsletter | Privacy Policy | Terms of Service