Tooltips are the little boxes that pop up when you hover over something to show some additional information in the context of each field

Tooltip Styles

Standard: This is the default tooltip that pop up when you hover over the element

Tips Above Field: Tooltip is displayed as a Text above the field name

Tips Below Field: Tooltip is displayed as a Text below the field name

Editing Tooltip Content

Joobi automatically creates tooltips for all products, however you can customize the content and format for the core elements and your created fields.

There 2 ways to edit a tooltip easily without having to touch CSS or PHP Files.

Option 1 Using Direct Edit

• From the admin panel, navigate to jApps >> Preferences
• Go to Views tab, locate "Direct Edit" and "Who can Edit" under Direct Editing section
• Specify the user role who can edit
• Click [Save] once you are done
• Now go back to the "View" you want to edit an element

Note: You can edit ALL the Tooltips even the core ones in the admin area and front-end to personalize the product. Once you update, all your customizations are preserved.

Direct Editing looks like this:

Option 2 Edit Tooltip direct from the Design area

• From the admin panel, navigate to jApps >> Design >> Views
• Locate the "View" you want to edit and click "Elements" to view the list of elements for that specific view
• Select the element that you want to edit the "Tooltip
• Enter your "Tooltip Content" under Tips

• Navigate to "Attributes" tab and select your "Tooltip Style".
• Click [Save] once you are done

In this article, I'll edit the product from front-end for vendors.
If you are not sure what is the name of the view you are actually editing, please read our article about "Views".

For Custom Fields Tooltip

You can add your Tooltip upon creation of the Field. However to edit the Styles, you need to follow above editing to access the "Element Attributes".

• From the admin panel, navigate to [any Joobi products] >> Tools >> Models & Fields
• From the creation page of your "Field", enter your Tooltip content under Description.