Skip to main content

Create a print button for Lightning Experience

Example 1. Before starting work

  • Preparation

    • Configure the following settings in icon_menu_setting.png Environment Settings - Salesforce - Print Button to be Created.

      System administrator permission is required to configure the settings.

      • Select icon_sfLightning.png Lightning Experience.

      • Clear icon_sfClassic.png Salesforce Classic.

  • Restrictions

    • Depending on the type of buttons, the position where you can place the button differs.

      • Print button

        • Action area on the detail page

        • List view on the search layout

      • Drop-down button

        • Action area on the detail page

    • When the print button is clicked, the preview screen is displayed with the screen transitioning in the same window.

    • You need to do additional work to output forms using Experience Cloud. For details on the work, see "SVF Cloud for Salesforce Development Guide" - "Call from Experience Cloud".



  1. Log in to SVF Cloud Manager, and open the icon_menu_Button.png SVF Button Settings screen.

    If the Salesforce login screen appears, enter login information to login.

  2. In Salesforce Object, specify the Salesforce object to be used as the data source.

    Reference

    If the target object is not displayed in the list

    All objects will be displayed by switching icon_filter.png to icon_filter_no.png.

  3. Click icon_addButton.png or icon_addDropdownButton.png in SVF Button to add an SVF button.

    • icon_addButton.png

      Add an SVF button.

    • icon_addDropdownButton.png

      Add a "drop-down button" to consolidate multiple buttons into one.

    button_newButton.png
    Figure 1. Example of buttons shown on Salesforce (after creating print buttons)
    Example of buttons shown on Salesforce (after creating print buttons)


    Reference

    Copy an existing SVF button

    To copy an existing SVF button, see "Copy the SVF button".

  4. In Label, specify the label of SVF button. It is also used as the name of the print button if you create a print button.

    button_newButton_buttonName.png

  5. (When adding a drop-down button)

    Click icon_subMenu.png - Add to add SVF buttons to consolidate into a drop-down button. As in the previous step, specify the label.

    button_newDropdownButton_addButton.png

  6. Click icon_addLayout.png in Form Layout to specify the form layout.

    button_addForm.png

    If you use the existing form layout, skip the next step and go to step 8.

  7. Specify a hierarchy to save the new form layout and click the New button.

    button_addForm_formFolder.png

    Reference

    Create a hierarchy

    To create a hierarchy, create a new folder in any hierarchy under the "form" folder on the icon_menu_resource.png Resource screen.

    resource_folder_newFolder.png

  8. Select a form layout to use, and click the Select button.

    button_addForm_selectForm.png

    If a field is already placed in the form layout, that information is displayed in the Field.

    If you select a form layout with an extension other than "xml", skip the following steps and go to step 18.

    Reference

    Specify multiple form layouts

    You can specify multiple form layouts for one button only when the extension of the form layout is "xml".

    In this case, the form is output according to the order of the form layouts on the screen. The order can be changed by icon_up.png and icon_down.png.

    illust_formOrder-outputOrder.png

  9. To specify a Salesforce field to output to the form, click icon_sfItem_add.png in Field.

    button_field_addSFItem.png

  10. Specify the Salesforce field to output to the form in Salesforce Field on the right side. (You can select multiple fields.)

    To output a Salesforce field of the related object, specify the object in the list on the left.

    button_sfItem_selectSFItem.png

    Reference

    Object range

    For details on the range of Salesforce objects that can be output to forms, see "Notes and Restrictions" - "SVF Cloud for Salesforce".

  11. To design a form layout with SVF Cloud Designer, click icon_start_SCD.png in Form Layout.

    button_startSCD.png

    • For SVF Cloud Designer Client (AIR version)

      If you drag and drop an item of "fields.csv" in the References window onto the Form Editor, you can place a field that outputs a Salesforce field on the form layout.

      If the References window is not displayed, click the swd92_3-11-0_002.png References button.

      designer_design_csv.png

      Caution

      Field name

      It is recommended to keep the default names for fields placed by drag and drop.

      If changed, automatic mapping by field mapping may not be performed in a later step.

      scd_fieldName.png

    • For SVF Cloud X-Designer

      If you drag and drop an item in Library window onto the form window, you can place a field that outputs a Salesforce field on the form layout.

      scxd_libraryWindow.png

      Once you close the Library window , the items cannot be displayed again. Exit SVF Cloud X-Designer once and start it again from the icon_menu_Button.png SVF Button Settings screen.

      Caution

      Field name

      It is recommended to keep the default names for fields placed by drag and drop.

      If changed, automatic mapping by field mapping may not be performed in a later step.

      scxd_propatyEditor_fieldName.png

  13. Design a form layout by inputting characters or creating a table.

    For details on how to use SVF Cloud Designer, see "SVF Cloud Designer Creating Forms" or "SVF Cloud X-Designer Form Creation Guide".

  14. Once you have finished creating a form layout, exit SVF Cloud Designer.

  15. Click icon_sfItem_mapping.png to map the fields placed in the form layout to Salesforce fields.

    Rows with matching SVF field name and Salesforce field name are automatically mapped. (You can manually modify the automatic mapping results later.)

    Note that Salesforce field names are compared internally converted to a string that conforms to the naming conventions for SVF field names. (For example, half-width numbers specified for the first character, and all symbols other than underscore symbol "_" will be replaced with underscore symbols.)

    button_field_mapping_auto.png

  16. When clicking the Salesforce Field field, you can specify a Salesforce field for each SVF field.

    button_field_mapping_manual.png

  17. To clear the Salesforce Field field, click icon_sfItem_clear.png.

  18. Click icon_setting.png in SVF Button Information to set SVF button details including how to output forms (actions).

    For details on the setting items, see "Advanced setting items of the SVF button".

    button_setting.png

    The settings and notes differ depending on the output method. For details, see the page for each output method.

  19. Click the Save button to save the SVF button settings.

    button_saveButton.png

  20. Click the Create Print Button button to create a print button using the saved settings of the SVF button.

    button_makePrintButton.png

By clicking the OK button on the completion screen, the creation of the print button is complete.

Proceed to "Adding Action in Lightning Experience" only when you use the drop-down button.

Add action in Lightning Experience

If you use drop-down buttons in Lightning Experience, you need to add action in Salesforce after creating a print button in SVF Cloud Manager.

  1. Log in to Salesforce.

  2. From Setup in Salesforce, open the Buttons, Links, and Actions page of the object on which you created the print button.

  3. Click the New Action button.

    sfdcLEX_button_newAction.png

  4. Set the details of the action as follows. For a setting item not listed in the table, specify any value.

    Setting item

    Setting

    Action Type

    Custom Visualforce

    Visualforce Page

    Select the created drop-down button (starting with "SVFLEX <number>")

    sfdcLEX_action_vf.png

  5. Click the Save button.

When the action detail screen is displayed, adding the action is complete.

In the action area of the detail page, place the action you created here instead of the print button.

Related information

In this section: