Hover on the above image, you can see the save to Pinterest button. This is what to achieve, RIGHT?
Here is a step by step tutorial on how to add Pinterest image hover save button to your website. This article is written keeping WordPress users in mind but you can apply these steps with a little tweak on your non-WordPress websites too. Let’s start:
How to Add Pinterest Image Hover Save Button
Step 1: Log in to your WordPress website and navigate to ‘Theme Editor’
Step 2: Under ‘Theme Editor’, head over to ”footer.php’
1. Pinterest Image Hover Save Round Button
Save changes, reload the website and hover on any image to see the Pinterest save button.
<script async defer data-pin-hover="true" data-pin-tall="true" data-pin-round="true" src="//assets.pinterest.com/js/pinit.js"></script>
2. Pinterest Image Hover Save Rectangular Button
Here comes, another detailed Pinterest image hover save button. I personally prefer this one, you can add this using the same steps described above. i.e. Under footer.php, scroll down to the bottom, add the below code right before the </body> tag.
Save changes and reload the website. Done
<script async defer data-pin-hover="true" data-pin-tall="true" src="//assets.pinterest.com/js/pinit.js"></script>
Alternatively, you can visit Pinterest developer tools directly and add image hover save button.