Article sections
Overview
Each position for automatic displaying share buttons in Easy Social Share Buttons contains an additional display option. Those options can be position specific reflecting the display method work or general related to the styles and networks.
You can access the settings of each position in Where to Display -> Positions and choose the position you need.
Position Options
Most of the positions in Easy Social Share Buttons for WordPress have additional options. Those additional options allow to further adjust display method options. For example, this can be the position of the sidebar, pop-up appearance, automatic triggers, etc.
General Design Options
The general design options persist in almost any position inside the plugin. They are responsible for change of the design, active social networks and you can also use it to hide location for specific devices.
Responsive Appearance
Those options you can use to hide the display method on a specific device. You can combine them with mobile options or use it stand-alone.
Style Library
The style library allows applying a ready design from the library. That design can be a pre-build inside the plugin or custom made (or transferred from another site or location).
If you select a style from the library plugin will load custom settings on this position. In case you need to remove that style you should deactivate the custom options.
Custom Code For The Display Method
The custom code enables the option to add custom HTML, CSS code, shortcode, etc. before or after the share buttons. This will help to build awesome looking customized displays of share buttons without modifying the code of the plugin.
The field you receive are:
- Before Display – that is the custom code section that will be added before the main plugin HTML element
- After Display – that is the custom code section that will be added after the main plugin HTML element.
If you decide to add CSS code we recommend doing this in Before Display section to avoid the blink effect when code is loaded after the element. The CSS should be wrapped in a <style> block. You also have access to a variable {instance_class} that represents the current unique class for the display.
Example:
<style type="text/css">{instance_class} li a { color: red !important; } </style>
Custom CSS Code
The custom CSS code works similarly to the custom code options. But we precise it only for adding CSS. Recommended if you need to customize additionally the display method appearance as this code will work only for that placement.
Example:
{instance_class} li a { color: red !important; }
Configure Custom Share Button Style & Network List
In the last section it the global position settings represent a full set of controls like in the global plugin settings for personalized button styles and social networks.
When the option is enabled for this position the styles are automatically changed to those on the screen. The position styles will be always with higher priority. Enabling the option may require to make a few additional adjustments over the look of buttons. If that happens you will also see a panel in the plugin general settings notifying about that.
Enabling the option will not overwrite the social networks immediately. If the field for the networks remains blank, the plugin will refer and use the general social networks you select (it will only change the styles). But if you select or network button in the options the position settings will start looking for just networks you choose here. And the general networks change will not reflect on the position settings – you will see a panel in the general settings about this.