WordPress Tooltips Video Tutorial 6: custom tooltip box color, font, underline, Shadow… and more

How to customize your tooltip style with wordpress Tooltips Pro

WordPress Tooltip Pro offers many awesome configuration options to control the appearance of tooltip.

You can modify the settings to give the control a unique appearance for the tooltip

1. Logging in to your WordPress admin area and Click on Tooltips » Tooltips Style Settings in your WordPress admin sidebar.

2. Go to the panel “Tooltips Box Customize Setting”, the following settings control the style of tooltips.

customize your tooltip style with wordpress Tooltips Pro

Tooltip Box Width (required field)

You can customize the width of tooltip here, for example, “400” means “400px” for tooltip popup box.

WordPress Tooltip Box Background (required field)

You can changer wordpress tootlip popup box background easily with color picker.

WordPress Tooltip Box Background

WordPress Tooltip Font Color (required field)

You can use the color picker to select an exact tooltip font color.

WordPressTooltip Box Position (required field)

WordPress tooltip plugin provide 8 options for tooltip positon, they are bottomRight, bottomLeft, topRight, topLeft, topMiddle, bottomMiddle, rightMiddle, leftMiddle.

WordPress Tooltip Box Position

WordPress Tooltip Text Align (required field)

WordPress Tooltip Text Align has three option: left, right, center.

WordPress Tooltip Box Padding (required field)

You can set the padding property for wordpress tooltip popup box, for example, “10” means “10px”.

WordPress Tooltip Class Name (required field)

Define a class name for your tooltip.

WordPress Tooltip Border Radius (required field)

You can give the tooltip popup box rounded corners by applying Tooltip Border Radius, “5” means “5px”.

WordPress Tooltip Border Width (required field)

“Border Width” specifies the width of the border of tooltip, fox example, “3” means “3px” for the border.

WordPress Tooltip Border Color (required field)

You can use color picker to select a border color for your tooltip.

WordPress Tooltip Shows When (required field)

“Tooltip Shows When” means how to trigger tooltip, Tooltips Pro provides nine trigger methods, Mouse Over, Mouse Leave, Mouse Enter, Mouse Out, Mouse Move, Mouse Up, Mouse Down, Double Click, Click.

WordPress Tooltip Shows When

WordPress Tooltip hides when (required field)

Tooltips Pro provides 10 ways to make tooltip popup box disappear, they are Mouse Over, Mouse Leave, Mouse Enter, Mouse Out, Mouse Move, Mouse Up, Mouse Down, Double Click, Click, Stay Open A While.

WordPress Tooltip hides when

WordPress Tooltip Opacity (required field)

WordPress Tooltips Pro Plugin help you create a transparent tooltip popup box, the opacity property can take a value from 0.1 – 1.0, The lower value, the more transparent.

WordPress Tooltip Border Bottom (required field)

You can set the css style of border bottom for the tooltip keywords, there are five options to select, Dotted, Double Line, Solid, Dashed, hidden.

WordPress Tooltips Underline Color (required field)

You can use color picker to select the underline color of worpress tooltip keyword.

WordPress Tooltips Shadow (required field)

You can select to disply or hide shadow.

WordPress Tooltip Font Size (required field)

You can set the font size for the tooltip, “12” means “12px”.

WordPress Tooltip line Height (required field)

You can set line Height for the tooltip, for example “1.5”.

That is all, WordPress Tooltips Pro Plugin help you create the unique tooltip in just a few clicks.

wordpress tooltip customize demo