# Shortcode Parameters

The Click to Share box can be enabled via shortcode. Here's a simple shortcode in use below: {% code overflow="wrap" %} ``` [has_click_to_share]This is some text I'd like to share.[/has_click_to_share] ``` {% endcode %} It'll produce a default Click to Share box like shown below:

Default Appearance of Click to Share Shortcode

Here's a diagram of the various parts of the Click to Share box.

1. Click to Share text - This is the text that will be shared with the social networks. 2. Click to Share button text - This is the text that is displayed for the Click to Share button. 3. Click to Share icon - The icon used for the Cilck to Share button. Here are the shortcode arguments available for the Click to Share shortcode box. ### unique\_id Use this to wrap a unique ID around the shortcode, otherwise it'll be random. ### theme Can be: * default (light appearance) * purple * blue * dark * orange * pink * none (choose to define your own styles) * custom-slug (see creating your own [Custom Shortcode Themes](https://docs.dlxplugins.com/highlight-and-share/click-to-share-shortcode/custom-shortcode-themes)).

### align Can be: * left * center (default) * right ### show\_click\_to\_share Show the Click to Share section with text and an icon. Can be: * true (default) * false Example: {% code overflow="wrap" %} ``` [has_click_to_share show_click_to_share="false"]This is some text I'd like to share.[/has_click_to_share] ``` {% endcode %} ### show\_click\_to\_share\_text Show or hide the label in the Click to Share icon section. Can be: * true (default) * false Example: {% code overflow="wrap" %} ``` [has_click_to_share show_click_to_share_text="false"]This is some text I'd like to share.[/has_click_to_share] ``` {% endcode %}

Click to Share With Sharing Label Hidden

### show\_icon Show or hide the icon in the Click to Share icon section. Can be: * true (default) * false {% code overflow="wrap" %} ``` [has_click_to_share show_icon="false"]This is some text I'd like to share.[/has_click_to_share] ``` {% endcode %}

### icon Determine which sharing icon will be used in the Click to Share box. Can be: #### has-share-1

#### has-share-2

#### has-share-3

#### has-share-4

#### has-share-5

#### has-share-6

#### has-share-7

#### has-share-8

#### has-share-9

Example: {% code overflow="wrap" %} ``` [has_click_to_share theme="purple" icon="has-share-9"]This is some text I'd like to share.[/has_click_to_share] ``` {% endcode %} ### icon\_size Determine the icon size of the Click to Share icon section. Can be: * small * medium (default) * large Example: {% code overflow="wrap" %} ``` [has_click_to_share theme="pink" icon_size="large"]This is some text I'd like to share.[/has_click_to_share] ``` {% endcode %}

### custom\_share\_text Input text that will be shared instead of the wrapped sharing text. Example: {% code overflow="wrap" %} ``` [has_click_to_share custom_share_text="Share this instead"]This is some text I'd like to share.[/has_click_to_share] ``` {% endcode %} ### font\_family Choose the font family that will be used for the Click to Share shortcode. Can be: * (or custom font family) Example: {% code overflow="wrap" %} ``` [has_click_to_share theme="purple" icon="has-share-9" font_family="Josefin Sans" button_font_family="Lato"]This is some text I'd like to share.[/has_click_to_share] ``` {% endcode %} ### button\_font\_family Choose the font family that will be used for the Click to Share button. Can be: * (or custom font family) Example: {% code overflow="wrap" %} ``` [has_click_to_share theme="purple" icon="has-share-9" font_family="Josefin Sans" button_font_family="Lato"]This is some text I'd like to share.[/has_click_to_share] ``` {% endcode %} ### click\_text This will change the Click to Share button text.

Custom Share This Text in the Button Area

Example: {% code overflow="wrap" %} ``` [has_click_to_share theme="purple" click_text="Share This!"]This is some text I'd like to share.[/has_click_to_share] ``` {% endcode %} ### margin Specify the margin that'll be used for the Click to Share shortcode. This will override a theme default. Default: empty. Example: {% code overflow="wrap" %} ``` [has_click_to_share margin="20px auto"]This is some text I'd like to share.[/has_click_to_share] ``` {% endcode %} ### padding Specify the padding that'll be used for the Click to Share shortcode. This will override a theme's default styles. Example: {% code overflow="wrap" %} ``` [has_click_to_share theme="purple" padding="35px 45px"]This is some text I'd like to share.[/has_click_to_share] ``` {% endcode %} ### icon\_color, icon\_color\_hover

Set the default color and hover color of the Click to Share icon. Example: {% code overflow="wrap" %} ``` [has_click_to_share theme="purple" icon_color="#f58220" icon_color_hover="#e76f1a"]This is some text I'd like to share.[/has_click_to_share] ``` {% endcode %} ### text\_color, text\_color\_hover Set the default and hover color value of the main body text in the Click to Share box. Example: {% code overflow="wrap" %} ``` [has_click_to_share theme="purple" text_color="#f58220" text_color_hover="#e76f1a"]This is some text I'd like to share.[/has_click_to_share] ``` {% endcode %} ### share\_text\_color, share\_text\_color\_hover Set the default and hover color of the sharing button. Example: {% code overflow="wrap" %} ``` [has_click_to_share theme="purple" share_text_color="#f58220" share_text_color_hover="#e76f1a"]This is some text I'd like to share.[/has_click_to_share] ``` {% endcode %} ### background\_color, background\_color\_hover Set the default and hover background color of the Click to Share box. Example: {% code overflow="wrap" %} ``` [has_click_to_share theme="default" background_color="#dee2e6" background_color_hover="#FFFFFF"]This is some text I'd like to share.[/has_click_to_share] ``` {% endcode %} ### font\_size The font size of the sharing text in the Click to Share box. Can be: * small * medium (default) * large Example: {% code overflow="wrap" %} ``` [has_click_to_share theme="default" font_size="large"]This is some text I'd like to share.[/has_click_to_share] ``` {% endcode %} ### click\_share\_font\_size The font size of the sharing button in the Click to Share box. Can be: * small * medium (default) * large Example: {% code overflow="wrap" %} ``` [has_click_to_share theme="default" click_share_font_size="large"]This is some text I'd like to share.[/has_click_to_share] ``` {% endcode %} ### border, border\_hover Set the CSS border of the Click to Share box in normal and hover state. Example: {% code overflow="wrap" %} ``` [has_click_to_share theme="default" border="1px solid red" border_hover="1px solid black"]This is some text I'd like to share.[/has_click_to_share] ``` {% endcode %} ### border\_radius Specify the CSS border radius of the Click to Share box. Example: {% code overflow="wrap" %} ``` [has_click_to_share theme="default" border_radius="10px"]This is some text I'd like to share.[/has_click_to_share] ``` {% endcode %} ### max\_width The maximum width of the Click to Share box. Can be any valid CSS width. Example: {% code overflow="wrap" %} ``` [has_click_to_share theme="default" max_width="550px" border_radius="10px"]This is some text I'd like to share.[/has_click_to_share] ``` {% endcode %}