Profile Card Widget screen

Shows a profile card on a custom page

Figure: Profile Card Widget screen

Profile Card Widget screen

Video: Page Builder Overview

Examples

Prerequisites

How to Start

  1. Open the Custom Page Design screen.

    For information about how to open this screen, refer to Custom Page Design screen.


    Open Custom Page
  2. Click Add Widget.

    Custom Page Design screen
  3. On the Pick A Widget screen, on the Card tab, click Profile Card.

    Click Profile Card

Fields

Field NameDefinition

Profile Banner Background Color

Description:
Specifies the background color for the profile banner.
Allowed Values:
A color value using a hex code, RGB code, or RGBA code.

You can enter a color code, or select a color from the palette.

Default Value:
ffffff
Example:
  • #ff0000
  • #183048
  • #e16229
  • rgb(25,151,66)
  • rgba(87,177,201,2)

Profile Image Shape

Description:
Specifies the shape of your profile image.
Allowed Values:
  • Circular - The profile image shows in circular shape.
  • Square - The profile image shows in square shape.
Default Value:
Circular

Image Source

Description:
Specifies the source for your profile image to show on your custom page.
Allowed Values:
  • Web URL - Specifies the absolute URL for an image.
  • Image Library - Uses an image from the image library.

    To use image from image library, click Pick An Image.

Default Value:
Image Library
Limitations:
This field is available in these releases:

Profile Image URL

Description:
Specifies the URL of your profile image.
To Open this Field:
  1. In the Image Source field, click Web URL.
Allowed Values:
One line of text (a string).

Format:

  • URL
Default Value:
None
Example:

Pick An Image

Opens this Screen:
Image Picker screen
To Open this Field:
  1. In the Image Source field, click Image Library.
Function of this Screen:
Specifies an image file to show on your page or menu.
Limitations:
This field is available in these releases:

Profile Image Width

Description:
Specifies the width of your profile image.
Allowed Values:
An integer.

Range

  • Greater than 0
Default Value:
100

Unit

Description:
Specifies the unit for the height or width of an image.
Allowed Values:
  • Pixels (px)
  • Percentage (%)
Default Value:
Pixels (px)

Profile Image Height

Description:
Specifies the height of your profile image.
Allowed Values:
An integer.

Range

  • Greater than 0
Default Value:
100

Profile Image Top Offset (px)

Description:
Specifies a location in pixels for a profile picture from the top horizontal line.
Allowed Values:
An integer.

Range

  • Greater than 0
Default Value:
80

Footer Action Background Color

Description:
Specifies the background color for the footer section to show in your profile.
Allowed Values:
A color value using a hex code, RGB code, or RGBA code.

You can enter a color code, or select a color from the palette.

Default Value:
ffffff
Example:
  • #ff0000
  • #183048
  • #e16229
  • rgb(25,151,66)
  • rgba(87,177,201,2)

Footer Action Link Color

Description:
Specifies the color for the text to show in the footer.
Allowed Values:
A color value using a hex code, RGB code, or RGBA code.

You can enter a color code, or select a color from the palette.

Default Value:
ffffff
Example:
  • #ff0000
  • #183048
  • #e16229
  • rgb(25,151,66)
  • rgba(87,177,201,2)

Footer Action Link URL

Description:
Specifies the URL of a blog, an article, or any website related to the profile creates in your page.
Allowed Values:
One line of text (a string).

Format:

  • URL
Default Value:
None
Example:

Footer Action Link Text

Description:
Specifies the text for the URL to show in the footer.
Allowed Values:
One line of text (a string).

Accepted:

  • Letters
  • Numbers
  • Spaces
Default Value:
None
Example:
Refer to:

Add

Description:
Creates a new profile for your custom page.