OPRO Japan Co., Ltd.

Transcription

1 OPRO Japan Co., Ltd. 6F, Shibashin-Mita Bldg., , Shiba, Minato-Ku, Tokyo, , Japan. Web: Tel Fax: Copyright OPRO Japan Co., Ltd All rights reserved.

2 Table of Contents 1. Introduction The Template Structure The Visualforce page element:... 2 a) Opportunity Based Multi-Contact Templates... 2 b) Account Based Multi-Order Templates... 2 c) Batch Invoice Templates Head Section Custom EM PDF Elements... 4 a) EmSettings Element... 4 b) EmMarginBox Element... 5 c) EmFont Element Other CSS Style Classes Report Bands Page Header Band Report Header Band Report Detail Section a) Column Header Band b) Data Band Report Footer Band Page Footer Band Custom Components EmLabel Component EmImage Component EmPageNumber Component Template Customization Illustrations How to Align the Report Footer to Bottom with Repeating Empty Rows How to Start the Report Detail Section at the Same Y-coordinate in All the Pages How to Have Report Footer Bound to Data Band How to Use Conditional Formatting How to Format a Date Field How to Format a Number Value How to Add a Label How to Add a New Column to Report Detail How to Use Auto Adjusted Data Bands How to Add a Custom Cover Page How to Add a Brochure How to Add a Column to a Static Table How to Change Fonts How to Change the Paper Size, Orientation How to Add Page Numbers Page Number Reset Continues Page Numbering How to Use Zeebra Styles Tables How to Show Emphasized Table Columns How to Change Your Template Background How to Change Your Table Background How to Group Labels How to Include Hyperlinks to Line Items Copyright OPRO Japan Co., Ltd All rights reserved. i

3 4.22. How to Merge the Order Form to the End of the Quotation How to Merge Batch Invoice to Group by Opportunity Copyright OPRO Japan Co., Ltd All rights reserved. ii

4 1. Introduction OPROARTS Apps Easy Merge PDF Unlimited Edition users enjoy the value added features of being able to add new customized templates and being able to freely modify and customize the existing templates as they wish and use them to generate merged sales documents. These customization features include formatting and changing the component layout, adding / removing additional template components and the ability to extract opportunity related customer object data without querying etc. This document describes how to customize an OPROARTS Apps Easy Merge PDF (EM PDF) template. EM PDF Template is basically a Visualforce page describing how to render a particular document. Please refer the Easy Merge PDF Customized Template Installation Guide to learn about how to retrieve a template for customization and install it back to use with the EM PDF Merge Wizard. It is recommended to read the Chapter 2: The template Structure of this document, before attempting any customization tasks. Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 1

5 2. The Template Structure Note: EM PDF Templates contain a head section and several report band sections within a Visualforce page element. These sections are described in detail in this chapter. All the illustrations shown in below, used name space prefix as c:. But your package templates contain prefix as OPROARTS004:. When you are customizing the templates, please follow your package templates code standards The Visualforce page element: There are two categories of templates provided with EM PDF. a) Opportunity based multi-contact templates. b) Account based multi-order templates. c) Batch invoice templates. a) Opportunity Based Multi-Contact Templates There are twelve free templates under this category. EM Standard Quotation EM Standard Order EM Standard Invoice EM Standard Delivery EM Professional Quotation EM Professional Order EM Professional Invoice EM Professional Delivery Source Listing Opportunity based multi-contact EM Elegant Quotation EM Elegant Order EM Elegant Invoice EM Elegant Deliver b) Account Based Multi-Order Templates There are three free templates under this category. EM Standard Multi Order Invoice EM Professional Multi Order Invoice EM Elegant Multi Order Invoice Source Listing Account based multi-order You need not change these values (Source Listing 2.1 and 2.2) when customizing the templates. Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 2

