Layout in attachinvoice plugin

  • Posts: 14
  • Thank you received: 0
  • Hikashop Business
3 days 13 hours ago #332290

-- HikaShop version -- : 4.4.2
-- Joomla version -- : 3.9.26
-- PHP version -- : 7.4.16
-- Browser(s) name and version -- : Firefox 88.0 (64-bits)


I'm using the attachinvoice plugin to print shipping invoices. These are printed on a paper where the top-left has a label. On that label the shipping address is printed and I also want to print the senders postalcode en number. This works but.... I need the senders postalcode and number printed vertical.

With CSS I can change the font-size and so but I cannot get the text vertical (see attached file marked with the red rectangle).

I defined a vertical class and added this to the code but no succes. Here's a snippet:

.addresses td{padding-left:50px;}
.addresses fieldset {float:left;}
.pakbon td{padding-left:10px;}
.afzender {font-size:10px;}
.vertical { transform: rotate(-90deg);
 -webkit-transform: rotate(-90deg); /* Safari/Chrome */
 -moz-transform: rotate(-90deg); /* Firefox */
 -o-transform: rotate(-90deg); /* Opera */
 -ms-transform: rotate(-90deg); /* IE 9 */}


.products td, .products th{border:1px solid #ccc;padding:7px 4px;}
.products th{background-color:#5471B5;color:white;}

.products tr.limitation td{background-color:#ccc;padding:1px 0px;}

.hikashop_order_custom_fields_fieldset{margin-top : 20px;}

<page style="font-size: 14px" backtop="14mm" backbottom="14mm" backleft="10mm" backright="10mm">

	<table class="pakbon">
			$addresses = array('shipping_address');
			foreach($addresses as $oneAddress){
			if(empty($order->$oneAddress)) continue;
			if ($oneAddress=='shipping_address' && empty($pluginsShipping)) continue; ?>
			<td valign="top" style="width:50%">
						$override = false;
						if(!empty($order->order_shipping_id) && $oneAddress=='shipping_address' && method_exists($currentShipping, 'getShippingAddress')) {
							$override = $currentShipping->getShippingAddress($order->order_shipping_id);
						if($override !== false ) {
							echo $override;
						} else {
							$addressClass = hikashop_get('class.address');
								$view = 'order';
								$view = 'address';
							echo $addressClass->displayAddress($order->fields,$order->$oneAddress,$view);
							?> <br /> <span class="afzender"><?php 
								$number = JText::_('SHIPPING_INVOICE').' n° ';
								$number = JText::_('SHIPPING_INVOICE_NUMBER').' ';
								$item_type = 'display:back_shipping_invoice=1';
								$number = JText::_('INVOICE').' n° ';
								if(JText::_('INVOICE_NUMBER') != 'INVOICE_NUMBER'){
								$number = JText::_('INVOICE_NUMBER').' ';
								$item_type = 'display:back_invoice=1';

			<td class="afzender"><fieldset><span class="vertical">Afz.: 8271DN8</span></fieldset></td>
			<?php } ?>

Any ideas how I can get the specific text vertical?



Please Log in or Create an account to join the conversation.

  • Posts: 72729
  • Thank you received: 11084
2 days 23 hours ago #332306


What generates the PDF is not your browser, but the HTML2PDF library included in the PDF plugin.
So it doesn't handle advanced CSS properly.
However, it seems you're not the first one wanting to do something like that.
Looking online, I found this page:
There, they recommend doing it like that:

<div style="rotate:90;">ROTATED TEXT</div>
And based on that, I also found that the HTML2PDF code examples has one about this here:

The following user(s) said Thank You: insitevision

Please Log in or Create an account to join the conversation.

  • Posts: 14
  • Thank you received: 0
  • Hikashop Business
2 days 23 hours ago #332311

Hi Nicolas,

Thank you, that code was the solution. The specific text on the shipping invoice is now vertical!


Please Log in or Create an account to join the conversation.

Time to create page: 0.060 seconds
Powered by Kunena Forum