I just got the FREE WP version!

awaiting update guys

1. Yes, the plugin supports this feature. 2. To open a specific page you can add the “page” url attribute like this http://dev.loc/wp53/ipages/flipbook/2?preview=1&page=2 3. The plugin doesn’t support this

i have used the envato elements plugin for this but i couldnt find the add image and linking that image features hence asked over here.

Go to book pages -> select one -> click on the “edit page” button in the toolbar -> add an image inside the “layers” tab -> select the new layer -> go to the layer tab and edit its data

awesome that worked only 1 query is there a way we can rename the url (ipages/flipbook/1) this is what it shows

we can’t rename the url, it’s hardwired into the code and should look like this …/ipages/flipbook/1?page=3

got it one final query can we set 2 page layout for desktop and 1 page layout for mobile.

It can be done via custom js code only.

can u help us or let us know the cost for the same.

Just add this code to the custom js tab

const $ = jQuery;
const book = this;
const $win = $(window);

$win.on('resize', () => {
  if($win.width() < 1024) {
     book.$container.addClass('mobile');
     book.setBookEngine('OnePageFlip');
  } else {
     book.$container.removeClass('mobile');
     book.setBookEngine('TwoPageFlip');
  }
});
book.$container.on('ipages:ready', () => {
  $win.trigger('resize');
});

added the code but the site page stopped working…here is the link : https://tinyurl.com/2p85k79p

sorry it worked awesome stuff man thanks a ton.

just one more query can the controls become bigger on mobile devices so it can be easily seen and clicked on desktop they appear fine but too small on mobile.

What do you mean by that? Can you make a screenshot?

open the link that i shared with you…the control buttons for zoom, next page etc are appearding very small on mobile devices can they be increased in size for mobile.

Try to add this style to the custom css section

.ipgs-flipbook.mobile .ipgs-toolbar {
   transform: scale(1.5) translate3D(-50%, 0, 0);
   transform-origin: left bottom;
}

hey just another query u have a download pdf button but there is no way to link a pdf to that…we are using images for the flip book.

It uses the url from the item general tab (pdf section), if you use PDF as source for a book.

ok so if i use image as the source it will not work?

Yes, the plugin can’t generate PDF from this type of source

ok…can we have a option for custom icon which can be linked with a pdf file or something?

With js code yes, it’s possible, we can handle the click event from this btn and download any document.

damm would wait for an update for this since we dont know js coding so cant implement it from our end.

I can provide a sample, it’s not difficult, but not user-friendly, because we should write code.

if you can provide us with a code for custom icon linking with pdf file that would be awesome…

Try this code, put it into the custom js section, but url should be yours.

const url = "http://dev.loc/wp53/wp-content/uploads/2023/01/Master-Catalogue-2015.pdf";

const instance = this;
const $ = jQuery;

const download = (url) => {
    const link = document.createElement('a');
    link.href = url;
    link.download = url.substr(url.lastIndexOf('/') + 1);
    link.click();
}

const $btn = instance.$container.find('.ipgs-control.ipgs-control-download');

$btn.off().on('click', (e) => {
    download(url);
});

hey i added this code in custom js section and also changed the pdf file to my file but nothing happens when i click on download pdf button am i missing something…

link for your reference : https://tinyurl.com/2p85k79p

You didn’t add the code as I can see. It contains mobile detection at the moment. The code should be like this in your case.

const $ = jQuery;
const book = this;
const $win = $(window);

$win.on('resize', () => {
  if($win.width() < 1024) {
     book.$container.addClass('mobile');
     book.setBookEngine('OnePageFlip');
  } else {
     book.$container.removeClass('mobile');
     book.setBookEngine('TwoPageFlip');
  }
});
book.$container.on('ipages:ready', () => {
  $win.trigger('resize');
});

//=====================
// New Code
//=====================
const url = "http://google.com/Master-Catalogue.pdf";

const download = (url) => {
    const link = document.createElement('a');
    link.href = url;
    link.download = url.substr(url.lastIndexOf('/') + 1);
    link.click();
}

const $btn = book.$container.find('.ipgs-control.ipgs-control-download');

$btn.off().on('click', (e) => {
    download(url);
});

done added this code as well but still no luck

I don’t understand where you are adding the code, as I see from the link https://www.dentmastersindia.com/wp-content/uploads/ipages_flipbook/1/config.json?ver=1679482210 that the code is old.

i am adding it in custom js section of this flipbook

Anyway, if you published a PDF book with the plugin, it does not matter it’s on the page as embedded in the div container or on the address https://NAME-OF-SITE.com/ipages/flipbook/1 user who has access can download this PDF, because it is loaded by the browser, though in a hidden form.

Can you update the plugin to make it so it doesn’t generate the https://NAME-OF-SITE.com/ipages/flipbook/1,2,3,4 | It’s a security issue since it’s so easy to phish PDFs this way – some needing to be secure. OR you could create a toggle that only admins or select user roles can see these pages. Whatever is easier.