Introduction to the Pin Board Block

Prior to 3.7, the only way you could use our Pin Board block was to purchase it. However, starting with version 3.7, Pin Board is included as a Core Headway Block! Because of that change, we thought we should introduce this powerful block.

PinBoard is based off of the website, Pinterest. It’s meant to give you an easy way to display your content in a similar way as that website.

Select Pin Board as your block type

So to get started, you first need to add a Pin Board block to your layout. In my example, I’m adding it to my Blog Index.

37-pinboard-choose-block

Change the Block Options

Once you select Pin Board as your block type, the options panel will open automatically. The first section is called Pin Setup.

Block Options: Pin Setup

For purposes of this post, we’re leaving the mode set to default. Then you can change the number of columns you want your pins/posts to display in, the spacing between posts horizontally and vertically.

37-pinboard-block-options-1

Here I’m leaving everything default except I’m changing the number of columns to four (4). Pin Board pulls the featured image you have assigned to a post. In my screenshot, Test Post 3 has no featured image so no image displays in the pin.

37-pinboard-block-options-2

Then, at the bottom of the first tab of block options, you have the Pagination and ordering options.

37-pinboard-block-options-3

Note: If you want pagination to show, you’ll need to turn off “Infinite Scrolling” which is on by default.

Block Options: Text

Here you can change the meta options that display, whether to show post titles, whether post titles will be a link, the position of the pin image and more!

37-pinboard-block-options-4

Block Options: Image

Choose whether to show any images, what happens when a visitor clicks the image in the pin and whether your image(s) should be cropped.

Block Options: Effects

Here’s where you’ll find Infinite Scrolling. (Remember: turn this off, if you want to show pagination links). Infinite Scrolling is where a visitor scrolls down to view more pins and the next page of pins automatically loads. The visitor does not have to click on “Page 2” (for example) to load the next page of pins.

Here’s what your visitor will see upon scrolling down

37-pinboard-block-options-infinite

You’ll also find Hover Focus in this area. This effect changes the opacity to all posts a visitor is not hovering over lower while retaining 100% opacity on the post being hovered over.

37-pinboard-block-options-hf

Block Options: Social

This area lets you show some social tools like a Pinterest “pin it” button, a “tweet” button for Twitter, your Twitter username and more!

In Closing

The remaining block options are the standard block options. Pin Board is a versatile block that gives you a fresh way to display your content.

It works on all layouts, so try it out! If you run into any issues, please let us know!

Spread the word!

17 Responses

  1. Hi, I just upgraded to Headway 3.7 and all my pin blocks are acting up… I had to remove them in the hopes that the issue will disappear.

    Here is what I ran in to:
    1. The block is not showing up on the website. Just white space appears where the block would be.
    2. The block shows up twice, even though there is only one block in the visual editor.

    Any ideas what may be going on?

    I just upgraded 15 minutes ago. Sadly, I don’t remember what version I upgraded from.

    – Ulrich

    PS: Here is a page where you can check it out: http://salsaclassroom.com/video-day/ … Settings are: Infinite scrolling off, max 10 posts, default behavior

    • Did you deactivate the Headway PinBoard plugin? Keeping it active can cause issues since PinBoard is built into Headway in 3.7.

  2. I have one site with an older version of pinboard I purchased and it works great. My latests site with pinboard included with Headway is acting up. Every time I type in the URL it looks ok. If I refresh the page the images in the pinboard blocks become squished vertically. No matter how many times I refresh the page the images stay squished. Rarely refreshing the page will not affect the images. Wondering what I should do. Here is the site. The pinboards are on right right side on the page… only one column with two pins. http://www.peacockbassfishingflorida.com/

    • Hi Matt,
      Are you still having this issue? If so, please start a thread in the forums so we can help. Sorry we missed this!

    • There is not. You can set it so that if a visitor clicks on the image it takes them to the post (as well as clicking on the post title).

      A read more link is something we could look into.

  3. Is it possible to use pinboard on a page and not tied into posts. Just want to try photos on a page using pinboard.

  4. Hi can this feature be included for the Ping board allowing us to Select a specific category to display posts using the ping boarder. right now it just display the hole post.

  5. Could we get 3 layouts with this Block? It would be nice to have HD column, a tablet column, then a Smart Phone column.

    This way I could get a 4 column, 2 column, 1 column layout for better user presentation based on their device.

Leave a reply

Copyright © 2016 Vesped Inc. All Rights Reserved. Proudly Powered by Headway and WordPress