How to Create 3D Flipbook in WordPress with Elementor

Aarati Parajuli
Dear HTML
Published in
5 min readSep 4, 2019

3D Flipbook WordPress plugins help you in creating eye-catchy 3D WordPress flipbooks with a lively turning effect. From your long and boring pdfs to stunning 3D Flipbooks, you can feel the change.

So are you ready! Today in this article we’ll learn how to create a brand new 3D flipbook. Using DFlip- 3D flipbook WordPress plugin as well as Elementor. DFlip is simple and easy to work with. Similarly, Elementor is the most popular and highly customizable page builder for WordPress.

The theme we are using is OceanWP. It is free multipurpose as well as a responsive theme for WordPress. You can create a leading site using these three gems: DFlip, Elementor, and OceanWP.

How to Install Elementor?

Elementor- WordPress Page Builder

Assuming you’ve already downloaded the Elementor plugin, installing it is as simple as installing any other plugins. Follow the six simple steps stated below:

  1. Login to your WordPress site and go to the wp-admin panel
  2. From the dashboard, go to Plugins -> Add New
  3. Click on Upload Plugin.
  4. Browse, then locate the downloaded plugin’s zip file.
  5. Click on Install Now
  6. After successful installation, don’t forget to click on “Activate Plugin”.

How to Install OceanWP?

OceanWP

If you’ve already downloaded OceanWP, then installing it is as simple as installing any other themes. Just follow the steps below:

  1. Login to your WordPress site and go to the wp-admin panel
  2. From dashboard, go to Appearance -> Themes ->Add New
  3. Click on Upload Theme.
  4. Browse, then locate the downloaded zip file.
  5. Click on Install Now
  6. After installation completes, don’t forget to click on “Activate”.

How to Install DFlip

DFlip- 3D Flipbook WordPress Plugin

Firstly, Download the DFlip plugin. Then installing it is similar to the installation of Elementor above. Just follow the six easy steps listed below:

  1. Login to your WordPress site and go to the wp-admin panel
  2. From the dashboard, go to Plugins -> Add New
  3. Click on Upload Plugin.
  4. Browse, then locate the downloaded plugin’s zip file.
  5. Click on Install Now.
  6. After installation completes, don’t forget to click on “Activate Plugin”.

Creating 3D Flipbook in WordPress:

After the successful installation process, we now proceed towards our main goal. Creating 3D Flipbook with DFlip- 3D Flipbook WordPress plugin is almost effortless. All you need to do is carefully follow the steps listed below.

Step 1: Add a New 3D Flipbook

Firstly, you’ll need to go to dFlip Books> Add New Book from the dashboard.

Create 3D Flipbook in WordPress

Step 2: Choose a book source type

Now, choose the book source type. DFlip can create 3D flipbooks from both pdf files and images. Here we’ll be creating 3D Flipbook from a PDF file. So choose the book source type “PDF”. You’ll need to choose book source type “Images” if you are going to create a flipbook from images.

Choose book source type

Step 3: Upload sources

Upload the pdf file you want to transform into an elegant 3D Flipbook. And then, PDF Thumbnail Image for PDF thumb in case you want to create Thumb Lightbox (optional).

Upload sources

Step 4: Copy Shortcode

After uploading the pdf file, you are only one click away from your new 3D Flipbook. As soon as you save the post as a draft, it generates a shortcode. Now copy the shortcode choosing desired view mode.

Copy ShortCode

Step 5: Create a new WordPress Post

Finally, here comes the special part of this tutorial. Now create a new post in your WordPress site by going through Posts -> Add New. Then, click on Edit with Elementor.

Create a new WordPress post

After clicking, you can see:

Select Element-ShortCode

Step 6: Paste the shortcode

Now scroll down through the elements to find a widget named “ShortCode”. Drag it into the post. Then, paste the shortcode inside the shortcode editor on the right side of the screen.

Lastly, click on APPLY and then on UPDATE.

Paste The ShortCode

Congrats! You’ve successfully created your first 3D flipbook using Elementor. You can see the newly created flipbook by viewing the post.

Have a look at my brand new 3D WordPress flipbook. It’s awesome :O

3D Flipbook using Elementor

How to customize the 3D Flipbook in WordPress?

Additionally, DFlip offers great customizability. You can easily customize your flipbook to look like what you desire. With the help of DFlip, you can give a new amazing life to old inactive pdf contents.

Customize layout
customize outline

It is almost effortless to change the layout or to add an outline to your Flipbook. Just go to dFlip Books > All Books. Click on Edit to customize the book. Moreover, DFlip it offers lots of options to create the flipbook of your imagination.

Thank you for reading to the end :). Feel free to comment on if you have any queries?

--

--