6 c) Batch Invoice Templates EM Batch Invoice allows you to merge multiple invoices in few clicks by selecting relevant opportunities using Salesforce search. You can select the required opportunities and generate the invoices in to a single PDF document or attach the batch generated PDF invoices in to respective opportunities separately. There are three free templates under this category. EM Standard Batch Invoice EM Professional Batch Invoice EM Elegant Batch Invoice 2.2. Head Section Head section contains two style elements: a) Style element for custom EM PDF elements (Source Listing 2.3 section A) b) Style element for other CSS style classes (Source Listing 2.3 section B) Source Listing 2.3 Head section style elements A B Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 3

7 Custom EM PDF Elements There are three custom elements used in the head section. a) emsettings Element b) emmarginbox Element c) emfont Element a) EmSettings Element This element is used to set the paper size, orientation and the margins of the output PDF document. Source Listing 2.4 emsettings element attributes Source Listing 2.4 will produce the Source Listing 2.5 rule effect in the output PDF. Source Listing 2.5 CSS syntax selector These settings will produce a PDF report (Figure 2.1) with A4 Portrait orientation having top, right, bottom and left margins of 45px, 45px, 45px and 30px respectively. Please refer to Table 2.1 for emsettings element details. Figure PDF output for the emsetting element configuration Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 4

8 Name Table 2.1 emsettings Element Details Type Description Default Value emparam String This is a necessary internal parameter. Do not remove this parameter when customizing the EM PDF Visualforce pages. margin String This is the margin around the page. Top, right, bottom and left margins are given in that order separated by a space. orientation String This is the paper orientation of the page. Supported values are 'portrait' and 'landscape' papersize String This is the paper size of the page. Some of the possible values are A5, A4, A3, B5, B4, Letter, Legal and Ledger 45px 45px 45px 30px portrait A4 b) EmMarginBox Element Margin boxes can be used to output repeating contents like page numbers, tag lines, theme graphics, etc in the PDF document. These will be printed outside of the page area. Source Listing 2.6 emmarginbox element attributes Source Listing 2.6 will produce the Source Listing 2.7 CSS margin box effect in the output PDF. Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 5

9 Source Listing 2.7 CSS syntax selector Figure PDF output for the emmarginbox element configuration You can use Source Listing 2.6 or 2.7 to get the same output, as shown in the figure 2.2. Please refer to Table 2.2 for emmarginbox element details. Table 2.2 emmarginbox Element Details Name Type Description Default Value emparam String This is a necessary internal parameter. Do not remove this parameter when customizing the EM PDF Visualforce pages. location String This is the location of CSS margin box. Supported values are 'left', 'center' and 'right'. bottomcenter style String This is the CSS style attributed to be applied to this margin box. text String This is the Content to be displayed in this margin box. This will be repeated in all the Pages. Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 6

10 c) EmFont Element The document-wide font and text color settings can be done using the emfont element. If you need to perform localized font settings for any particular Label element, you can do so by using CSS styles and classes in the selected element. Source Listing 2.8 emfont element attributes Source Listing 2.8 will produce the same effect as Source Listing 2.9. Source Listing 2.9 CSS syntax of body selector Note: As of this release, the fonts supported by Salesforce PDF rendering engine has been limited to the following: 1. Arial Unicode MS Only the normal style and normal weight is supported. 2. Times New Roman Supports italic style and bold weight too. 3. Courier Supports italic style and bold weight too. Please refer to Table 2.3 for emfont element details. Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 7

11 Table 2.3 emfont Element Details Name Type Description Default Value fontfamily String This is the name of the font family. This font will be used to render all the texts in the document. If you want a different font to be used to a particular text, use a styleclass or in-line CSS styles on the select component. Only the following font family names are supported: 1. Arial Unicode MS normal font-style normal font- weight 2. Times New Roman normal, italic font-styles normal, bold font-weights bolditalic combination 3. Courier normal, italic font-styles normal, bold font-weights bolditalic combination Times New Roman fontsize String This is the font size of the text. This font size will be used to render all the texts in the document. If you want a different font size to be used to a particular text, use a styleclass or an in-line CSS style on the selected component. fontstyle String This is the font style of the text. This font style will be used to render all the texts in the document. If you want a different font style to be used to a particular text, use a styleclass or an in-line CSS style on the selected component. Please refer the 'fontfamily' description above, to learn about supported font styles. fontweight String This is the font weight of the text. This font weight will be used to render all the texts in the document. If you want a different font weight to be used to a particular text, use a styleclass or an in-line CSS style on the selected component. Please refer the above 'fontfamily' description to learn about supported font weights. 12px normal normal style String This attribute is used to include additional CSS styles. textcolor String This is the color of the text. This color will be used when rendering all the texts in the document. Text color can be specified as a name (eg: red), an RGB black Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 8

