Visualforce Developer Guide

Clouds with binary code floating aboveCloud with binary code floating above

No Results

Search Tips:

  • Please consider misspellings
  • Try different search keywords
Introducing Visualforce
Tools for Visualforce Development
Getting a Quick Start with Visualforce
Customizing the Appearance and Output of Visualforce Pages
Styling Visualforce Pages
Using Salesforce Styles
Extending Salesforce Styles with Stylesheets
Using the Lightning Design System
Style Existing Visualforce Pages with Lightning Experience Stylesheets
Using Custom Styles
Suppressing the Salesforce User Interface and Styles
Defining Styles for a Component’s DOM ID
Using Styles from Salesforce Stylesheets
Identifying the Salesforce Style Your Users See
Determining the Salesforce Style That Users See in JavaScript
HTML Comments and IE Conditional Comments
HTML Tags Added or Modified by Visualforce
Using a Custom Doctype
Change the MIME type of Your Visualforce Page
Setting Custom HTML Attributes on Visualforce Components
Render a Visualforce Page as a PDF File
Standard Controllers
Standard List Controllers
Custom Controllers and Controller Extensions
Advanced Examples
Override Buttons, Links, and Tabs with Visualforce
Using Static Resources
Creating and Using Custom Components
Dynamic Visualforce Bindings
Dynamic Visualforce Components
Integrate Email with Visualforce
Visualforce Charting
Creating Maps with Visualforce
Render Flows with Visualforce
Templating with Visualforce
Developing Salesforce Apps with Visualforce
Adding Visualforce to a Salesforce AppExchange App
Using JavaScript in Visualforce Pages
Communicating Across the DOM with Lightning Message Service
Visualforce Best Practices
Standard Visualforce Component Reference
Appendices
PDF

Suppressing the Salesforce User Interface and Styles

By default, Visualforce pages adopt the same visual styling and user interface “chrome” as the rest of Salesforce. This default styling behavior lets you create pages that look like they’re built right into Salesforce. If you don’t want a page to have the Salesforce look and feel, you can suppress various aspects of the Salesforce page and visual design.
You can change the page-level user interface resources added by Visualforce using the following attributes on the <apex:page> component.
  • sidebar—Set to false to suppress the standard sidebar. Removing the sidebar gives your page a wider canvas. For example, you can show more columns in a table.

    This attribute doesn’t affect the rest of the Salesforce look and feel. You can continue to use components like <apex:pageBlock>, <apex:detail>, and <apex:inputField> that render with Salesforce user interface styling.

  • showHeader—Set to false to suppress the standard Salesforce page design. The header, tabs, and sidebar are removed, along with their associated style sheets and JavaScript resources, like scripts that aid with redirects on session timeout. You have a blank page ready to fill in with your own user interface.

    However, suppressing standard page design does not suppress all the style sheets and scripts that provide the Salesforce visual design or other scripts included the page. Visualforce components that you add to the page continue to adopt the Salesforce visual design.

  • standardStylesheets—Set to false, along with setting showHeader to false, to suppress the inclusion of the style sheets that support the Salesforce visual design. When you suppress the standard style sheets, your page is unstyled, except for your own style sheets.

    If you don’t load the Salesforce style sheets, components that require them don’t display correctly.

    Note

    Setting this attribute to false has no effect if showHeader isn’t also set to false.