+ Start a Discussion
Abhijeet Purohit01Abhijeet Purohit01 

How to change font-family to arial when the vf page is rendered as PDF?

I have rendered a vf page as pdf. I am unable to change the fon-family to arial.

 

I have used

<style type=text/css>

p

{

font-family:"Arial Unicode MS";

font-size:14pt;

}

span

{

font-family:"Arial Unicode MS";

font-size:8pt;

}

h1

{

font-family:"Arial Unicode MS";

font-size:9pt;

}

</style>

<p>some text1</p>

<span>some text2</span>

<h1>some text3</h1>

--- - --  - - -- -  -

- - - - - - - --

But the problem here is am getting a new line everytime I use <p> and <h1> tag.

I dno't want this new line to occur.

Also I tried using <h2>,<h3>,.. , <pre>, <b> and

display:inline;

 

 

How to get the font family as arial without a new line. Also how to make the text bold?

I have tried <b> tag and

font-family:"Arial Unicode MS Bold";

 

Its not working.

 

 

Pls help.

path2cloudpath2cloud

One possible way fo doing this is use a table format

 

<apex:page renderAs="pdf" >
<style type="text/css">
p
{
font-family:"Arial Unicode MS";
font-size:14pt;
}
span
{
font-family:"Arial Unicode MS";
font-size:8pt;
}
h1
{
font-family:"Arial Unicode MS";
font-size:9pt;
}
</style>

<table border="0">
<tr>
<td>
<p>some text1</p>
</td>
<td>
<span>some text2</span>
</td>
<td>
<h1>some text3</h1>
</td>
</tr>
</table>
</apex:page>

sornasorna

Don't use embedded styles if you are rendering as pdf...instead use a css file from static resource...

Also render as pdf in vf page does not support many fonts... but i m sure arial should be supported...

Abhijeet Purohit01Abhijeet Purohit01

I have used <table> tag in the code.


My problem is when I render vf page as PDF the text is getting displayed in some other font-family. I want all the text to be displayed in arial and also in bold where ever needed.

I have used <font> tag to make the text display in arial. It did not work so used <style> tag.

I am getting all the text in arial but with new lines.... Please see the code below:

 

 

<apex:page controller="InvoiceSummary"  action="{!QueryInvoices}" renderas="pdf" showHeader="false">
<html>
<head>
<style type="text/css">
h1{

  font-size:14pt;
  font-family:"Arial Unicode MS";
}
pre
{

 background-color:#BCD2EE;
 font-size:9pt;
  font-family:"Arial Unicode MS";
}

h2
{
 font-style:"regular";
 font-size:8pt;
  font-family:"Arial Unicode MS";
}
span{
 display:inline;
  font-size:8pt;
  font-family:"Arial Unicode MS";
}
 </style>
 </head>
 <body>
    <apex:form >
      
     
        <apex:pageBlock >
      
                <div align="right">
                    <apex:image width="45%" height="40%" url="{!$Resource.CompanyLogo1}"/>
                </div>
       <table width="100%">
            <tr>
                <td width="21%"></td>
                <td width="17%"></td>
                <td width="38%"><h1 display="inline">TAX INVOICE</h1></td>
                <td width="20%"><h2 display="inline">ORIGINAL FOR BUYER</h2></td>
            </tr>
        </table>
    
   
         <table width="100%" >
                    <tr>
                        <td colSpan="2" width="100%">&nbsp;
                            <b><pre>▼ General Information </pre></b>
                        </td>
                    </tr>   
        </table>
         <table width="100%" BORDER="0" CELLPADDING="0" CELLSPACING="0" RULES="ROWS" >
         <tr>
         <td Width="25%"><span>Invoice No.</span></td>
<!--         <td Width="28%">{!listInvoice.Name}</td>-->
         <td Width="25%"><span>Payment Terms</span></td>
<!--         <td Width="25%">{!cAnyDetail.Case_Subject__c}</td>-->
         </tr>
          <tr>
        <td width="25%"><span>Invoice Date</span></td>
<!--         <td Width="28%">{!cAnyDetail.Status__c }</td>-->
         <td Width="25%"><span>Freight Terms</span></td>