12 Name Type Description Default Value value (eg: rgb(255,0,0) or a Hex value(#ff0000). If you want a different color to be used in a particular text, use a styleclass or an in-line CSS style on the selected component. Note: It is mandatory to have the above three custom elements within a <style> element in order to apply the settings correctly in the rendered output PDF. Users can place their CSS style classes within a second <style> element in the <head> section Other CSS Style Classes Style classes names defined in the report elements can be declared in this section. Source Listing 2.10 CSS style classes Note: Certain report bands have style classes reserved in their respective name by default. Any styles defined in these classes will reflect in the appearance of the corresponding report band. The default style class names for the bands are:.empageheader,.emreportheader,.emcolumnheader,.emdataband,.emreportfooter and.empagefooter. Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 9

13 2.3. Report Bands EM PDF provides seven report bands to design your templates in a structured way. These bands will occupy the entire width of the paper sans the left and right margins and they cannot be re-sized horizontally. Also each band will be rendered with calculated top values. The user only needs to specify the height of each band in the EM PDF Visualforce page. Figure 2.3 Report band structure Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 10

14 Page Header Band Page Header band will be repeated on all the pages at the top of each page immediately after the top margin box. User can specify the height using the height attribute. Please refer to Table 2.4 for empageheader details. Source Listing 2.11 Page header band Page Header Figure PDF output for the empageheader section Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 11

15 Table 2.4 empageheader element details Name Type Description Default Value emparam String This is a necessary internal parameter. Do not remove this parameter when customizing the EM PDF Visualforce pages. height String This is the height of the Page Header section. 240px style String CSS style attributes to be applied to the Page Header section Report Header Band Report Header band will be printed once per report immediately after the page header in the first page. User can specify the height using the height attribute. Please refer to Table 2.5 for empageheader details. Source Listing 2.12 Report Header Band Contents you wish to print only in the first page Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 12

16 Report Header Figure PDF output for the emreportheader section Table 2.5 emreportheader element details Name Type Description Default Value emparam String This is a necessary internal parameter. Do not remove this parameter when customizing the EM PDF Visualforce pages. height String This is the height of the Report Header section. 240px style String CSS style attributes to be applied to the Report Header. Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 13

17 Report Detail Section Report Detail section acts as the container for Column Header and Data Bands. Please refer to Table 2.6 for emreportdetail details. Source Listing 2.13 Report detail section Column Header Data Band Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 14

18 Table 2.6 emreportdetail element details Name Type Description Default Value columns String This is the number of columns in the data table. columnswidth String A comma-separated list of the widths applied to each column. emparam String This is deprecated. startpos String When startpos is set to 'fixed', Report Detail section will start at the same top position on every page. When startpos is set to 'auto', in the second and consecutive pages, the Report Detail section will start immediately after the Page Header Section. Note: There are two bands in the report detail section. a) Column header band b) Data band auto Since the Report Header section is not printed in the second and consequent pages, user can choose to start the Report Detail at the same position as in the first page or shift upwards and use the Report Header space from the second page onwards. This option is available via the startpos attribute. This feature is illustrated in section 4. Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 15

19 a) Column Header Band This band is used to define the column captions of the data table. It will be repeated in all the pages of the report. Please refer to Table 2.7 for emcolumnheader details. Source Listing 2.14 Column Header Band Column Header Figure 2.7- PDF output for the emcolumnheader section Table 2.7 emcolumnheader element details Name Type Description Default Value emparam String This is a necessary internal parameter. Do not remove this parameter when customizing the EM PDF Visualforce pages. height String This is the height of the Column Header section. 30px style String CSS style attributes to be applied to the Column Header section. Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 16

20 b) Data Band This band will be repeated until the assigned dataset is exhausted. Please refer to Table 2.8 for emdataband details. Source Listing 2.15 Data Band Repeating Data Rows Data Bands Figure PDF output for the emdataband section Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 17

21 Table 2.8 emdataband details Name Type Description Default Value autoadjust Boolean When autoadjusted is true, the Data Band will automatically adjust its height to fit the column having the maximum height. Value given in the height attribute will be used as the minimum height. false When this attribute is set to 'false', the Data Band will have a fixed height given in the 'height' attribute. border String This is used to specify the border style and border color separated by a space. solid black borderwidth String This is the width of the border. If a single value is specified this value will be used for right, bottom and left borders. 0.5px If all four border widths are specified with space delimited values, the top border width will be assumed 0px to render the data table grid correctly. columnclasses String A comma-separated list of one or more classes associated with the table's columns, used primarily to designate which CSS styles are applied when using an external CSS stylesheet. If more than one class is specified, the classes are applied in a repeating fashion to all columns. For example, if you specify columnclasses='classa, classb', then the first column is styled with classa, the second column is styled with classb, the third column is styled with classa, the Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 18

22 Name Type Description Default Value fourth column is styled with classb, and so on. dataset String The Salesforce Object associated with the Data Band. OpportunityLineItem Currently supporting only OpportunityLineItem. emparam String This is a necessary internal parameter. Do not remove this parameter when customizing the EM PDF Visualforce pages. height String This is the height of the Data Band. 30px rowclasses String Comma-separated pair of classes associated with the table's odd and even rows, used primarily to designate which CSS styles are applied when using external CSS stylesheet. style String CSS style attributes to be applied to the Data Band. Note1: The autoadjust attribute defines whether the Data Band height is automatically adjusted to fit the content. This feature is illustrated in section 4.9. Note 2: When the Data Band is autoadjusted the Page Footer band will not be rendered. If you need to repeat any content at the bottom of the page, use emmarginbox element instead. Note3: When the Data Band is autoadjusted, startpos attribute of ReportDetail section will remain as fixed. Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 19

23 Report Footer Band Report Footer band will be printed once per report immediately after the Report Detail section in the last page. User can specify the height using the height attribute. Please refer to Table 2.9 for emreportfooter details. Source Listing 2.16 Report footer band Contents you wish to print only in the last Report Footer Figure PDF output for the emreportfooter section Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 20

24 Table 2.9 emreportfooter details Name Type Description Default Value bind Boolean When this parameter is set to 'true' the Report Footer section will not be left isolated on a new page. It will always be printed with at least the last row of the Data Band. true emparam String This is a necessary internal parameter. Do not remove this parameter when customizing the EM PDF Visualforce pages. height String This is the height of the Report Footer. 170px startpos String When startpos is set to 'bottom', Report Footer section will start after repeating empty data rows to fill the Report Detail section. When startpos is set to 'auto', the Report Footer section will start immediately after the last Data Band. bottom style String CSS style attributes to be applied to the Report Footer. Note 1: The bind feature is illustrated in section 4.3. Note 2: The startpos attribute controls the Report Footer placement. This feature is illustrated in section 4.1. Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 21

25 Page Footer Band Page Footer band will be repeated on all the pages at the bottom of each page immediately before the bottom margin box. User can specify the height using the height attribute. Please refer to Table 2.10 for empagefooter details. Source Listing 2.17 Page footer band Contents you wish to print at the bottom of all the pages Page Footer Figure PDF output for the empagefooter section Table 2.10 empagefooter details Name Type Description Default Value emparam String This is a necessary internal parameter. Do not remove this parameter when customizing the EM PDF Visualforce pages. height String This is the height of the Page Footer. 0px style String CSS style attributes to be applied to the Page Footer. Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 22

26 3. Custom Components This chapter describes the custom components in detail EmLabel Component In template we use emlabel to display information in different formats. emlable component can be use to display both static and dynamic data using its content attribute. Also you can use attributes like type, format to display decimal, currency, date, and time values. Please refer to Table 3.1 for emlabel details. Source Listing 3.1 emlabel component Figure PDF output for the emlabel element configuration Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 23

