UseCase "Add/edit BlueSpice UniversalExport PDF template"
Component 624298
Jump to navigation
Jump to search
|
Content
How to read these instructions
Notice:
The instructions explained here serve as a guideline and cannot consistently cover all variations of customizing templates! Advanced understanding of MediaWiki, BlueSpice, HTML, CSS, PHP, Javascript and Server OS is required.
- The name of your customized template is referred to as YourNewTemplate.
- Comments within code are marked with
#Adapt:
. Just use your browser's Ctrl+F in-page search functionality.
Step 1: Copy an existing template folder
For example, base YourNewTemplate on the portrait BlueSpice template:
user@server:/var/www/html/w/extensions/BlueSpiceExtensions/UEModulePDF/data/PDFTemplates# cp -r BlueSpice YourNewTemplate
user@server:/var/www/html/w/extensions/BlueSpiceExtensions/UEModulePDF/data/PDFTemplates# tree.
├── YourNewTemplate # <-- Template name
│ ├── images # <-- Add your images here
│ │ ├── bs-header.jpg
│ │ └── bs-page-background.png
│ ├── stylesheets
│ │ └── styles.css # <-- Set header design and images in #bs-runningheaderfix
│ ├── template.html
│ └── template.php
├── YourNewTemplate_Draft # <-- Template name
│ ├── attachments
│ │ └── Disclaimer.txt
│ ├── images
│ │ └── bs-draft.png
│ ├── stylesheets
│ │ └── draft.css
│ ├── template.html
│ └── template.php
├── YourNewTemplate_Landscape # <-- Template name
│ ├── images
│ │ ├── bs-header.jpg
│ │ └── bs-page-background.png
│ ├── stylesheets
│ │ └── styles.css
│ ├── template.html
│ └── template.php
└── common
├── fonts
│ ├── DejaVuSans-BoldOblique.ttf
│ ├── DejaVuSans-Bold.ttf
│ ├── DejaVuSansMono-BoldOblique.ttf
│ ├── DejaVuSansMono-Bold.ttf
│ ├── DejaVuSansMono-Oblique.ttf
│ ├── DejaVuSansMono.ttf
│ ├── DejaVuSans-Oblique.ttf
│ └── DejaVuSans.ttf
└── stylesheets
├── bluespice.css
├── debug.css
├── fonts.css
├── geshi-php.css
├── mediawiki.action.history.diff.css
├── mediawiki.css
└── page.css
Step 2: Add your images
extensions/BlueSpiceExtensions/UEModulePDF/data/PDFTemplates/YourNewTemplate/images/
Step 3: Adapt settings in for YourNewTemplate
extensions/BlueSpiceExtensions/UEModulePDF/data/PDFTemplates/common/stylesheets/page.css
/**
* This files defines the basic settings for pages and defines the available
* areas (marginboxes) for content placement. It also sets up the most
* important components for Paged Media, like page breaks, page counters, etc.
*
* Additional Information about CSS for Paged Media can be found at:
* - http://www.w3.org/TR/2003/WD-css3-page-20030909/
* - http://www.w3.org/TR/css3-page/
* - http://www.w3.org/TR/CSS2/page.html
* - http://www.w3.org/TR/CSS2/generate.html
*/
/**
* The default page definition.
*/
@page {
size: A4 portrait;
margin: 3.5cm 1cm 2.5cm 2.5cm; /* #ADAPT: */
background: url('../images/bs-page-background.png') repeat-x bottom;
background-size: 21cm 2.3cm; /* #ADAPT: The latter number sets the footer's gray area height */
@top-left {
content: element( topleft );
}
@top-center {
content: element( topcenter );
}
@top-right {
content: element( topright );
}
@bottom-left {
content: element( bottomleft );
}
@bottom-center {
content: element( bottomcenter );
}
@bottom-right {
content: element( bottomright );
}
}
/**
* The "coverpage" overrides the default marginbox settings of the normal page.
* See "named pages" in CSS specification for more information.
*/
@page coverpage {
margin: 0cm 0cm 0cm 0cm;
background: url('../images/bs-cover.jpg') no-repeat top left;
background-size: 21cm;
@top-left {
content: none;
}
@top-center {
content: none;
}
@top-right {
content: none;
}
@bottom-left {
content: none;
}
@bottom-center {
content: none;
}
@bottom-right {
content: none;
}
}
@page rotated { size: landscape }
@page narrow { size: 9cm 18cm }
@page ultrawide { size: 58.4cm 21cm; }
.bs-rotated, .rotated {
page: rotated;
width: 25.8cm; /* DIN A4 landscape minus margins minus some space :) : 29.7 - 1 - 2.5 - 0.4 */
}
.bs-narrow, .narrow {
page: narrow;
width: 5.1cm; /* width minus margins minus some space: 9 - 1 - 2.5 - 0.4 */
}
.bs-ultrawide, .ultrawide {
page: ultrawide;
width: 55.5cm; /* Double DIN A4 landscape minus margins minus some space: 58.4 - 1 - 2.5 - 0.4 */
}
/* Generated content elements */
.bs-currentpagenumber:after,
.currentpagenumber:after {
content: counter( page );
}
.bs-totalpagescount:after,
.totalpagescount:after {
content: counter( pages );
}
.bs-universalexport-pagebreak,
.bs-pagebreak,
.pagebreak {
page-break-after: always;
visibility: hidden;
}
.bs-section,
.bs-custompage,
.bs-page-content {
page-break-after: always;
clear: both;
}
.bs-section:last-child,
.bs-custompage:last-child,
.bs-page-content:last-child {
page-break-after: avoid;
}
/* Common Elements */
body {
margin: 0;
padding: 0;
border: 0;
}
div, p, ul, ol, dl {
orphans: 3 !important;
widows: 5 !important;
}
img, ul, ol, dl {
page-break-before: avoid;
}
/* MediaWiki specific? --> mediawiki.css */
div.thumb {
page-break-before: avoid;
page-break-inside: avoid;
}
h1, h2, h3, h4, h5, h6 {
page-break-after: avoid;
clear:both;
}
table {
clear: both; /* Is this wise? Prevents floating thumbs from overlapping into tables and TOC table */
-fs-table-paginate: paginate; /* special xhtmlrenderer (flying saucer -> fs) property */
}
extensions/BlueSpiceExtensions/UEModulePDF/data/PDFTemplates/YourNewTemplate/stylesheets/styles.css
/******* PAGE LAYOUT ELEMENTS *******/
#bs-runningheaderfix {
position: running( topleft );
margin: 0 0 0 -2.5cm;
background: url('../images/bs-header.jpg') no-repeat 0 0; /* #ADAPT: */
background-size: 21cm;
height: 3cm;
width: 21cm;
border-bottom: 1px solid; /* #ADAPT: */
}
#bs-runningheaderfix h1 {
margin: 2.5cm 0 0 2.5cm; /* #ADAPT: */
font-size: small;
color:#6c6d6f;
border: none;
}
.bs-runningheader {
position: running( topright );
margin: 0 0 0 -21cm; /* move the header to the left considering the left page-margin */
width: 21cm;
vertical-align: bottom;
}
.bs-runningheader table{
width: 13cm;
border: none;
border-collapse: collapse;
position: relative;
left: 7cm;
background:transparent;
}
.bs-runningheader table td{
vertical-align: bottom;
}
.bs-booktitle {
font-weight: bold;
}
td.bs-ancestors-left {
vertical-align: bottom;
}
.bs-ancestor:first-child {
font-weight: bold;
}
/*
.bs-runningfooter {
position: running( bottomleft );
margin: 0.5cm 0 0 -2.5cm;
padding-top: 0.5cm;
font: x-small sans-serif;
height: 1.5cm;
width: 100%;
}
*/
#bs-runningfooterleft {
position: running( bottomleft );
color:#6c6d6f;
}
#bs-runningfootercenter {
position: running( bottomcenter );
margin: 0 0.5cm;
color:#6c6d6f;
}
#bs-runningfooterright {
position: running( bottomright );
color:#6c6d6f;
}
div.bs-tableofcontentspage .toc > ul > li.toclevel-1 { margin-left: 0em; }
div.bs-tableofcontentspage .toc > ul > li.toclevel-2 { margin-left: 2em; }
div.bs-tableofcontentspage .toc > ul > li.toclevel-3 { margin-left: 4em; }
div.bs-tableofcontentspage .toc > ul > li.toclevel-4 { margin-left: 6em; }
div.bs-tableofcontentspage .toc > ul > li.toclevel-5 { margin-left: 8em; }
div.bs-tableofcontentspage .toc > ul > li.toclevel-6 { margin-left: 10em; }
td.bs-wiki-article-ancestors-table-left,
td.bs-wiki-article-ancestors-table-right { width: 50%;}
td.bs-wiki-article-ancestors-table-right { text-align: right; }
extensions/BlueSpiceExtensions/UEModulePDF/data/PDFTemplates/YourNewTemplate/template.php
The name by which your new template will be listed in Special:WikiAdmin&mode=Preferences > Universal export PDF module
is set here and must be unique among all templates.
<?php
/**
* This is the main description file for the template. It contains all
* information necessary to load and process the template.
*/
return array(
/* A brief description. This information may be used in the user interface */
'info' => array(
'name' => 'BlueSpice', /* #ADAPT: */
'author' => 'Hallo Welt!', /* #ADAPT: */
'copyright' => 'Hallo Welt! GmbH', /* #ADAPT: */
'url' => 'http://www.hallowelt.biz', /* #ADAPT: */
'description' => 'This is the default BlueSpice PDF Template' /* #ADAPT: */
),
/**
* The following resources are used in the conversion from xhtml to PDF.
* You may reference them in your template files
*/
'resources' => array(
'ATTACHMENT' => array(), //Some extra attachments to be included in every eport file
'STYLESHEET' => array(
'../common/stylesheets/page.css',
'../common/stylesheets/mediawiki.css',
'stylesheets/styles.css',
'../common/stylesheets/geshi-php.css',
'../common/stylesheets/bluespice.css',
'../common/stylesheets/tables.css',
'../common/stylesheets/fonts.css',
'../common/stylesheets/mediawiki.action.history.diff.css',
//'../common/stylesheets/debug.css',
'../common/fonts/DejaVuSans.ttf',
'../common/fonts/DejaVuSans-Bold.ttf',
'../common/fonts/DejaVuSans-Oblique.ttf',
'../common/fonts/DejaVuSans-BoldOblique.ttf',
'../common/fonts/DejaVuSansMono.ttf',
'../common/fonts/DejaVuSansMono-Bold.ttf',
'../common/fonts/DejaVuSansMono-Oblique.ttf',
'../common/fonts/DejaVuSansMono-BoldOblique.ttf'
),
'IMAGE' => array(
'images/bs-header.jpg', /* #ADAPT: */
'images/bs-page-background.png'
)
),
/**
* Here you can define messages for internationalization of your template.
*/
'messages' => array(
'en' => array(
'desc' => 'This is the default PDFTemplate of BlueSpice for single article export.',
'exportdate' => 'Export:',
'page' => 'Page ',
'of' => ' of ',
'disclaimer' => 'This document was created with BlueSpice'
),
'de' => array(
'desc' => 'Dies ist das Standard-PDFTemplate von BlueSpice für den Export einzelner Artikel.',
'exportdate' => 'Ausgabe:',
'page' => 'Seite ',
'of' => ' von ',
'disclaimer' => 'Dieses Dokument wurde erzeugt mit BlueSpice'),
'de-formal' => array(
'desc' => 'Dies ist das Standard-PDFTemplate von BlueSpice für den Export einzelner Artikel.',
'exportdate' => 'Ausgabe:',
'page' => 'Seite ',
'of' => ' von ',
'disclaimer' => 'Dieses Dokument wurde erzeugt mit BlueSpice'),
)
);