› Forums › Easy FancyBox Pro › PDF on iPad and iPhone
Tagged: Google Viewer, PDF
- This topic has 7 replies, 3 voices, and was last updated 8 years, 5 months ago by
Rolf.
-
AuthorPosts
-
-
9 April 2015 at 07:06 #4782
Richard Barnhart
ParticipantWhen I try to open a pdf in fancybox on iPad or iPhone it just opens a blank box, the pdf does not load. Is there a setting that will make it responsive and available on mobile devices.
-
9 April 2015 at 18:18 #4789
RavanH
KeymasterTo view a PDF file in a browser, you need a PDF reader browser plugin. iDevices are known to not have that preinstalled nor is such a plugin available. The only solution is to use an external PDF viewer solution.
Something like the alternative method #2 on http://demo.status301.net/easy-fancybox-sandbox/pdf-embeds but I cannot tell you for how long Google will continue to allow displaying of files outside those hosted on Google Drive… Underneath the link, you’ll see example code of how this works in Easy FancyBox.
-
9 April 2015 at 21:56 #4791
Richard Barnhart
ParticipantI also saw an older post that had some code you could put in the footer that would disable the plugin for mobile devices. I tried it and it disabled the plugin for all devices including desktops, but again, it was an older post. Do you have new code like that I could use in the footer that works?
-
9 April 2015 at 23:54 #4792
RavanH
KeymasterThis code in a text widget should do the trick:
<script type="text/javascript"> var pixelRatio = window.devicePixelRatio || 1; //alert('Screen size: ' + window.innerWidth + ' / ' + pixelRatio + ' = ' + window.innerWidth/pixelRatio); if( window.innerWidth/pixelRatio < 420 ) { //alert('Fancybox disabled.'); easy_fancybox_handler = null; }; </script>
For testing purposes, remove the
//
in front of thealert(...)
lines. It will create a message stating calculated screen width and a message if FancyBox is disabled on smaller devices. Remove those alert lines after testing.EDIT: Oh, and change the value
420
to disable FancyBox starting from another screen size. -
10 April 2015 at 13:28 #4793
Richard Barnhart
ParticipantThanks. Will this work in the footer too? I have a large site and don’t want to put a text widget on every page.
-
11 April 2015 at 15:39 #4798
RavanH
KeymasterYes, in the themes footer.php is fine, as long as you place the snippet BEFORE/ABOVE the
<?php wp_footer(); ?>
call. When placed after it, the snippet will have no effect.But please be aware that theme updates will overwrite your changes, unless you’re using a custom theme. If you’re not using a custom theme, then you might want to create a child theme to prevent footer.php from being overwritten in the future.
-
21 April 2015 at 14:51 #4846
Richard Barnhart
ParticipantThanks, this is working great, except it turns of the fancy box for all files, not just pdf. Is there a way to make this script work for pdf files only? I still want my videos to work on iPad. Thanks.
-
21 April 2015 at 19:49 #4851
Rolf
KeymasterHi Richard,
Try replacing the line
easy_fancybox_handler = null;
in the code snippet with
jQuery('a[href*=".pdf"], area[href*=".pdf"]').addClass('nofancybox');
-
-
AuthorPosts
- You must be logged in to reply to this topic.