Displaying Staff Assigned Photos
  • 18 Mar 2024
  • 1 minute read
  • Dark
    Light
  • PDF

Displaying Staff Assigned Photos

  • Dark
    Light
  • PDF

Article summary

Informing an applicant of their assigned staff member can assist with channeling questions to the appropriate person on your team. Displaying their contact information and even a photo can help make the portal look even more personal. This article covers how to use the Deliver Library to display staff assigned photos, but note that you may also choose to use Snippets to display staff assigned information. 

Uploading Images to Server

Images can be uploaded via the Deliver Library or from an individual Deliver mailing. 

Deliver Library

  1. In Deliver, select the Library link on the menu to the right.

  2. Select Upload to upload images to the server. (Images can also be dragged and dropped into the Library. If folders are being used on the server, note that moving images from folder to folder will affect any mailings or portals referring to the image.)

Individual Deliver Mailing

  1. From any Deliver mailing, select the image icon in the tool bar.

  2. Select Browse Server.

  3. Select Upload to upload images to the server. (Images can also be dragged and dropped into the Images dialog. If folders are being used on the server, note that moving images from folder to folder will affect any mailings or portals referring to the image.)

Note: Image file names should reflect the user ID of the staff member. For example, Sally Sue's user ID in Slate is "sally." The file name would be "sally.jpg."

Adding Export to Custom Status Portal Query

In the custom status portal query, add the export for Staff Assigned User. Edit the name to be computer-friendly (lowercase and no spaces). This name will be the merge field to use in the view.

Custom Status Portal View

  1. Drag a static content block to the view to where the staff photo should appear.

  2. In the Source Code of the static content block, copy and paste the following code (if using a different image type, such as a .png file, be sure to update the file extension in the code accordingly):

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title></title>
    </head>
    <body>
    
    <div style="text-align: center;">
    <img alt="" src="/www/images/{{staff_user}}.jpg" style="width: 150px; 
    height: 218px; border-width: 2px; border-style: solid;" /><br />
    </div>
    </body>
    </html>
  3. Make any additional formatting and text changes desired. For example, you could add additional text and merge fields with the staff member's name, email, and so on.


Was this article helpful?