Pageflip in WordPress – Part II

May 8, 2014 by Abel Vincze | Filed under Tutorial.

Here is an example, what we can do with a simple shortcode [pageflip5] that turns into a Pageflip Book, using only media (images) uploaded to this Post:

(Featured with the Author’s and Publisher’s written permission. Illustrator: Pablo Montes de Oca Gutiérrez. Publishing House: Gente Nueva)

I only added 3 attributes to the shortcode to name the book, and to center it:

[pageflip5 id="yotenia10perritos" name="Yo tenia 10 perritos" CenterSinglePage="true"]

The images for the pages was uploaded using the Add Media button on the Post editing screen.

Add media to the post to use it in the Pageflip Book

Images uploaded to the Post can be free rearranged

Please note, that all images uploaded to the Post will be displayed in the Pageflip Book, if you want to insert additional images in the same post, they have to be uploaded to a different Post.

Link to the previous part of this article

In the next part of this article i will let you know, how to make Pageflip 5 books in a WordPress blog with custom page content: HTML content, text, images, links, etc.

To be continued…


14 Responses to “Pageflip in WordPress – Part II”

  1. Kalman says:

    Hi Abel,
    This stuff is awesome, I’m a complete layman, I’ve just tried, and it already works on my just started WordPress site.

  2. Chris Ray says:

    Hi Abel

    I think I love this but I find some of the descriptions a bit confusing/repetitive.
    I’m looking to incorporate it into a WP site but I’m having difficulty in general.
    Would you have a rough idea of when you might continue with the article about WP custom page content: HTML content etc?
    I realise I may be asking too much.
    But great work…

    Many Thanks

  3. Abel Vincze says:

    Thanks to both of You!

    Chris: i would be glad to make corrections to the article, just let me know please what you find confusing or repetitive.
    I try to find some time to make that article while making the next update of Pageflip 5.

  4. Gary says:

    It is working for me. I figured it out but it is showing all the images from the flipbook under the flip book. Am I missing something here? Do you have to place an end shortcode?

    • Gary says:

      I am testing this out first to see if I can use it for my purpose. I have a request for this feature. So I need to figure this out before purchasing it.

      • Gary says:

        Can you change the background to another color or an image while in full screen?

        • Abel Vincze says:

          Please send me the link of your book ( as there should be an issue;
          – If the book and the controls are missing: issue with Key
          – If the book is showing, but the images are all under the empty book: The images were inserted on the post. Don’t.

          • Gary says:

            The book is working and the images are showing under the book. The site is local for now. Again I wanna get used to it before I go and pitch it to the client. I will look into moving it to a test web site or host it locally (maybe in a virtual server or something) so you can see it. Have to do it anyways so…. the theme may be causing an issue. It shows posts in a slider kind of effect. The storyline board theme. I’ll look into that soon as I can. Only 2 weeks…… I’ll try it sooner……….

          • Gary says:

            You saying not on the post. Yet the directions in this post say to do just that. Im on the newest version of wordpress. The image suggests an older version of wordpress.

          • Gary says:


            You can use this link here. I will make it available for tonite and tommorrow if needed. Again I am just fooling around… Unsure how I want it to look just yet.

          • Gary says:

            Nevermind I get it now… It is simple actually. Once you upload it to the post you have to remove the references TAGS from the editor…..duh… I thought that at first would remove the images from the book also. My bad….

        • Abel Vincze says:

          Using CSS, you can do it.

          • Gary says:

            Okay what class or id is the one to change that background while full screen. I tried to find it in an inspector but the inspector finds basically a (div) with no formatting that alters the whole screen while also finding different sections under that div. So so far its no help in this case.

  5. Rodney Frost says:


    I’ve been a multimedia specialist for over 20 years. This product falls under the same scenario I have seen many times in the past. . . .
    “I created this really great product.”
    “Let’s start selling it”
    “ok, maybe we should show people how to use it”

    The problem with this scenario is customers get disenchanted with a product they cannot use right away. As customers, it’s not our job to learn how to make it work. It’s the developer’s job to show us how. Without proper documentation, this product goes nowhere. You are assuming people have knowledge of and or can make use of web coding techniques. There is only 1 tiny HTML link in a paragraph to get people to the tutorial. (which you haven’t even completed) because you’re still coding upgrades to a product people can’t use yet