27 Note: In order to support organization locale, emlable component s type attribute value must be set as sfdate or sfcurrency according to the data type. Other wise it will use Salesforce site hosted environment locale. Please refer to Source Listing 3.1 and 3.2 to observe the usage difference. Source Listing 3.2 emlabel component organization locale usage Table 3.1 emlable details Name Type Description Default Value bottom String This is the bottom position of the component. condition Boolean The condition to be checked for using 'truecontent', 'truestyleclass','truestyle' and 'trueformat' attributes. Supports apex logical expressions given as condition='#{(logical_test)}'. E.g. #{(Quantity < 1)} content Object This is the value of the label when the 'type' attribute is 'string', 'hyperlink' or 'datetime'. Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 24

28 Name Type Description Default Value display String This has the same behaviour as the CSS position attribute. block emparam String This is a necessary internal parameter. Do not remove this parameter when customizing EM PDF Visualforce template pages. figure Double This is the value to be used when the 'type' attribute is 'Number' or 'SFCURRENCY'. format String Format string used to format the date-time and double values. Datetime patterns supported by Java SimpleDateFormat class can be used as the format string. For double type, the supported values are 'currency', 'percent' and 'integer'. height String This is the height of the component. left String This is the left position of the component. position String This has the same behaviour as the CSS position attribute. relative right String This is the right position of the component. showaslink Boolean Setting this to 'true' will show the anchor as a link. Other wise the anchor will appear as a normal text. false style String CSS style attributes to be applied to the component. styleclass String This is the name of the CSS style class to be applied to the component. top String This is the top position of the component. Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 25

29 Name Type Description Default Value truecontent Object This is the value to be used when the 'type' attribute is 'string', 'hyperlink' or 'datetime' and the 'condition' is evaluated to be true. truefigure Double This is the 'Number' or 'SFCURRENCY' value to be used when the 'condition' is evaluated to be true. trueformat String Format string used to format the 'DateTime' and 'Number' when the 'condition' is evaluated to be true. Format patterns supported by Java MessageFormat class can be used. truestyle String CSS style attributes to be applied to the component when the 'condition' is evaluated to be true. truestyleclass String This is the name of the CSS style class to be applied to the component when the 'condition' is evaluated to be true. type String This is the type of the Label. Supported values are 'string', 'hyperlink', 'sfcurrency', 'sfdate', 'number' and 'datetime' String urlpath String This is the path of the anchor URL. The final URL will be formed by using 'urlprefix+urlpath+urlsuffix' attribute values. urlprefix String This is the prefix of the the anchor URL. The final URL will be formed by using 'urlprefix+urlpath+urlsuffix' attribute values. urlsuffix String This is the suffix appended to the end of anchor URL. The final URL will be formed by using 'urlprefix+urlpath+urlsuffix' Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 26

30 Name Type Description Default Value attribute values. width String This is the width of the component. 100% EmImage Component This component is used to add an image (Logo) to the template (Source Listing 3.3). EM PDF provides a separate tab labeled, Easy Merge Setting, to define a logo and url that can be used in the templates. Therefore, src attribute and href attribute get the image source and url values form Easy Merge Settings. In figure 3.2 you can see hyperlinked logo image. Source Listing 3.3 emimage component Figure PDF output for the emimage element configuration Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 27

31 Table 3.2 emimage details Name Type Description Default Value bottom String This is the bottom position of the component. height String This is the height of the component. 60px href String URL of the target location. left String This is the left position of the component. 0px position String This has the same behaviour as the CSS position attribute. fixed right String This is the right position of the component. src String Link to the image source. style String CSS style attributes to be applied to the component. styleclass String This is the name of the CSS style class to be applied to the component. top String This is the top position of the component. 5px width String This is the width of the component. 60px Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 28