<!--         <td Width="25%">{!cAnyDetail.Case_Subject__c}</td>-->
         </tr>
         </table>
<!--        </apex:pageBlock>
      
        <apex:pageBlock >-->
                <table width="100%">        
                    <tr>
                        <td colSpan="2">&nbsp;
                            <pre>▼ Contact Information  </pre>
                        </td>
                    </tr>   
                </table>
      <table width="100%" BORDER="0" CELLPADDING="0" CELLSPACING="0" RULES="ROWS" >
         <tr>
         <td Width="25%"><span>Prepared By</span></td>
<!--         <td Width="28%">{!cAnyDetail.Account_Name__c}</td>-->
         <td Width="25%"><span>Customer Name</span></td>
<!--         <td Width="25%">{!cAnyDetail.Case_Subject__c}</td>-->
         </tr>
         <tr>
         <td width="25%"><span>Email</span></td>
<!--         <td Width="28%">{!cAnyDetail.Status__c }</td>-->
         <td Width="25%"><span>Contact Name</span></td>
<!--         <td Width="25%">{!cAnyDetail.Case_Subject__c}</td>-->
         </tr>
         <tr>
         <td width="25%"><span>Mobile</span></td>
<!--         <td Width="28%">{!cAnyDetail.Status__c }</td>-->
         <td Width="25%"><span>Contact Phone</span></td>
<!--         <td Width="25%">{!cAnyDetail.Case_Subject__c}</td>-->
         </tr>
         </table>   
        </apex:pageBlock>
      
        <apex:pageBlock >
                <table width="100%">        
                    <tr>
                        <td colSpan="2">&nbsp;
                            <pre>▼ Address Information</pre>
                        </td>
                    </tr>   
                </table>
       
        <table width="100%" BORDER="0" CELLPADDING="0" CELLSPACING="0" RULES="ROWS" >
         <tr>
         <td Width="25%"><span>Billing Address</span></td>
<!--         <td Width="28%">{!cAnyDetail.Account_Name__c}</td>-->
         <td Width="25%"><span>Shipping Address</span></td>
<!--         <td Width="25%">{!cAnyDetail.Case_Subject__c}</td>-->
         </tr>
         </table>   
        </apex:pageBlock>
      
                <apex:pageBlock >
                <table  width="100%">        
                    <tr>
                        <td colSpan="2">&nbsp;
                            <pre>▼ Other Details</pre>
                        </td>
                    </tr>   
                </table>
        
        <table width="100%" BORDER="0" CELLPADDING="0" CELLSPACING="0" RULES="ROWS" >
         <tr>
         <td Width="25%"><span>Algypug VAT / TIN</span></td>
<!--         <td Width="28%">{!cAnyDetail.Account_Name__c}</td>-->
         <td Width="25%"><span>Buyer ECC</span></td>
<!--         <td Width="25%">{!cAnyDetail.Case_Subject__c}</td>-->
         </tr>
         <tr>
         <td width="25%"><span>Algypug ECC</span></td>
<!--         <td Width="28%">{!cAnyDetail.Status__c }</td>-->
         <td Width="25%"><span>Buyer CST</span></td>
<!--         <td Width="25%">{!cAnyDetail.Case_Subject__c}</td>-->
         </tr>
         <tr>
         <td width="25%"><span>CETSH#, Range</span></td>
<!--         <td Width="28%">{!cAnyDetail.Status__c }</td>-->
         <td Width="25%"><span>Buyer VAT / TIN</span></td>
<!--         <td Width="25%">{!cAnyDetail.Case_Subject__c}</td>-->
         </tr>
         </table>   
        </apex:pageBlock>

<apex:pageBlock >
<table width="100%" BORDER="0" FRAME="BOX" Style="background-color:#767676;">
     <tr>
     <th  width="25%" color="#ffffff" > <span>Description of Goods</span></th>
     <th width="15%"><span>PO No.</span></th>
     <th  width="15%"><span>Unit Qty</span></th>
     <th width="15%"><span>Rate (INR)</span></th>
     <th width="15%"><span>Unit</span></th>
     <th width="15%"><span>Amount (INR)</span></th>
     </tr>
    </table>
