SmartV Profile Screen Styling
You can style the SmartV Profile screen to complement your brand and business needs.
Visit the SmartV Profile page for more information on configuring the SmartV Profile screen.
The Profile page has two major element:
- the main screen; and
- the modal that opens when a user wants to change the profile image.
Main screen
The SmartV Profile’s main screen has several different aspects that you can style in numerous ways, for instance, changing the font (family, color, or size), adding borders, or changing colors and margins.
Below is an example of some of the changed options for the profile page:
1. Profile Box
Change the styling of the Profile Box. This is the entire registration screen excluding the Page setting (number 8 on the images).
2. Title
Change the styling of the Title, for instance, “Profile.”
3. Description
Change the styling of the Description, for instance, “Profile description.”
4. Profile Image
Change the styling of the Profile Image that you added.
5. Profile Text
Change the styling of the Profile Text that that the user will see when they hover on the profile image.
6. Button
Change the styling of the Buttons (Default, Hover, and Clicked), for instance, “Continue.” You can set different styling to default, hover, and clicked buttons. The options are the same under Default, Hover, and Clicked.
7. Page
Change the styling of the Page. This is the page background behind the Registration Box.
Modal
The SmartV Profile’s modal has several different aspects that you can style in numerous ways, for instance, changing the font (family, color, or size), adding borders, or changing colors and margins.
Below is an example of some of the changed options for the modal on the profile page:
1. Modal Title
Change the styling of the modal’s Title, for instance, “Update profile image.”
2. Modal Close Icon
Change the styling of the modal’s close icon “X.”
3. Modal Content
Change the styling of the modal’s Content.
4. Modal DropZone
Change the styling of the modal’s DropZone. This is the box where the user can click to drop or upload an image.
5. Modal DropZone Text
Change the styling of the modal’s DropZone Text, for instance, “Drag and drop a file here or click.”
6. Modal DropZone Icon
Change the styling of the modal’s DropZone Icon.
7. Modal DropZone Files
Change the styling of the modal’s DropZone Files message, for instance, “No files.”
8. Modal Footer
Change the styling of the modal’s Footer, for instance, “Use a picture up to 200×200 px.”
9. Modal Message
Change the styling of the modal’s Message, for instance, “Profile image updated.”
10. Modal Button
Change the styling of the modal’s Buttons, for instance, “Update” and “Cancel.”
Use the Captions option to change the wording of the following:
- Title
- Description
- Modal Title
- ModalDropZoneText
- ModalDropZoneFiles
- Modal Message
