• Jim Thompson
  • NEWBIE
  • 0 Points
  • Member since 2014


  • Chatter
    Feed
  • 0
    Best Answers
  • 0
    Likes Received
  • 0
    Likes Given
  • 2
    Questions
  • 5
    Replies
I have a feature we are building which allows our users to input some elements onto a custom object which will be used within a Visualforce component to generate a PDF attachment to an email which comes from a Visualforce HTML email template:
<messaging:emailTemplate subject="National Account Program v9" recipientType="User" relatedToType="gvp__National_Email__c">
    <messaging:htmlEmailBody >
        <apex:image url="https://c.na7.content.force.com/servlet/servlet.ImageServer?id=015A0000000kVmM&oid=00DA0000000KItS&lastMod=1297286110000"/>
        <br/>
        <p>Here is a test PDF of the new National Account Program Announcement (should be attached)</p>
    </messaging:htmlEmailBody>
    <messaging:attachment renderas="pdf" filename="{!relatedTo.Name}-Authorizations-9.pdf">
    <c:NAProgramEmail />
    </messaging:attachment>
</messaging:emailTemplate>
I can use the "Send Test and Verify Merge Fields" button on the template to send myself an email, and the attachment looks pretty much the way I want it to, with CSS, fullscreen background, etc. This is what it looks like:

User-added image

However I also want my users to be able to "Preview" the PDF while they are inputting the elements. To test this I made a simple VF page that embeds the same Visualforce component but as you will see below, it looks entirely different. Does this not use the same PDF renderer? Are there tricks to get the same VF component to look the same in both scenarios?
<apex:page renderAs="pdf">
    <c:NAProgramEmail />
</apex:page>
And when I view this VF page it looks like this:
User-added image

Here is a snippet of the Visualforce component, which contains both <style> parameters and inline styles:
.thumbnail {
        width: 180px;
        border-radius: 20px;
        border:1px solid #333;
        height: auto;
        margin: 0 0 20px 20px;
    }
    .thumbnail_photo {
        float:none;
    }
    
    .pad_content {
        padding:0 20px;
    }

</style>
</head>
<body>
<div class="container">
    <header>
        <div class="primary_header">
          <!-- GV CONFIG: Header Image $Resource and ALT tag variables below -->
          <img style="width:100%" src="{!$Resource.GVNAHeader}" alt="Organization Logo"/>
        </div>
    </header>
    <div class="row">
        <div class="column_half left_half" style="height:525px">
            <div class="pad_content">
            <!-- GV CONFIG: Org Company Name -->
            <h2 style="font-family:Arial Unicode MS; font-weight:700; font-size:24px">{!$Organization.Name}</h2>

 
We are hoping to update our upcoming release of GreatVines functionalities for Salesforce1 along with the new SLDS styles. I ran into one issue last night when trying to leverage the SVG "sprite" icons within a Visualforce page. From javascript we output the following code as directed in the link above:
var svg = '<svg aria-hidden="true" class="slds-button__icon slds-button__icon--left"><use               xlink:href="/assets/icons/utility-sprite/svg/symbols.svg#camera"></use></svg>';
photoButton.setAttribute('class', 'btn btn-default slds-button slds-button--neutral');
photoButton.innerHTML = (mobile ? '{!$Label.Take_A_Photo} / ' : '') + '{!$Label.Choose_Existing}';
photoButton.insertAdjacentHTML('afterbegin', svg);

This attempts to render the button with an inside icon however we get the following error:
Account_Photo_SF1?id=001G000001mAP70IAG&sfdcIFrameOrigin=https%3A%2F%2Fna11.lightning.force.com&isd…:1 Unsafe attempt to load URL https://na11.salesforce.com/assets/icons/utility-sprite/svg/symbols.svg#camera from frame with URL https://c.na11.visual.force.com/apex/Account_Photo_SF1?id=001G000001mAP70IA…eOrigin=https%3A%2F%2Fna11.lightning.force.com&isdtp=p1&sfdcIFrameHost=web. Domains, protocols and ports must match.

I have attempted to change the URL to the SVG file to na11.visual.force.com, c.na11.visualforce.com, na11.lightning.force.com but none of them work. I have also added *.visual.force.com and *.lightning.force.com to the CORS whitelist but still no change?
I have a feature we are building which allows our users to input some elements onto a custom object which will be used within a Visualforce component to generate a PDF attachment to an email which comes from a Visualforce HTML email template:
<messaging:emailTemplate subject="National Account Program v9" recipientType="User" relatedToType="gvp__National_Email__c">
    <messaging:htmlEmailBody >
        <apex:image url="https://c.na7.content.force.com/servlet/servlet.ImageServer?id=015A0000000kVmM&oid=00DA0000000KItS&lastMod=1297286110000"/>
        <br/>
        <p>Here is a test PDF of the new National Account Program Announcement (should be attached)</p>
    </messaging:htmlEmailBody>
    <messaging:attachment renderas="pdf" filename="{!relatedTo.Name}-Authorizations-9.pdf">
    <c:NAProgramEmail />
    </messaging:attachment>
</messaging:emailTemplate>
I can use the "Send Test and Verify Merge Fields" button on the template to send myself an email, and the attachment looks pretty much the way I want it to, with CSS, fullscreen background, etc. This is what it looks like:

User-added image

However I also want my users to be able to "Preview" the PDF while they are inputting the elements. To test this I made a simple VF page that embeds the same Visualforce component but as you will see below, it looks entirely different. Does this not use the same PDF renderer? Are there tricks to get the same VF component to look the same in both scenarios?
<apex:page renderAs="pdf">
    <c:NAProgramEmail />
</apex:page>
And when I view this VF page it looks like this:
User-added image

