How To Put Product Image In Opencart Invoice 3.0

In this web log post we volition prove y'all how to add your store logo and product images to your invoices, changing the default OpenCart ii.x invoice template.

Unfortunately, OpenCart has not born editor for editing invoice template within the admin console and nosotros have to change it by modifying the code itself.

Annotation: This modification works only with OpenCart 2.x and we assume that y'all have already installed information technology.

OCMod modification

Since modifying cadre files is not recommended, considering of other modules malfunctioning, we will employ OCMod modification to edit the template for the invoices.

This method does not modify the cadre functionality of OpenCart and this is why we are going to apply this one.

Kickoff thing yous should do is to create a new XML file and name it yourcustommodificationname.ocmod.xml . Please, make sure that your file has the extension .ocmod.xml, because otherwise it won't be recognized past the integrated Extension installer in OpenCart 2.x.

Add logo in the header

If nosotros desire to include the logo in the header of the invoice, we need to add together these lines in the file:

<modification>     <name>Add together images to invoice by iSenseLabs</name> 	<version>i.0 (Initial)</version>	 	<link>https://isenselabs.com</link> 	<code>isense_invoice</code> 	<writer>iSenseLabs</author>  	<file path="admin/controller/auction/social club.php"> 		<operation> 			<search><![CDATA[public function invoice() {]]></search> 			<add position="afterward"><![CDATA[ 				// ISENSELABS.COM Code STARTS HERE 				$this->load->model('tool/image'); 				// ISENSELABS.COM CODE ENDS Hither 			]]></add> 		</operation>  		<operation> 			<search alphabetize="0"><![CDATA[$this->response->setOutput($this->load->view('sale/order_invoice]]></search> 			<add position="before"><![CDATA[ 				// ISENSELABS.COM CODE STARTS HERE 		 				if (isset($this->request->server['HTTPS']) && (($this->request->server['HTTPS'] == 'on') || ($this->request->server['HTTPS'] == '1'))) { 					$server = $this->config->get('config_ssl'); 				} else { 					$server = $this->config->get('config_url'); 				} 				 				if ($this->config->become('config_logo') && file_exists(DIR_IMAGE . $this->config->get('config_logo'))) { 					$data['logo'] = $server . 'image/' . $this->config->get('config_logo'); 				} else { 					$data['logo'] = ''; 				} 				 				// ISENSELABS.COM CODE ENDS HERE 			]]></add> 		</operation> 	</file>  	<file path="admin/view/template/sale/order_invoice.tpl"> 		<operation> 			<search><![CDATA[<div fashion="page-interruption-after: always;">]]></search> 			<add together position="afterward"><![CDATA[ 				<!-- ISENSELABS.COM CODE STARTS Here -->  				<?php if(isset($logo) && !empty($logo)) { ?>             		<img src="../<?php echo $logo ?>" way="margin: 15px 0 15px 0;" />            		<?php } ?>  				<!-- ISENSELABS.COM Code ENDS Here --> 			]]></add> 		</functioning> 	</file> </modification>

Then, we should go to your OpenCart Store Administration Folio > Extensions > Extension Installer and upload the file. After we get the message 'Success: You lot take installed your extension!', we need to get to Extensions > Modifications and click on the Refresh button to apply the changes.

The invoices should look similar this:

Add together production images

If we want likewise to add product images to our invoices, we have to add this lawmaking in our current modification file or we tin can create a new one:

<file path="admin/controller/auction/order.php">     <operation> 		<search><![CDATA[public function invoice() {]]></search> 		<add position="subsequently"><![CDATA[ 			// ISENSELABS.COM CODE STARTS HERE  			$this->load->model('catalog/product');   			// ISENSELABS.COM CODE ENDS Here 		]]></add> 	</functioning>  	<operation> 		<search index="0"><![CDATA[$product_data[] = array(]]></search> 		<add position="before"><![CDATA[ 			// ISENSELABS.COM Code STARTS Hither 				$width = 100; 				$height = 100; 				$product_info = $this->model_catalog_product->getProduct($production['product_id']);	 				if (version_compare(VERSION, '2.3', '>=')) {                     $this->load->model('tool/image');                 }                 if ($product_info['epitome']) { 					$epitome = $this->model_tool_image->resize($product_info['image'], $width, $summit); 				} else { 					$image = $this->model_tool_image->resize('placeholder.png', $width, $height); 				}	 			// ISENSELABS.COM CODE ENDS Here 		]]></add together> 	</operation>  	<operation> 		<search index="0"><![CDATA[$product_data[] = array(]]></search> 		<add together position="after"><![CDATA[ 			'image'	   => $image, // ISENSELABS.COM 		]]></add together> 	</operation> </file>  <file path="admin/view/template/sale/order_invoice.tpl"> 	<functioning> 		<search><![CDATA[<?php echo $production['name']; ?>]]></search> 		<add position="supervene upon"><![CDATA[ 			<!-- ISENSELABS.COM Lawmaking STARTS Here -->  			<?php if(isset($product['image']) && !empty($production['image'])) { ?>         		<img src="<?php echo $product['paradigm'] ?>" />        		<?php } ?>  			<!-- ISENSELABS.COM Lawmaking ENDS HERE -->             <?php echo $production['name']; ?> 		]]></add together> 	</operation> </file>

After that, we demand to upload the modification file to our OpenCart store and the final result will be this:

Change product paradigm size

Here nosotros volition show you how to customize the code in the OCMod file. This modification is not big, but you tin can do some small changes.

If you demand smaller or bigger product images, yous tin change these two rows:

$width = 100; $acme = 100;

After yous made the changes you need to salve your .ocmod.xml file. Before uploading the modification, you need to delete the old one from Extensions > Modifications, check the modification 'Add images to invoice past iSenseLabs' and click on the blood-red delete push button. You need also to clear and refresh the modifications. Subsequently that you will be able to upload the new .ocmod.xml file, using the integrated Extension Installer in OpenCart ii.x.

Last words

Nosotros promise that you volition find this tutorial helpful and that information technology will requite yous ideas how to freshen upwards your invoice.

Download Source