32 3.3. EmPageNumber Component EmPageNumber component of EM PDF has a unique feature that supports resettable numbering cycles. You can reset the page number counting for each recipient. This component can be inserted after databand open tag and it will be displayed overlapping the margin box. Sample illustration is provided in Section Note: As seen in Source Listing 3.4, location attribute is used to position the page number. location attribute can take header or footer values. Style can be set using style attribute. empagenumber style attribute has priority over marginbox style attribute. Note: Please refer to Table 3.3 for attribute details. Page number re-setting option not applicable with account based multi-order templates. Page number re-setting explain under section 4.15 Source Listing 3.4 pagenumber component Table 3.3 pagenumber details Name Type Description Default Value id String An identifier that allows the component to be referenced by other components in the page. location String This indicates whether the page number is appeared in the top margin or the bottom margin area. Possible values are 'header' and 'footer'. emparam String This is a necessary internal parameter. Do not remove this parameter when customizing the EM PDF Visualforce pages. Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 29

33 4. Template Customization Illustrations This chapter illustrates some of the template customizations. Also you can get PDF output of following customizations from How to Align the Report Footer to Bottom with Repeating Empty Rows Note: This can be done using emreportfooter component attribute startpos. You have to set startpos attribute value to bottom. You can refer to Source Listing 4.1 to see the source code modification. Modification effect is shown in Figure 4.1. You can set startpos attribute value to auto and output will change as Figure 4.2 Source Listing 4.1 startpos attribute value modified Empty Rows Figure 4.1 Report footer aligned to bottom Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 30

34 4.2. How to Start the Report Detail Section at the Same Y-coordinate in All the Pages You can get this effect from emreportdetail component, startpos attribute. You have to set the startpos attribute value to fix. Please refer Source Listing 4.2 and Figure 4.3 for more detail. Figure 4.2 Report footer not aligned to bottom Source Listing 4.2 startpos attribute value modified Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 31

35 Figure 4.3 Report detail section start in same position in every page 4.3. How to Have Report Footer Bound to Data Band You have to set the emreportfooter bind attribute value to true to get this effect. Please refer Source Listing 4.3 and Figure 4.4 for more details. Source Listing 4.3 bind attribute value modified Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 32

36 Figure 4.4 Report footer bound to data band Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 33

37 4.4. How to Use Conditional Formatting We can use emlabel condition attribute to specify the condition. You have to specify the value you want to print in the true case in truecontent attribute. Please refer Source Listing 4.4 and Figure 4.5 for more details. Source Listing 4.4 Conditional formatting applied Figure 4.5 PDF output of conditional formatting Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 34

38 4.5. How to Format a Date Field Note: You can format a Date field using the format attribute of the emlabel. The format attribute values should be in Java SimpleDateFormat class (Source Listing 4.5). You can see the formatted date field out put in Figure 4.6. To use emlable as date field, emlabel type attribute value must be either datetime or sfdate. Source Listing 4.5 formatted a date field Figure PDF output for the formatted date field Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 35

39 4.6. How to Format a Number Value Note: You can format a Number field using the format attribute of the emlabel. The format attribute supports values are 'currency', 'percent' and 'integer'. You can see the formatted number field out put in Figure 4.7. To use emlable as number field, emlabel type attribute value must be set as either number or sfcurrency. (Source Listing 4.6) Source Listing 4.6 Formatted number value Figure PDF output for the formatted number value 4.7. How to Add a Label We have to use emlabel component to add a label to the template (Source Listing 4.7). You can adjust the height, position, width, etc as your preferences using attributes. Please refer to section 3.1 for more details. Please observe the different of the out put in figure 4.8 and 4.9. Figure 4.8 Default PDF output Source Listing 4.7 Added a new label Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 36

40 Figure 4.9 PDF output of the added label 4.8. How to Add a New Column to Report Detail You can add a column to Report Detail using <apex:column> tag. As shown in Source Listing 4.8, you can set new column inside <apex:datatable>. Also you must set an appropriate column width value to emdataband columnwidth attribute. Please observe the different between figure 4.10 and Figure 4.10 Default PDF output Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 37

41 Source Listing 4.8 Added a new column to Report Detail Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 38

42 Figure 4.11 PDF output of the added column 4.9. How to Use Auto Adjusted Data Bands We can hide data band details and make them to fixed size using emdataband autoadjust attribute (Source Listing 4.10).Default value of this attribute is false. Please observe the difference between figure 4.12 and Figure 4.12 Default PDF output Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 39

