Configuring User Defined Labels
Quick Start
The User Defined Labels widget is baked into your microsite. If you're using a microsite, you can skip the widget setup and see Platform Configuration for your next steps. Or, if you want to use the widget on your website and you haven't configured your site to use widgets yet, see the Quick Start Guide.
If the shared script hasn't been added to your website, add it to the appropriate webpage, replacing "example-church.com" with the base URL of your church's website.
Create a webpage on your website that will display your widgets or identify the page on your website where they will be displayed.
Add the User Defined Labels widget to your church website by placing this snippet of code in the body of your chosen webpage, modifying the required attributes. Ideally, it will be added in conjunction with the Language and Locale widget.
Platform Configuration
- You must be a system administrator to do this.
Set up each application label you want the User Defined Labels widget to display on your site.
Your label is now ready to be added to the Widget Configuration.
Once you add your label in the widget, you can place the widget code on your website where you want that label to display. Then, depending on which language a user has selected, they'll see the translated text.
Widget Configuration
Required Attributes
- Label Name: Associates the application label you set up with this widget so it can display on your site.
- Attribute: name
- Valid Value: label name you defined in Application Labels, without the prefix "mpp-user-label."
- Example: If your application label was called "mpp-user-label.SampleLabel", your Label Name would look like this:
name="SampleLabel"
Optional Attributes
- Bare Text: Determines whether to include CSS selectors or just a bare text object for your label.
- Attribute: bare
- Valid Value: true or false; if true, the label will just display bare text with no extra markup or CSS applied
- Example:
bare="true"
Configure Your Widget
Fill out the Widget Configurator below, copy your generated widget code, and paste it into your website.
Customization
You can customize User Defined Labels to be consistent with your branding, look, and feel!
CSS: Every Widget accepts the Custom CSS attribute. Include it before the opening Widget tag is closed to customize your Widgets.
- #mppw-user-label: Use to select the label by its ID.
- .mppw-component-container: This class is used in several widgets.
- .mppw-user-label: Use this class to style all user defined labels on the page in the same way.
- .mppw- appended with the label name (without any spaces or special characters): Use this class to style the individual user defined label.