Customise printed catalog

[PLine]

Hello there,

I don't find any info about this case in the forum with the 'search' function and the doc is not enough explicit.

I try to customise the printed catalog HTML and PDF.
I also created a custom css file "user.css" in the admin template css files :
- /media/templates/administrator/atum
-- css
--- user.css
I copied this code into it:

Code: Select all

.ph-catalog-doc {line-height:0.8;}
.ph-catalog-header {line-height:0.5;}
.ph-catalog-img {height: auto;width: auto;}
.ph-catalog-col1 {width: 10%;padding-right:3px;}
.ph-catalog-col2 {width: 90%;padding-left:3px;}
.ph-catalog-price {text-align: right;font-weight: bold;}
.ph-catalog-sep {border-bottom: 1px solid #f0f0f0;}
.ph-catalog-sep-margin {font-size: 8px;}
.ph-catalog-ean {line-height:0.1;}
.ph-catalog-table, .ph-catalog-table-in {width: 100%;}
.ph-catalog-title {font-weight:bold;font-size:160%;color:blue;line-height:0.8;}
.ph-catalog-desc-long {font-size: 85%;line-height:1;}
.ph-catalog-price {line-height: 1;font-size: 90%;text-align:right;}
.ph-catalog-price-table {width: 200pt;}
.ph-catalog-price-item {text-align:right; font-weight: bold;}
.ph-catalog-price-item-txt {text-align:left;}

Then I changed parameters, like width, text size or text color from some items.
Unfortunately it has no effect in both pdf and html printed catalog.
I also think I use a false methode. Where ist this code to manage ?

Concerned Versions:
Joomla 4.1.0
Phoca Cart 4.0.0RC
Phoca PDF 4.0.0Beta2

Many thanks
Regards, Marc

[Jan]

Hi, PDF does not know CSS well (some CSS rules can be applied, but most of them are ignored as PDF is a static document and HTML/CSS is dynamic document), see the important notice here:

https://www.phoca.cz/phocapdf

The output of the catalogue is here:
administrator/components/com_phocacart/layouts/catalog.php

it is stored in layout so it can be overriden by your template (administration template) which means the changes will be not overwritten by update.

So thee are two options:
- to write own output
- or to add CSS to parameter: Printed Catalog CSS but this can be limited for the PDF



In any case, CSS is not taken from the template.

Jan

[PLine]

Hello Jan
I tried now to add this code in the parameter, "Printed Catalog CSS" and it works well, thank you !
I forgoted this feature in the parameter, sorry !

Code: Select all

.ph-catalog-doc {line-height:1.0;}
.ph-catalog-header {line-height:1.2;}
.ph-catalog-category-header {line-height: 1.3;font-size: 140%;text-align:center;background-color:#ff0000;color:#ffffff;}
.ph-catalog-col1 {width: 20%;padding-right:5px;}
.ph-catalog-col2 {width: 80%;padding-left:5px;}
.ph-catalog-img {height: auto;width: auto;}
.ph-qr-img {height: auto;width: auto;}
.ph-catalog-features {}
.ph-catalog-sep {border-bottom: 4px solid #ff9090;}
.ph-catalog-sep-margin {font-size: 20px;}
.ph-catalog-sku{}
.ph-catalog-ean {line-height:0.1;}
.ph-catalog-table, .ph-catalog-table-in {width: 100%;padding: 10;}
.ph-catalog-title {font-weight:bold;font-size:160%;color:#777777;line-height:0.8;}
.ph-catalog-desc-long {font-size: 85%;line-height:1;color: #888888;}
.ph-catalog-price {line-height: 1;font-size: 90%;text-align:right;font-weight: bold;}
.ph-catalog-price-table {width: 210pt;}
.ph-catalog-price-item {text-align:right; font-weight: bold;}
.ph-catalog-price-item-txt {text-align:left;font-size: 65%;}

[Jan]

Ok, great to hear it.

Jan