One of the crucial web design tips to ensure your business success is to have social media buttons integrated on your website. Regardless of whether your website is pushing out blog posts or featuring products, you want your content to be shareable so that visitors can easily share among their friends or post to their own social media accounts directly from your website.
In this blog we shall walk you through making your content shareable with social share buttons by integrating it with your Drupal 8 website using one of the popular modules available - the ShareThis Drupal module.
Integrating social media sharing tools with your website enables a better user experience. It is a great way to keep your audience engaged and also get some feedback. It helps grow your social reach and in turn can immensely boost the SEO of your website. So, what are you waiting for? Let's get started!
Customizing the social sharing buttons in Sharethis
Sharethis gives you various options to choose from so you can customize your social share buttons according to your website design and requirements. Before integrating the block with your Drupal website, let’s get started with customizing the social share buttons on the Sharethis website.
• Visit Sharethis and hit start.
• Next, you can select the type of sharing button that you would like for your website, either Inline or Sticky sharing buttons. The choice depends on your Drupal website design and your social sharing goals. Inline buttons are used when you want your social sharing buttons to appear at one particular position of your page, usually below the headline. While sticky buttons are can be placed at the side of the screen and be made available throughout the scrolling of the page. Research shows that 70% of websites prefer going with inline buttons. So, for now, let’s go with inline buttons.
• On the same page you are shown a preview of the share buttons. You can now personalize these buttons by clicking on “Customize”.
• You will be redirected to the page where you can customize your share buttons as per your need. The following settings are available:
o Select your social networks.
o Reorder the icons the way you prefer with just a drag and drop
o Choose an alignment that fits right in your design.
o Change the size and label of the icons. You can also include the number of shares done alongside the icons! Style the corners of the icons as per your requirement.
• Once you are done customizing the sharing buttons, click on Next. In the next step, you need to create an account with Sharethis if you are a new user or login directly if you already have an account. The last step is where you find the code that gets you started.
• Find the Property ID on your Dashboard and copy it as it is needed to activate the ShareThis block on your Drupal site.
Adding the Sharethis block on your Drupal Website
I. Enabling the Drupal Sharethis Block Module
• Download the Sharethis block Drupal module using your method of choice (composer recommended).
• Enable the module in your Drupal website.
II. Configuring the Sharethis module in Drupal 8
• After enabling the Sharethis Drupal module, head to the settings form at this location - /admin/config/user-interface/sharethis.
• Enter your Property ID (copied previously from the Sharethis dashboard) and select whether you want the sticky or inline method (Inline buttons in this case).
III. Placing the Sharethis Block
• Once you're done configuring the module you can place your Share this Drupal block on the website just like you would do with any other Drupal block. The block visibility settings in Block Layout can be used to determine which pages the ShareThis buttons should be shown on.
• Go to Structure > Block Layout, where you will choose the region to place it in. Next to the necessary region, you will click “Place block” and find the “ShareThis Block” on the available list. Another click on the “Place block” and, finally, on the “Save” button is all that's left.
• When configuring the block, you can select the content types and pages to display it on and user roles to display it to. The block title can be renamed to anything you would want users to see when they are supposed to share your content.
• Okay, that’s it! You can now see the social sharing buttons in your Drupal content pages as shown in the image below.
