CSS classes: Profile widget

Following is the list of CSS classes applied to the following templates of the Profile widget:

Read mode template

CSS class name Class set to  Default HTML tag 
sfprofileAutoGeneratedListWrp User profile wrapper in Auto generated fields read mode <ul>
sfprofileArticleLikeWrp User profile wrapper in Article-like read mode <div>
sfprofileListLikeWrp User profile wrapper in List-like read mode <div>
sfprofileField Single profile field wrapper <li> in Auto generated fields mode, <div> in Article-like and List-like modes
sfprofileAvatar Avatar outer wrapper in Article-like and List-like modes <div>
sfUserAvatar Avatar outer wrapper in Auto generated fields mode <li>
sfprofileName Wrapper of first and last name fields in Article-like mode <div>
sfprofileFirstName Wrapper of first name field in Article-like and List-like modes <div>
sfprofileLastName Wrapper of last name field in Article-like and List-like modes <div>
sfprofileAbout Wrapper of about field in Article-like and List-like modes <div>
sfTxtLbl Field label <div>
sfTxtContent Profile field text <div>
sfImg Avatar inner wrapper <div>
sfprofileLnkWrp Wrapper of Edit Profile and Change Password links <div>
sfprofileEditLnk Edit Profile link <a>
sfprofileChangePasswordLnk Change Password link <a>
sfprofileNotLoggedMsg User not logged in message <div>
sfprofileSuccessMsg Profile successfully updated message <div>
sfprofileFailureMsg Profile not successfully updated message <div>


Edit mode template

CSS class name  Class set to  Default HTML tag
sfprofileAutoEditFormWrp  Wrapper Auto generated fields edit mode <fieldset>
sfprofileEditFormWrp Wrapper Profile form edit mode <fieldset>
sfprofileField Single profile field wrapper <li> in Auto generated fields mode, <div> in Article-like and List-like modes
sfprofileAvatar Avatar outer wrapper in Profile form modes <div>
sfUserAvatar Avatar outer wrapper in Auto generated fields mode <li>
sfprofileFirstName Wrapper of first name field in Profile form modes <li>
sfprofileLastName Wrapper of last name field in Profile form modes <li>
sfprofileAbout Wrapper of about field in Profile form modes <li>
sfTxtLbl Field label <label>
sfFieldWrp Text input field wrapper <div>
sfTxt Text input <input>, <textarea>
sfImgPreviewWrp Avatar wrapper <div>
sfPreviewImgFrame Avatar image inner wrapper <div>
sfChange Change photo link <a>
sfReuploadImgWrp Change photo wrapper <div>
sfCancel Don't change photo link  <a>
sfprofileLnkWrp Wrapper of Save changes and Cancel buttons <div>
sfprofileEditLnk Save changes button <a>
sfprofileChangePasswordLnk Cancel link <a>
 

Change password template

CSS class name Class set to Default HTML tag 
sfprofileChangePasswordFormWrp Change password form wrapper <fieldset>
sfprofileFieldsList Field list <ol>
sfprofileField Single field wrapper <li>
sfTxtLbl Field label <label>
sfFieldWrp Text input field wrapper <div>
sfTxt Text input <input>
sfprofileLnkWrp Wrapper of Save changes and Cancel buttons <div>
sfprofileSaveLnk Save changes button <a>
sfprofileCancelLnk Cancel link <a>

Increase your Sitefinity skills by signing up for our free trainings. Get Sitefinity-certified at Progress Education Community to boost your credentials.

Get started with Integration Hub | Sitefinity Cloud | Sitefinity SaaS

This free lesson teaches administrators, marketers, and other business professionals how to use the Integration hub service to create automated workflows between Sitefinity and other business systems.

Web Security for Sitefinity Administrators

This free lesson teaches administrators the basics about protecting yor Sitefinity instance and its sites from external threats. Configure HTTPS, SSL, allow lists for trusted sites, and cookie security, among others.

Foundations of Sitefinity ASP.NET Core Development

The free on-demand video course teaches developers how to use Sitefinity .NET Core and leverage its decoupled architecture and new way of coding against the platform.

Was this article helpful?