Blog, Pinterest, WordPress, WordPress Shortcode

Show a Pinterest Follow, Pin, Board, or Profile Widget in WordPress With Shortcode

In this article we'll show you how to include various Pinterest widgets into your WordPress website with shortcode. The widgets are described in more detail on Pinterest's website . The 'Save Button' widget is excluded from the shortcode since standalone function is provided in this article, titled "Add a Pinterest Save Button over Every Image in WordPress". We've reluctantly included the 'Pin' widget into this shortcode since it includes parameters that differ from the other two ('Board' and 'Profile'). However, if you're aware of the differences the added complexity shouldn't be much of an issue.

The Result

For the purpose of the examples we'll use our own Pinterest account. Keep in mind that we haven't used the referenced account since early testing of our social media and marketing system.

Profile Widget

To render a profile widget we'll use the following: [pinterestwidget url="https://www.pinterest.com.au/beliefmedia/"] (note that you can include or exclude the country domain extension).

Board Widget

To render a board widget we'll use the following default shortcode: [pinterestwidget url="https://www.pinterest.com.au/beliefmedia/sydneynews/"]. To make it look a little different from the profile above we'll change the image width. The final shortcode is as follows: [pinterestwidget url="https://www.pinterest.com.au/beliefmedia/sydneynews/" image="150"]. The result:

Pin Widget

The individual pin widget differs in that the width, height, and image (size) attributes as described below are not available. Instead, we use small, medium (default), and large. The additional parameter of description applies for the pin widget (with values of 0 for no, default, or 1 for yes).

Follow Widget

The follow button is used in the same manner as the profile widget, except the additional shortcode of follow="1" applies. To render a follow button for @BeliefMedia we'll use [pinterestwidget url="https://www.pinterest.com/beliefmedia/" follow="1"]. The result:

beliefmedia

Shortcode Attributes

The following shortcode attributes are available.

url

The URL is the page URL as copied from your browser. We'll convert that URL into the appropriate string necessary to return the widget.

width

The width of your widget. This applies to the profile and board widget only.

height

The height of your widget. This applies to the profile and board widget only. If no height attribute is provided we'll use the same dimensions as the width (to return a square widget).

image

The size of each image in your widget. This applies to the profile and board widget only.

description

If returning a 'pin' widget, you may remove the pin description with pin="0".

follow

Since the profile and follow URLs are the same, use follow="1" along with the URL to return just the follow button (eg: [pinterestwidget url="https://www.pinterest.com/beliefmedia/" follow="1"])

The Pinterest JS (pinit.js) can be returned with each widget with js="1". If you plan on using a Pinterest Widget on every page, you should add the JavaScript just once. If you're using our shortcode that adds the save button over images, you won't have to add the JS code again. You could also choose to add the JavaScript to your WordPress page footer as described here. The JS is returned by default with the widget; alter the shortcode function if required.

size

The size only applies only when rendering the 'Pin' Widget. Available options are small (236px x 345px), medium (345px x 426px), and large (600px x 655px).

The Shortcode

Copy and paste the WordPress function into your theme's functions.php file or, if you sensibly have one installed, your custom functions plugin.

<?php

Show a Pinterest Follow Button, Pin, Board, or Profile Widget in WordPress With Shortcode

http://www.beliefmedia.com/pinterest-widgets-wordpress

function beliefmedia_pinterest_widget($atts) {

$atts = shortcode_atts(array(

'url' => '',

'type' => 0,

'width' => '400',

'height' => 0,

'image' => '100', /* width of images */

'description' => 1,

'follow' => 0,

'js' => 1, /* Consider including in head */

'size' => 'medium', /* small, medium, and large */

), $atts);

if ($atts['url'] == '') return 'No URL detected. Use something like [url="https://www.pinterest.com/pinterest/"] in your shortcode';

if (!$atts['height']) $atts['height'] = $atts['width'];

/* Profile: https://www.pinterest.com/pinterest/ */

if ( (preg_match("|^http(s)?://(www.)?pinterest.com(.[a-zA-Z]{2})?/([a-zA-Z]{3,15})/?$|i", $atts['url'], $match)) || ($atts['follow']) ) {

$return = ($atts['follow']) ? '<a data-pin-do="buttonFollow" href="https://www.pinterest.com/' . $match['4'] . '/">' . $match['4'] . '</a>' : '<a data-pin-do="embedUser" data-pin-board-width="' . $atts['width'] . '" data-pin-scale-height="' . $atts['height'] . '" data-pin-scale-width="' . $atts['image'] . '" href="https://www.pinterest.com/' . $match['4'] . '/"></a>';

/* Pin: https://www.pinterest.com/pin/99360735500167749/ */

} elseif (preg_match("|^http(s)?://(www.)?pinterest.com(.[a-zA-Z]{2})?/pin/([0-9]+)/?$|i", $atts['url'], $match)) {

$return = '<a data-pin-do="embedPin" data-pin-width="' . $atts['size'] . '"';

if (!$atts['description']) $return .= ' data-pin-terse="true"';

$return .= ' href="https://www.pinterest.com/pin/' . $match['4'] . '/"></a>';

/* Board: https://www.pinterest.com/pinterest/official-news/ */

} elseif (preg_match("|^http(s)?://(www.)?pinterest.com(.[a-zA-Z]{2})?/([a-zA-Z]{3,15})/([a-zA-Z\-]+)/?$|i", $atts['url'], $match)) {

$return = '<a data-pin-do="embedBoard" data-pin-board-width="' . $atts['width'] . '" data-pin-scale-height="' . $atts['height'] . '" data-pin-scale-width="' . $atts['image'] . '" href="https://www.pinterest.com/' . $match['4'] . '/' . $match['5'] . '/"></a>';

} else {

return 'We couldn\'t resolve your Pinterest URL. Check with the BeliefMedia website.';

}

/* Include Pinterest JS? */

if ($atts['js']) $return .= '<script async defer src="//assets.pinterest.com/js/pinit.js"></script>';

return '

<p style="text-align:center;">' . $return . '';

}

add_shortcode('pinterestwidget', 'beliefmedia_pinterest_widget');

If you require shortcode to work in a sidebar widget, you'll have to enable the functionality with a filter. If you're using our custom functions plugin, you'll have that feature enabled by default.

Considerations

Full details on the Pinterest Widgets can be found here . Additional options for rendering Pinterest data (via the API) will be provided in the future.
While it goes without saying, our Pinterest page isn't very good and isn't really worth following. It was used as an early testing ground for our client social application. We may use it again in the future to further demonstrate the capabilities of our marketing platform.
The regular expression for each URL matches an optional two-letter domain extension. If you're using any of the newer funky domains, simply alter the expressions as required.

Download

Title: Add a Pinterest Save Button over Every Image in WordPress
Description: Show a Pinterest Follow, Pin, Board, or Profile Widget in WordPress With Shortcode.
Download • Version 0.1, 1.1K, zip, Category: WordPress Shortcodes

Download our 650-page guide on Finance Marketing. We'll show you exactly how we generate Billions in volume for our clients.