Create Custom Visualforce Page to Replace Default

I want to customize an object making certain fields only available while creating. After creation, you need to click on a button to edit or view hidden data. Therefore, customized edit and view Visualforce pages.

Page Design

I create two different pages for edit and view. Most fields in edit is apex:inputField while view is apex:outputField.

For apex:inputText, use size to define length of visible width whil apex:inputTextarea, use cols and rows to define width and height. It helps to make the layout easier to read. Below are partial example:

<apex:inputText maxlength="255" size="75" value="{!amigoIncident__c.Links__c}" />
<apex:inputTextArea cols="75" rows="7" value="{!amigoIncident__c.Memo__c}" />

For interactive design, enable Development Mode in [Personal Setup] → [My Personal Information] → [Personal Information] page. When you are browsing Visualforce Page, use the horizontal bar with X icon on lower page to view source code and design on the same page.

A sample Visualforce page includes button and related list:

<apex:page standardController="amigoIncident__c">
    <apex:pageBlock title="Incident Detail" mode="maindetail">
      <apex:pageBlockButtons >
        <apex:commandButton action="{!edit}" value="Edit">
      <apex:pageBlockSection showHeader="false" columns="2" collapsible="false">
        <apex:outputField value="{!amigoIncident__c.Name}">
      <apex:pageBlockSection showHeader="false" columns="1" collapsible="false">
        <apex:outputText value="{!amigoIncident__c.Memo__c}">
      <apex:pageBlockSection showHeader="true" title="System Info" columns="1">
        <apex:outputText value="{!amigoIncident__c.CreatedDate}">
  <apex:relatedList subject="{!amigoIncident__c}" list="Histories" />

Add a Related List to a Custom Object

In the apex:relatedList example, it doesn’t use subject to specify parent record. For some related list like OpenActivities, it works. But ActivityHistories doesn’t work as describe in VisualForce Activities / Histories List, I have to specify the custom controller.

The parent record from which the data and related list definition are derived. If not specified, and if using a standard controller, this value is automatically set to the value of the ID query string parameter in the page URL.

Partial code to add related list in custom object amigoIncident as below:

<apex:relatedList subject="{!amigoIncident__c}" list="OpenActivities" />
<apex:relatedList subject="{!amigoIncident__c}" list="ActivityHistories" />
<apex:relatedList subject="{!amigoIncident__c}" list="childRole__r" />
<apex:relatedList subject="{!amigoIncident__c}" list="Histories" />

childRole is the Child Relationship Name of a lookup field Incident related to Incident object in customized object Roles. Add __r as explained in not a valid child relationship name for entity Account to access from related object.

Stop Rendering

Because I have design several profiles with different object permission, I got error message when apply the same Visualforce page until I found Hide relatedList if no permissions and Restricting visualforce Page view between profiles. I may use condition rendering in apex:relatedList with rendered=”{!IF($Profile.Name ==’Platform Administrator’, True, False)}” to prevent permission error.

Visualpage Security

Before make it available to others, set security in [App Setup] → [Develop] → [Visualforce Pages] to enable on profiles.

Page Design and Assignment

In Buttons, Links, and Actions of custom object, choose custom Visualforce Page in Override With to replace default.



  1. Salesforce: An Introduction to Visualforce
  2. Salesforce: apex:inputField
  3. Salesforce: apex:inputText
  4. Salesforce: apex:inputTextarea
  5. Salesforce: apex:outputField
  6. Salesforce: apex:relatedList
  7. Salesforce: Hide relatedList if no permissions
  8. Salesforce: not a valid child relationship name for entity Account
  9. Salesforce: Restricting visualforce Page view between profiles
  10. Salesforce: VisualForce Activities / Histories List

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.