ebrueggeman

<p>The Skinnytip Tooltip Generator is a WordPress plugin that allows easy creation of JavaScript pop-up tooltips<br />
while creating content. The plugin is visible on the admin write post and write page areas. After inputting<br />
the content and an optional title of the tooltip, the plugin will automatically generate the neccessary<br />
JavaScript code to attach the tooltip to a link or image.</p>
<p>The user can optionally open up the advanced options and change the width, padding, border, and colors of<br />
the tooltip.</p>
<p>Tooltips can be previewed by hovering the cursor over the “preview this tooltip” link.</p>
<p>When the tooltip is satisfactory, copy and paste the tooltip code into the HTML view of the post or page.</p>


Skinnytip Tooltip Generator

The Skinnytip Tooltip Generator is a Wordpress plugin that allows easy creation of JavaScript pop-up tooltips while creating content.

dreihochzwo

<p>If an ACF field requires a longer instruction text, the layout of the edit screen is messy and a lot of space is wasted.</p>
<p>The ACF Tooltip plugin hides the field instructions, adds a help symbol to the field labels and generates a tooltip based on the instruction text.</p>
<h4>New in Version 1.2.0</h4>
<p>The tooltip will not hide if moused over, allowing create a tooltip with a link inside without hiding the tooltip.</p>
<h4>Custom settings</h4>
<p>There are 7 filters that allow adjusting the design and the behavior of the tooltips.</p>
<p><strong>This plugin works only with the <a href="https://www.advancedcustomfields.com/pro/" rel="nofollow ugc">ACF PRO</a> (version 5.5.0 or higher).</strong></p>
<h4>Localizations</h4>
<ul>
<li>English</li>
<li>Deutsch</li>
</ul>
<h3>Custom settings with filter hooks</h3>
<p>There are 7 filters that allow adjusting the design and the behavior of the tooltips can be adjusted.</p>
<h4>Set the design of the tooltips</h4>
<pre><code><?php
function acf_tooltip_style() {
    $style = 'qtip-acf';

    return $style;
}
add_filter('acf/tooltip/style', 'acf_tooltip_style');
?>
</code></pre>
<p>The available styles can be found on the <a href="http://qtip2.com/options#style" rel="nofollow ugc">qTip options page</a> and are shown on the <a href="http://qtip2.com/demos/" rel="nofollow ugc">qTip demo site</a>.</p>
<p>You can mix the styles; e.g. “qtip-acf qtip-rounded qtip-shadow”</p>
<p>If you like, you can define your own style, with the class name of your style from your own CSS file (see next filter).</p>
<p>The qtip-acf style is the standard style, which is set without a filter.</p>
<h4>Define your own CSS file</h4>
<pre><code><?php
function acf_tooltip_css() {
    $css_file = get_bloginfo('template_url') . '/qtip-own.css'; // if the file is saved in your themes folder

    return $css_file;
}
add_filter('acf/tooltip/css', 'acf_tooltip_css');
?>
</code></pre>
<p>You will find a ‘qtip-example-style.css’ in the ‘/assets/css’ folder.</p>
<h4>Positioning the corner of the tooltip</h4>
<pre><code><?php
function acf_tooltip_position_my() {
    $position_my = 'center left';

    return $position_my;
}
add_filter('acf/tooltip/position/my', 'acf_tooltip_position_my');
?>
</code></pre>
<h4>Position in relation to the tooltip icon</h4>
<pre><code><?php
function acf_tooltip_position_at() {
    $position_at = 'center right';

    return $position_at;
}
add_filter('acf/tooltip/position/at', 'acf_tooltip_position_at');
?>
</code></pre>
<p>Check out the <a href="http://qtip2.com/demos/" rel="nofollow ugc">qTip demo site</a> to find your perfect positioning.</p>
<h4>Apply tooltips only to fields with specific class</h4>
<pre><code><?php
function acf_tooltip_class() {
    $class = 'with__tooltip'; // edit this to your prefered class name

    return $class;
}
add_filter('acf/tooltip/class/only', 'acf_tooltip_class');
?>
</code></pre>
<p>Add the class to the fields where you want to show tooltips.</p>
<h4>Exclude tooltips on fields with specific class</h4>
<pre><code><?php
function acf_tooltip_class_exclude() {
    $class = 'no__tooltip'; // edit this to your prefered class name

    return $class;
}
add_filter('acf/tooltip/class/exclude', 'acf_tooltip_class_exclude');
?>
</code></pre>
<p>Add the class to the fields where you <em>don’t</em> want to show tooltips.</p>
<h4>Add tooltips to the Field Editor</h4>
<p>With this filter, you can specify whether the instructions in the Field Editor are displayed as tooltips as well. By default, the instructions are displayed.</p>
<pre><code><?php
add_filter('acf/tooltip/fieldeditor', '__return_true');
?>
</code></pre>


ACF Tooltip

Great plugin! Does the job well. However, a bit heavy; for large use cases where you have many ACF fields, I have seen a significant performance drop in the WP dashboard and increased load times.

Excellent!

Displays ACF field instructions as tooltips

Skinnytip Tooltip Generator vs ACF Tooltip