Use the code NOVASHARE for 10% off!

How to customize the button appearance (style, layout, shape, color)

Novashare lets you easily customize the size, shape, and colors of your social sharing buttons.

Button style

There are six different styles you can use with the Inline Content share buttons and two different styles with the Floating Bar share buttons. You can also toggle labels on or off.

Solid (inline, floating)

Solid share buttons
Solid share buttons

Inverse (inline, floating)

Inverse share buttons
Inverse share buttons

Bordered Label (inline)

Bordered label share buttons
Bordered label share buttons

Bordered Button (inline)

Bordered share buttons
Bordered share buttons

Minimal Label (inline)

Minimal label share buttons
Minimal label share buttons

Minimal (inline)

Minimal share buttons
Minimal share buttons

Check out more button style combinations.

Follow the steps below to customize the style of your social sharing buttons in Novashare.

Step 1

Click into the Novashare plugin settings.

Novashare plugin settings
Novashare plugin settings

Step 2

You can customize the style of both your Inline Content share buttons and Floating Bar share buttons. Click on the tab for the one you want to change. In the example below, we are changing the style of the “Inline Content” share buttons.

Inline Content share buttons
Inline Content share buttons

Step 3

Scroll down and under “Button Style” select the style you want: Solid, Inverse, Bordered Label, Bordered Button, Minimal Label, or Minimal. Note: The default is solid.

Novashare button style
Novashare button style

Step 4

Scroll down and click “Save Changes.”

Button layout

There are seven different button layouts you can choose:

  • Auto Width
  • 1 Column
  • 2 Column
  • 3 Column
  • 4 Column
  • 5 Column
  • 6 Column

Here is an example of share buttons with a 4 column layout. Columns will span the width of your content container.

Share buttons with 4 columns
Share buttons with 4 columns

Follow the steps below to customize the button layout of your social sharing buttons in Novashare.

Step 1

Click into the Novashare plugin settings.

Novashare plugin settings
Novashare plugin settings

Step 2

You can customize the layout of your Inline Content share buttons. Click on the “Inline Content” tab.

Inline Content share buttons
Inline Content share buttons

Step 3

Scroll down and under “Button Layout” select the layout you want: Auto Width, 1 Column, 2 Columns, 3 Columns, 4 Columns, 5 Columns, or 6 Columns. Note: The default is auto width.

Novashare button layout
Novashare button layout

Step 4

Scroll down and click “Save Changes.”

Button size

Follow the steps below to customize the size of your social sharing buttons in Novashare.

Step 1

Click into the Novashare plugin settings.

Novashare plugin settings
Novashare plugin settings

Step 2

You can customize the size of both your Inline Content share buttons and Floating Bar share buttons. Click on the tab for the one you want to change. In the example below, we are changing the size of the “Inline Content” share buttons.

Inline Content share buttons
Inline Content share buttons

Step 3

Scroll down and under “Button Size” select the size you want: Small, Medium, or Large. Note: The default is medium.

Novashare button size
Novashare button size

Step 4

Scroll down and click “Save Changes.”

Button shape

Follow the steps below to customize the shape of your social sharing buttons in Novashare.

Step 1

Click into the Novashare plugin settings.

Novashare plugin settings
Novashare plugin settings

Step 2

You can customize the shape of both your Inline Content share buttons and Floating Bar share buttons. Click on the tab for the one you want to change. In the example below, we are changing the shape of the “Inline Content” share buttons.

Inline Content share buttons

Step 3

Scroll down and under “Button Shape” select the shape you want: Squared, Rounded, or Circular. Note: The default is squared.

Novashare button shape
Novashare button shape

Step 4

Scroll down and click “Save Changes.”

Button color

Follow the steps below to customize the color of your social sharing buttons in Novashare.

Step 1

Click into the Novashare plugin settings.

Novashare plugin settings
Novashare plugin settings

Step 2

You can customize the colors of both your Inline Content share buttons and Floating Bar share buttons. Click on the tab for the one you want to change. In the example below, we are changing the color of the “Inline Content” share buttons.

Inline Content share buttons

Step 3

Scroll down and under “Button Color” select the color you want. There is a color picker, so you can literally choose any color. You can also paste in any hex value. Note: The default is the social networks’ brand colors.

Novashare button color
Novashare button color

Step 4

Scroll down and click “Save Changes.”

Button hover color

Follow the steps below to customize the hover color of your social sharing buttons in Novashare.

Step 1

Click into the Novashare plugin settings.

Step 2

You can customize the hover color of both your Inline Content share buttons and Floating Bar share buttons. Click on the tab for the one you want to change. In the example below, we are changing the hover color of the “Inline Content” share buttons.

Step 3

Scroll down and under “Button Hover Color” select the color you want. There is a color picker, so you can literally choose any color. You can also paste in any hex value. Note: The default is simply a slightly darker shade of whatever you chose for the primary color. This way you can see a hover occurring.

Novashare button hover color
Novashare button hover color

Step 4

Scroll down and click “Save Changes.”

Remove spacing

Like your share buttons a little closer together? You can remove the spacing (margins). Here is an example.

Share buttons with no spacing
Share buttons with no spacing

Follow the steps below to remove spacing around your social share buttons.

Step 1

Click into the Novashare plugin settings.

Novashare plugin settings
Novashare plugin settings

Step 2

You can remove spacing on both your Inline Content share buttons and Floating Bar share buttons. Click on the tab for the one you want to change. In the example below, we are removing the spacing on the “Inline Content” share buttons.

Inline Content share buttons

Step 3

Scroll down and toggle on “Remove Spacing.”

Novashare remove spacing
Novashare remove spacing

Step 4

Scroll down and click “Save Changes.”

Was this article helpful?

Related Articles