Embed Pinterest Widgets
Here are some examples to show you how to embed Pinterest Widgets in Hippo CMS.
How to:
- Go to Pinterest Widget builder
- Select the widget you'd like to use, enter your Pinteres url and adjust sizes
- Click "Build It!"
- Scroll down to preview page. Continue adjust the size until you are happy.
In the 2nd example on the right, data-pin-board-width="210" - Copy and paste the code to Hippocms document (in html source mode)
- Edit the code to make it work in hippo: (see my example code below)
- Make sure to add " " before </a> tag.
- Insert "http:" before //assets.pinterest.com/js/pinit.js
- If you want the embedded widget to be responsive to different viewing devices - the widget's width is the full width of the content area, you should delete "data-pin-board-width="xxx"". See the first embed on right.
More info: https://developers.pinterest.com/docs/widgets/board-widget/
Embed a board widget
Use the following code to embed the board widget above:
----------
<a data-pin-board-width="450" data-pin-scale-height="60" data-pin-do="embedBoard" href="https://www.pinterest.com/cindzhao/test-board/" data-pin-scale-width="80">
</a>
<script src="https://assets.pinterest.com/js/pinit.js" type="text/javascript">
</script>
---