Social Share Buttons Examples
Check social buttons examples to reveal the full potential of the widget. Make sure it will suit your any goals.
Example 1: Inline buttons
The case shows four rectangle-shaped buttons for sharing info in the most popular media. They saved the authentic colors and show the names and symbols of the media. This is a good example of customization for cases where you want your buttons placed in a content zone, for example an article.
Example 2: Floating buttons
This is how you create buttons handy for all users - floating layout makes them follow the scroll up and down the page and always stay at hand. No chances that users will miss them from view. The design is minimalist, with square shape and only the icons of the media on buttons.
Example 3: Black Buttons
Using customization options, you can achieve a fully unique look of the widget. These buttons were designed to echo the general style and colors of the website. They are black-and white, geometrical, and minimalist thanks to having only the icons of the media on them - without the names.
Example 4: Share Icons
These nice and small buttons look really clean and neat on the page. They are of circle shape and material style, showing the symbols of the chosen media. Nice slide animation effect on hover adds some vivacity to the user experience. The buttons are aligned center, but you can also choose left and right variants.
Example 5: Small buttons
These buttons are of circle shape, but thanks to responsive width, the value was changed to make them oval and more substantial. The user have chosen Flat variant of the Style and left original media colors, but added black color and bounce animation on hover.
Example 6: Grid
Rectangle shaped icons are nicely arranged into a grid and show both the icons and the text with the names of the media. They will fit into a content zone, the finishing unit of some article or bottom of the page. An attractive slider animation is active on symbols and icons become black on hover.
Example 7: Share list
The author has edited the labels of the buttons and added a call to action to each one. There are no icons of the media - instead their names are added. The background of the buttons were changed to white and the color of the text is the one original for each of the media to establish the visual association.
Example 8: Messengers
To make it handy for users to share the content, in this example, there are buttons for the most popular messengers. The buttons save the original colors and show the name and the icon together. They are of rounded shape and thanks to Auto width, they fill exactly the right space on the page.
Join 305,165 customers already using Elfsight Apps
Get the taste of 50+ powerful apps by Elfsight. No credit card. Joining is free!
Get 20% discount now!