dreihochzwo

<p>The ACF Tab & Accordion Title Icons plugin extends the ACF Tab and Accordion field settings to add an icon to the titel.</p>
<p>There are more than 240 icons you can use for your Tabs and Accordion titles. If you miss any icon, leave a comment in the support forum. If it’s not too fancy, I’ll add it in the next version.</p>
<p>Or use the possibility to add your own icon font. See instructions below.</p>
<p>In addition, the display of the title can be suppressed so that only the icon is displayed.</p>
<p><strong>This plugin works only with the <a href="https://www.advancedcustomfields.com/pro/" rel="nofollow ugc">ACF PRO</a> (version 5.6.7 or higher).</strong></p>
<h4>Localizations</h4>
<ul>
<li>English</li>
<li>Deutsch</li>
</ul>
<h3>Use your own icon font</h3>
<p>The plugin offers the possibility to use your own icon font.</p>
<p>Generate your icon font with the free <a href="https://icomoon.io/" rel="nofollow ugc">IcoMoon App</a>.</p>
<p>Each icon should have an unique name in the icons options. Use the tags in the icon options for the name(s) of the icon shown in the selectbox on the ACF field settings.</p>
<p>Download your font and extract the zip file generated by IcoMoon.</p>
<p>In your (child) themes folder add a folder named ‘acf-title-icons’ and copy the ‘fonts’ folder, the ‘selection.json’ and the ‘style.css’ from the extracted zip file from IcoMoon into that folder.</p>
<p>After that, ACF Tab & Accordion Title Icons will use this icon font.</p>


ACF Tab & Accordion Title Icons

Add icons to the titles of ACF Tabs and Accordions

<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

ACF Tab & Accordion Title Icons vs ACF Tooltip