
CSS-snippet:
/*---- General CSS ----*/
@font-face {
font-family: Gravur; src: url('/resource/Gravur_CondensedLight');
}
@font-face {
font-family: Gravur; font-weight: bold; src: url('/resource/Gravur_CondensedBold');
}
/*---- Page CSS ----*/
html
{
font-family: Gravur;
font-size: 16px;
}
/* And more irrelevant down below */
My Controller-snippet:
public class PartyRSVPController
{
public String cmid {get;set;}
public Boolean rendered {get; set;}
public Boolean renderedError {get; set;}
public Boolean success {get; set;}
public CampaignMember aMember {get; set;}
public Integer numGuests {get; set;}
public Campaign aCampaign {get; set;}
public String campaignImagePath {get; set;}
public StaticResource res;
public PartyRSVPController(){
aMember = new CampaignMember();
aCampaign = new Campaign();
rendered = true;
success = false;
res = new StaticResource();
}
public void init() {
cmid = System.currentPageReference().getParameters().get('cmid');
if ( cmid == null || cmid.equals('') ) {
rendered = false;
}
try {
aMember = queryCampaignMember(cmid);
aCampaign = queryCampaign(aMember.CampaignId);
} catch(system.QueryException qe) {
rendered = false;
}
campaignImagePath = '/servlet/servlet.FileDownload?file=' + aCampaign.CampaignImageId__c;
renderedError = !rendered;
}
}
My page-snippet
Generally, the stylesheet loadsbecause it displays my tags correctly, but the font doesn't load. As you can see I use font face for using fonts for both bold and normal display. I do suspect that the simple "src:url( '/resource/Gravur_CondensedLight')" is the source of the problem. I do however not know how to deal with it.This is what it looks like:<apex:page showHeader="false" sidebar="false" showChat="false" controller="PartyRSVPController" standardStylesheets="false" docType="html-5.0" title="Party RSVP" action="{!init}">
<apex:pageMessages />
<apex:stylesheet value="{!$Resource.PartyRSVP}" />
<apex:form styleClass="form">
<apex:pageBlock >
<section id="page_header">
<apex:image value="{!$Resource.ArchitonicLogo}" alt="Architonic Logo"/>
</section>
</apex:pageBlock>
<apex:pageBlock rendered="{!rendered}">
<section id="page_content">
<aside>
<!-- apex:image url="{!URLFOR($Action.Attachment.Download, aCampaign.CampaignImageId__c)}" alt="Campaign Image" styleClass="image" /-->
<apex:image value="{!campaignImagePath}" alt="Campaign Image" styleClass="image" />
</aside>
<article>
Dear {!Salutation}<br/>
<br/>
We are delighted to have you at our event <b>{!aCampaign.CampaignNamePublic__c}</b>! Please let us know whether you bring any guests and how many you bring:<br/>
<div>
<apex:input value="{!numGuests}" type="number" styleClass="inputField" label="Guests"/>
<apex:commandButton id="SubmitButton" title="RSVP" value="RSVP" action="{!submit}"/>
</div>
</article>
</section>
</apex:pageBlock>
</apex:form>
</apex:page>
If the image id is attachment id, then you can use below code. Controller:
campaignImagePath = aCampaign.CampaignImageId__c;
Visualforce:
<img src="{!URLFOR($Action.Attachment.Download, CampaignImageId__c)}" />
Otherwise you can use the below code.
campaignImagePath ='/'+ YourSiteName+'/servlet/servlet.FileDownload?file=' + aCampaign.CampaignImageId__c;