Salesforce1

Warning

As of November 2016, the mobile composer has been deprecated. What does this mean?

  • App builders with deployed mobile apps will continue to have access to the mobile composer and able to update pages in those mobile apps.
  • With Skuid v11, new users (and those with no mobile pages) will have no access to the mobile composer. Unpacking a page pack containing Skuid Mobile pages will re-enable the Mobile Composer option.

Skuid strongly advises using the unified Composer.

Return to mobile composer index.

Displaying your Skuid Mobile pages on the Salesforce1 Mobile App

Skuid Mobile pages can be displayed within Salesforce1, giving your users access to Skuid pages directly from an icon within their navigation menu.

There are really only three steps needed:

  1. Create a Visualforce page that uses a skuid:page component to point to your Skuid Mobile page
  2. Create a Visualforce tab for that new page
  3. Use the Mobile Navigation Settings page to configure the experience for your users.

Step 1. Create and configure a new Visualforce page

To begin, you’ll need to create a new Visualforce page.

  1. Use Quickfind on the Salesforce sidebar or navigate to Build > Develop > Visualforce Pages.
  2. From there, click the New button, which you’ll see directly above the table of your Visualforce pages.

Add Visualforce markup and make your page available for mobile

  1. Label and Name: These are only internal names—they will not affect the appearance of your page.

  2. Available for Salesforce mobile apps and Lightning pages: This setting must be ON.

  3. Visualforce Markup: You must use the skuid:page Visualforce component to properly direct users to your Skuid page. If you have not used this override method in the past, you will need to create local clones of several Visualforce pages. Read how to do this—and learn more about the skuid:page component here.

    Base your markup on the examples in the Object/Controller-independent pages section.

  4. Paste your Visualforce markup in the Visualforce Markup pane.

  5. Click Save.

Make sure your VisualForce page is enabled for the correct profiles

To ensure that your Visualforce page is viewable, navigate to Build > Develop > Visualforce Pages. Once there, click the Security link beside the page you’ve created and select which profiles should be able to view it.

Step 2. Create a Visualforce tab for your Skuid page

Salesforce1 uses Visualforce tabs for its navigation menu, hence you must create a tab that points to your Visualforce page, which then points to your Skuid Mobile page. Still with me?

  1. From the Salesforce Setup page, use Quick Find or navigate to Build > Create > Tabs.
  2. Under Visualforce Tabs, click New.
  3. For Visualforce Page, select the page that points to your Skuid Mobile page.
  4. Label and name your tab appropriately. Your label name will be what displays within Salesforce1.
  5. Select a tab style.
  6. Click Next to proceed through the remaining two steps, in which you will choose which profiles will have access to this tab and also which custom apps this tab will be added to. You likely will not need to change the settings on these pages from their default values.

Step 3: Modify Salesforce1 Navigation

To use a Skuid page within a Salesforce1 context, you must create a Visualforce tab or Lightning Page tab containing your Skuid page. That tab then must be added to the Salesforce1 navigation list.

  1. From the Salesforce sidebar, navigate to Mobile Administration > Salesforce Navigation.

  2. Select the appropriate Visualforce or Lightning Page tab in the Available pane.

  3. Click the Add arrow.

    Note

    You can also re-order your navigation menu items using the Up and Down arrows.

  4. When you are satisfied with your navigation menu settings, press Save.

image1

Finished product

image2

Now when your users open their Salesforce1 navigation menu, they will see your Visualforce tab. When they click that tab, they will be directed to the Skuid page you’ve built.