43 Source Listing 4.10 Auto adjusted data band Figure 4.13 PDF output of the adjusted data bands How to Add a Custom Cover Page This can be easily done with a few modifications to the template. Please do step 1 to 4 in section In the 5th step, include the code in Source Listing 4.11 between <apex:repeat> and <c:emreportheader> tags. Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 40

44 Source Listing 4.11 Added a custom cover page Figure 4.14 Cover page for a quotation Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 41

45 4.11. How to Add a Brochure You can include a brochure page using <apex:composition > tag. Please do step 1 to 4 in section In the 5th step, include the code in Source Listing 4.12 between <c:emreportfooter> and <apex:repeat> tags. Source Listing 4.12 Added a brochure page Figure 4.15 Footer page for a quotation Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 42

46 4.12. How to Add a Column to a Static Table Static table and columns can be created using <apex:outputpanel> tag (Source Listing 4.13). Column contents can be inserted using emlable component. Please refer to figure 4.15 to see the output. Source Listing 4.13 Column added to static table Figure 4.15 PDF output of the inserted column Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 43

47 4.13. How to Change Fonts <emfont> component can use to change the font family,size,color,etc using fontfamily, fontsize, textcolor attributes etc. Please refer to figure 4.16 and you can see output appeared in Courier font. Source Listing 4.14 Changed fontfamily Figure 4.16 PDF output of changed font Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 44

48 4.14. How to Change the Paper Size, Orientation You can use <emsetting> component attributes papersize and orientation to change the paper size and orientation (Source Listing 4.15). You can see output appeared in landscape mode in the figure Source Listing 4.15 Orientation is changed Figure 4.17 PDF output of changed font Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 45

49 4.15. How to Add Page Numbers You have flexibility to customize the page number to reset for each user id or continue with number of pages Page Number Reset This can be done by using empagenumber component and marginbox component. You can set the page numbers using <marginbox> component attribute text (Source Listing 4.16). Also you can adjust position of the page number using location attribute. You must place the empagenumber (Source Listing 4.17) component after databand component open tag. If you want to apply a style to page number, specify style values in empagenumber component. Please refer to figure 4.18 to see the page number modification result. Source Listing 4.16 Page number added Source Listing 4.17 Added style to page number Page number of recipient 1 Recipient 2 Figure 4.18 Page number added to the template footer-center location Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 46

50 Continues Page Numbering This can be done in few steps. You have to change text attribute value of <marginbox> component to 'page ' counter(page) ' / ' counter(pages)". Then remove or comment <empagenumber> component (Source Listing 4.17) Specify any styles inside <marginbox> component. Please refer to Source Listing 4.18 and Figure Source Listing 4.18 Page number added Page number of recipient 1 Recipient 2 Figure 4.19 Page number added to the template bottom-center location Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 47

51 4.16. How to Use Zeebra Styles Tables Note: This can be done using emdataband component rowclasses or columnclasses attribute. You can specify any color to odd and even rows, coloumns using oddrow, evenrow styles. Please refer to figure 4.20 to see the PDF output. Oppose to Source Listing 4.20, you can use columnclasses attribute to apply Zebra style to columns by adding oddcolumn and evencolumn. Source Listing 4.19 Zeebra style applied to table rows Source Listing 4.20 Zeebra style color applied using style classes Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 48

52 Figure 4.20 Zebra style applied for table rows Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 49

53 4.17. How to Show Emphasized Table Columns We can specifically height table columns. For an example we can change color of a column. This can be done using columnclasses attribute. We can set a style to the attribute. You can see the modifications done in Source Listing 4.21 and In this example we use oddcolumn style class. Please refer to figure 4.21 to see the PDF output. Usage Source Listing 4.21 Emphasized table column Source Listing 4.22 Style class used in columnclasses Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 50

54 4.18. How to Change Your Template Background You can use CSS style body selector to set a color to template background (Source Listing 4.23). Figure 4.21 Emphasized column Source Listing 4.23 Template background color changed using style classes Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 51