Here is a snippet of the Visualforce component, which contains both <style> parameters and inline styles:
.thumbnail {
        width: 180px;
        border-radius: 20px;
        border:1px solid #333;
        height: auto;
        margin: 0 0 20px 20px;
    }
    .thumbnail_photo {
        float:none;
    }
    
    .pad_content {
        padding:0 20px;
    }

</style>
</head>
<body>
<div class="container">
    <header>
        <div class="primary_header">
          <!-- GV CONFIG: Header Image $Resource and ALT tag variables below -->
          <img style="width:100%" src="{!$Resource.GVNAHeader}" alt="Organization Logo"/>
        </div>
    </header>
    <div class="row">
        <div class="column_half left_half" style="height:525px">
            <div class="pad_content">
            <!-- GV CONFIG: Org Company Name -->
            <h2 style="font-family:Arial Unicode MS; font-weight:700; font-size:24px">{!$Organization.Name}</h2>

 
I have posted this on the Trailhead Forum and received no solutions. I am stuck on the following challenge in the Advanced Formula Section of Trailhead:

Create a formula field that returns an image to indicate data quality.
Sales Managers have asked for an at-a-glance solution to see completeness on leads. Create a helper formula field that looks at 5 key fields on the Lead object and evaluates their completeness, then a second formula field that references the helper formula and returns an image.
The helper formula field should be on the Lead object with a name of 'Lead Quality Helper' and a resulting API name of 'Lead_Quality_Helper__c'.
The helper formula should be of type Number.
The helper formula should evaluate the following 5 fields: Email, Phone, Company, Title, and Industry and return 0 if blank and 1 if not blank. The formula should then add all the values together to return a total value.
The ima
ge formula should be on the Lead object with a name of 'Lead Quality' and a resulting API name of 'Lead_Quality__c'.
The image formula should reference the helper formula, and return an image based on the number returned by the helper formula. The image formula should be of type Text. Note: All of these images are already available in your Developer Edition.
1 = /img/samples/stars_100.gif with alternate text '1 star'
2 = /img/samples/stars_200.gif with alternate text '2 stars'
3 = /img/samples/stars_300.gif with alternate text '3 stars'
4 = /img/samples/stars_400.gif with alternate text '4 stars'
5 = /img/samples/stars_500.gif with alternate text '5 stars'
If none of the fields are filled out, the default should be /img/samples/stars_000.gif with alternate text '0 stars'.
The 'Lead Quality' formula must be added to the Lead Layout page layout.


The helper formula was easy.

I cannot pass syntax with the formula below and tring to edit it doesn't lead anywhere except to more errors.

IMAGE
(CASE(Lead_Quality_Helper__c ,
5, ("/img/samples/stars_500.gif","5 Stars"),
4, ("/img/samples/stars_400.gif","4 Stars"),
3, ("/img/samples/stars_300.gif","3 Stars"),
2, ("/img/samples/stars_200.gif","2 Stars"),
1, ("/img/samples/stars_100.gif","1 Stars"),
0, ("/img/samples/stars_000.gif","0 Stars"),
"/img/samples/stars_000.gif","Unknown")

Can someone with more experience please help me troubleshoot? The error using this formula produces the following error text: Syntax Error. Missing ')' at the comma between the url for the image and the trext string on this line:. 5, ("/img/samples/stars_500.gif","5 Stars"),
Hi,

I have a visualforce page and I have a url that redirects to email author(/_ui/core/email/author/EmailAuthor) and it says 'This page isn't available in Salesforce Lightning Experience or Salesforce1.'

here is the javascript:
function emailDoc(strEmailDocId, strRecordID){     
        // set the url to redirect to
        var strURL = '/_ui/core/email/author/EmailAuthor?doc_id=' + strEmailDocId + '&p3_lkid=' + strRecordID + '&retURL=' + strRecordID;
            // Salesforce1 navigation
            sforce.one.navigateToURL(strURL, true);
}

Is there a way for me to call the email author through Lightning experience? It's ok even if takes the page back to a classic theme.
  • July 26, 2016
  • Like
  • 0
I'm just curious if we can create a training program for new hires so that when they start there is a pre-selected set of training modules they go through so that everyone gets the same basic understand of SFDC.  How can we mointor that they have completed certain modules?
We are hoping to update our upcoming release of GreatVines functionalities for Salesforce1 along with the new SLDS styles. I ran into one issue last night when trying to leverage the SVG "sprite" icons within a Visualforce page. From javascript we output the following code as directed in the link above:
var svg = '<svg aria-hidden="true" class="slds-button__icon slds-button__icon--left"><use               xlink:href="/assets/icons/utility-sprite/svg/symbols.svg#camera"></use></svg>';
photoButton.setAttribute('class', 'btn btn-default slds-button slds-button--neutral');
photoButton.innerHTML = (mobile ? '{!$Label.Take_A_Photo} / ' : '') + '{!$Label.Choose_Existing}';
photoButton.insertAdjacentHTML('afterbegin', svg);

This attempts to render the button with an inside icon however we get the following error:
Account_Photo_SF1?id=001G000001mAP70IAG&sfdcIFrameOrigin=https%3A%2F%2Fna11.lightning.force.com&isd…:1 Unsafe attempt to load URL https://na11.salesforce.com/assets/icons/utility-sprite/svg/symbols.svg#camera from frame with URL https://c.na11.visual.force.com/apex/Account_Photo_SF1?id=001G000001mAP70IA…eOrigin=https%3A%2F%2Fna11.lightning.force.com&isdtp=p1&sfdcIFrameHost=web. Domains, protocols and ports must match.

I have attempted to change the URL to the SVG file to na11.visual.force.com, c.na11.visualforce.com, na11.lightning.force.com but none of them work. I have also added *.visual.force.com and *.lightning.force.com to the CORS whitelist but still no change?