Change the background color depending on the prefix

csshtmlvisualforce

I want to change the background color depending on the prefix….the command I'm trying to use has given a syntax error, where am I going wrong? Or is this idea not possible

<body style="{!if(!$Site.Prefix == '/portalEllas',background: #164E4B,background: #0c4453)}">

Best Answer

In your case, the output must be a string (enclosed in quotes). You also potentially have an extra !; the ! in a merge formula is part of the merge syntax, as in {!...}. Anywhere else besides that, ! acts as the NOT() function. Field names are not ordinarily prefixed with !. If you use it as written, it effectively makes the condition: $Site.Prefix != '/portalEllas', which is probably not what you meant.

<body style="{!if($Site.Prefix == '/portalEllas','background: #164E4B','background: #0c4453')}">

You can optimize this by moving the background out of the formula:

<body style="background: {!if($Site.Prefix == '/portalEllas','#164E4B','#0c4453')}">

Related Solutions

[SalesForce] Change color theme of visualforce page

You can bind a "tabStyle" to the page, which causes the color theme/icon to match the named tab or object tab (Custom__Tab or CustomObject__c). However, this value cannot be dynamic, so you may need to use a template page or component that contains the logic you want to encapsulate for each object individually, then include that page in two other pages that have the desired tabStyle set.

Common.page:

<apex:page ...>
</apex:page>

Tabstyle1.page:

<apex:page tabStyle="objectA__c">
    <apex:include pageName="common"/>
</apex:page>

Tabstyle2.page:

<apex:page tabStyle="objectb__c"/>
    <apex:include pageName="common"/>
</apex:page>

This "trick" works because the CSS will be dynamically selected, and all subelements will take on the appropriate color attributes.

If the page itself does not need to be styled differently, but you want to change the style of individual page blocks, you can do this as well:

<apex:pageBlock title="Contacts" tabStyle="Contact"> ... This area is purple. </apex:pageBlock>
<apex:pageBlock title="Accounts" tabStyle="Account"> ... This area is blue. </apex:pageBlock>

[SalesForce] How to set background-color in lightning component

Save a CSS file.

html{
background: white;
}

Upload CSS file in the Static resource with any name(let say ChangeBGColor)

Import the CSS in your parent lightning component using

< ltng:require styles="{!$Resource.ChangeBGColor}" />

Best Answer

Related Solutions

[SalesForce] Change color theme of visualforce page

[SalesForce] How to set background-color in lightning component

Related Topic