delwinv

A very tiny plugin that adds the ACF field key, field name, Flexible Content field name and Flexible Content layout name to the WYSIWYG 
editor body tag, allowing you to target these classes, along with the existing post-type-* classes added by default by WordPress, in 
your editor-style.css for a better admin/editor experience.
This works for both ACF and ACF Pro, version 5.
<h3>Usage</h3>
<ol>
<li>Install the plugin through the Install Plugins interface or by uploading the <code>acf-plugin-wysiwyg-styling</code> folder to your <code>/wp-content/plugins/</code> directory.</li>
<li>Activate the ACF WYSIWYG Styling plugin from the Admin > Plugins menu.</li>
<li>Create or edit your editor-style.css in your theme directory and use the newly added classes to style your WYSIWYG editors.</li>
</ol>
For example:
<ul>
<li>
The ACF WYSIWYG field with key field_9999ffff11112222 can be targeted with the following CSS:
body.acf-field-key-field_9999ffff11112222 { 
 background-color: red; 
}
</li>
<li>
The ACF WYSIWYG field with key field_9999ffff11112222 in the “room” post type can be targeted with the following CSS:
body.post-type-room.acf-field-key-field_9999ffff11112222 { 
 background-color: blue; 
}
</li>
<li>
All ACF WYSIWYG fields named “my_wysiwyg” can be targetted with the following CSS:
body.acf-field-name-my_wysiwyg { 
 background-color: yellow; 
}
</li>
<li>
All ACF WYSIWYG fields in the Flexible Content field named “page_content” can be targetted with the following CSS:
body.acf-flex-name-page_content { 
 color: green; 
}
</li>
<li>
All ACF WYSIWYG fields in the Flexible Content layout field named “test_layout” can be targetted with the following CSS:
body.acf-layout-test_layout { 
 font-family: “Computer Modern Serif”; 
}
</li>
<li>
The ACF WYSIWYG field named “my_wysiwyg” in the Flexible Content layout field named “test_layout” can be targetted with the following CSS:
body.acf-layout-test_layout.acf-field-name-my_wysiwyg { 
 border: 4px solid red; 
 height: 100%; 
 margin: 0 auto; 
 max-width: 100px; 
}
</li>
</ul>
N.B. I target using the body tag so that a user cannot accidentally target the admin CSS in their edit of the field (regardless of how unlikely 
that would be).

ACF WYSIWYG Styling

Provides the necessary CSS classes in ACF WYSYWIG editor to allow for complete styling of the admin interface.

clinton101

Hub5050

CTA Button Styler is a plugin for WordPress that allows easy styling of existing buttons in WordPress. Buttons labelled with the cta101 class can be easily turned into effective Call To Action buttons which will encourage visitors to stay on the site and click through to the desired page.
Reducing your bounce-rate (i.e. get visitors to look at more than one page on your site) is important for your site ranking. Using effective call-to-action buttons encourages visitors to click through and visit other pages thereby reducing your overall bounce rate and potentially increasing your ranking.
CTA button styler is designed with flexibility and ease of use in mind. It is easy to install. Does not consume any unnecessary resources and simply does what it needs to do to keep visitors on the site.
You get to decide the button styles, hover-styles and effects for your button. You can also change the call-to-action buttons at any time according to your needs or to test whether a different style leads to more click-throughs.
This is an early release version of the plugin. We are working on more advanced options like AB testing, image buttons and potentially lead identification. These advanced features will be rolled out in a future version of the software.
For more information, check out plugin page at <a href="http://myinfo.ie/CTA-Button-Styling/" rel="nofollow ugc">Help</a> or see the <a href="http://www.creatorseo.com/" rel="nofollow ugc">Working demo on CreatorSEO</a> on our site.
<h4>Key Features</h4>
<ul>
<li>Ultra easy to apply using a defined button class</li>
<li>Configure margins and padding</li>
<li>Set background and text colors</li>
<li>Customize borders and border radius</li>
<li>Configure hover styles</li>
<li>Optional animation effects (Shake, Buzz, Blink)</li>
<li>Automatically generated and cached CSS file</li>
<li>Clean uninstall (removes settings and generated files)</li>
<li>No inline CSS injection</li>
<li>No runtime CSS generation</li>
</ul>
<h3>Usage</h3>
After saving your settings, use the configured CSS class in your theme:
Example:
<pre><code><a class="cta101" href="#">Click Here</a>
</code></pre>
Or apply it to a menu item using the WordPress menu class field.

CTA Button Styler

Increase engagement with reusable CTA buttons, styled your way with hover effects and optional animations. Clean and efficient.

ACF WYSIWYG Styling vs CTA Button Styler