<!--  <apex:repeat value="{!rcAnyItems }" var="rcAny" >-->
  <table width="100%" BORDER="0" CELLPADDING="0" CELLSPACING="0" FRAME="BOX">
  <tr>
  <td width="25%">
<!--  {!rcAny.Name}-->
  </td>
  <td width="15%">
<!--  {!rcAny.Case_Analysis__r.Name}-->
  </td>
  <td width="15%">
<!--  {!rcAny.X5_Why_Analysis__r.Name}-->
  </td>
  <td width="15%">
<!--  {!rcAny.Selected__c}-->
  </td>
    <td width="15%">
<!--  {!rcAny.Selected__c}-->
  </td>
    <td width="15%">
<!--  {!rcAny.Selected__c}-->
  </td>
  </tr>
  </table>
<!--  </Apex:repeat>   -->
  </apex:pageBlock>   

  <apex:pageBlock >
                <table  width="100%">        
                    <tr>
                        <td colSpan="2">&nbsp;
                           <pre>▼ Taxes and Totals </pre>
                        </td>
                    </tr>   
                </table>
    
        <table width="100%" BORDER="0" CELLPADDING="0" CELLSPACING="0" RULES="ROWS" >
         <tr>
         <td Width="25%" ><span>Output Exercise Duty</span></td>
<!--         <td Width="28%">{!cAnyDetail.Account_Name__c}</td>-->
<!--         <td Width="25%">{!cAnyDetail.Case_Subject__c}</td>-->
         <td Width="25%"></td>
         <td Width="25%" ><b><span>Basic Invoice Value</span></b></td>
<!--         <td Width="25%">{!cAnyDetail.Case_Subject__c}</td>-->
         </tr>
                  <tr>
         <td Width="25%" ><span>Education CESS on ED</span></td>
<!--         <td Width="28%">{!cAnyDetail.Account_Name__c}</td>-->
<!--         <td Width="25%">{!cAnyDetail.Case_Subject__c}</td>-->
         <td Width="25%"></td>
         <td Width="25%"><span>Packing Charges</span></td>
<!--         <td Width="25%">{!cAnyDetail.Case_Subject__c}</td>-->
         </tr>
         <tr>
         <td Width="25%"><span>SEC and Higher Education on ED</span></td>
<!--         <td Width="28%">{!cAnyDetail.Account_Name__c}</td>-->
<!--         <td Width="25%">{!cAnyDetail.Case_Subject__c}</td>-->
         <td Width="25%"></td>
         <td Width="25%"><span>Total Taxes</span></td>
<!--         <td Width="25%">{!cAnyDetail.Case_Subject__c}</td>-->
         </tr>
         <tr>
         <td Width="25%"><span>Output VAT / CST</span></td>
<!--         <td Width="28%">{!cAnyDetail.Account_Name__c}</td>-->
<!--         <td Width="25%">{!cAnyDetail.Case_Subject__c}</td>-->
         <td Width="25%"></td>
         <td Width="25%"><span>Freight Charges</span></td>
<!--         <td Width="25%">{!cAnyDetail.Case_Subject__c}</td>-->
         </tr>
         <tr>
         <td Width="25%"></td>
<!--         <td Width="28%">{!cAnyDetail.Account_Name__c}</td>-->
<!--         <td Width="25%">{!cAnyDetail.Case_Subject__c}</td>-->
         <td Width="25%"></td>
         <td Width="25%"><span><b>Gross Inovice Value</b></span></td>
<!--         <td Width="25%">{!cAnyDetail.Case_Subject__c}</td>-->
         </tr>
         </table>   
         <br/>
         <br/>
         <div align="right">
              <span>Authorised Signatory</span>
         </div>
         <div align="right">     
              <apex:image width="100%" height="40%" url="{!$Resource.Footer1}"/>
        </div>
        <div style="page-break-before:always;"/>
        
        </apex:pageBlock>
        
    </apex:form>
    </body>
    </html>
    </apex:page>