55 Figure 4.22 Background color applied to template Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 52

56 4.19. How to Change Your Table Background You can use CSS style classes oddrow, evenrow pair or oddcolumn, evencolumn pair to set a color to table background. For an example, we can set same color to both oddrow and evenrow style classes as shown in Source Listing Source Listing 4.24 Table color applied using style classes Figure 4.23 Background color applied to table Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 53

57 4.20. How to Group Labels You can group labels using <apex:outputpanel> tag. In the Source Listing 4.25 you can see three groups. Source Listing 4.25 Labels grouped Group2 Group1 Group3 Figure 4.24 PDF output of the labels groped Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 54

58 4.21. How to Include Hyperlinks to Line Items This is simple and only one step. Add the attributes given in Source Listing 4.26 to the emlabel of the desired data table column. type="hyperlink" urlprefix=" urlsuffix="/index.html" Please refer to Source Listing 4.27 to see the usage. Source Listing 4.26 Including hyperlinks to line items Source Listing 4.27 Including hyperlinks to line items <apex:column styleclass="d_tbl2coldatacommon" style="{!columnstyle}"> <c:emlabel type="hyperlink" urlprefix= urlsuffix="/index.html" emparam="{!labelparams}" content="{!item.pricebookentry.product2.name}" /> </apex:column> Figure 4.25 Hyperlinks enabled to line items Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 55

59 4.22. How to Merge the Order Form to the End of the Quotation This can be easily done with a few simple modifications to the quotation template and order template. In the quotation template, add the codes shown in Source Listing 4.28 and 4.29 at the very end of the page. 1. Set PageHeader render false. Source Listing 4.28 Set PageHeader render false <c:empageheader rendered="false" height="240px" > 2. Increase the Report Header height to accommodate the Page Header contents. Source Listing 4.29 Increase the report header height <c:emreportheader height="430px" emparam="{!rhparams}"> 3. Then, add the Page Header height to Report Header outer panel top positions as shown in Source Listing Source Listing 4.30 Modify Report Header outer panel top positions <apex:outputpanel styleclass="labelpanel" style="left:0px;top:240px;width:45%;height:130px"> <apex:outputpanel styleclass="labelpanel" style="right:0px;top:240px;width:45%;height:128px"> <apex:outputpanel styleclass="labelpanel" style="left:0px;top:345px;width:100%;height:36px;text -align:center;"> 4. Remove the Page Header content and insert them in to Report Header section. 5. As shown in the Source Listing 4.31, add the following two lines between </c:emreportfooter> and </apex:repeat> tags of the quotation template. Source Listing 4.31 Modify order template <div style="page-break-after:always;" /> <apex:composition template="pdfelegantorder"> </apex:composition> 6. In the order template, repeat step 1 to 4 explained with quotation template. Then remove the <apex:repeat> tag placed above to the <c:emreportheader> tag. Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 56

60 7. Set the emparam attribute value as {!rfparams}sp0: in Report Footer. Please see figure 4.26 for a sample output PDF document. Figure 4.26 Quotation and order form merged together Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 57

61 4.23. How to Merge Batch Invoice to Group by Opportunity EM PDF batch invoice templates provide two options called group by opportunity and group by account. Batch invoice templates are initially grouped to opportunity. You can simply click the EM Batch Invoice button to merge invoice to each opportunity associate with each account. This option control by <apex:repeat> tag value attribute. Default value for the value attribute is {!reportlist}. Please refer to Source Listing Please observe PDF output Batch Invoice Group by Opportunity from: Source Listing 4.32 Batch invoice for group by opportunity You can merge batch invoice in group by account mode. This will merge invoices in account wise. This can be activate using <apex:repeat> tag value attribute. Set the value attribute to {!reportlistgroupedbyaccount}. Please refer to Source Listing Please observe PDF output Batch Invoice Group by Account from: Source Listing 4.33 Batch invoice for group by account Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 58

62 OPRO Japan Co., Ltd. Innovative Reporting Solutions Provider for the Enterprise. Copyright OPRO Japan Co., Ltd 2010 All rights reserved. 59