WordPress.org

Forums

WP Photo Album Plus
[resolved] Popup no longer working. (16 posts)

  1. DarrenShan
    Member
    Posted 1 year ago #

    I'm not sure if the last update has caused this but I've just noticed that when I hover over a photo, they no longer 'popup'

    Table I, C8 is set up 300 pixels

    http://www.rigsville.com/?p=713

    Version 5.0.10

    http://wordpress.org/extend/plugins/wp-photo-album-plus/

  2. Jacob N. Breetvelt
    Member
    Plugin Author

    Posted 1 year ago #

    You have a 'funny' piece of software running that decides to resize the popup image. In the html the following can be seen with firebug:

    <img id="wppa-img-1" style="border-width: 0px; margin-left: 0px; margin-right: 0px; width: 144px; height: 104px; display: inline-block;" title="" src="http://i0.wp.com/www.rigsville.com/wp-content/uploads/wppa/thumbs/88.jpg?resize=144%2C104">

    especially:

    ?resize=144%2C104

    is not from wppa+ but from another plugin or maybe a theme setting.

    Check ( = de-activate ) other plugins that you recently added.

  3. DarrenShan
    Member
    Posted 1 year ago #

    Thanks for taking the time to look into this for me, your perfectly correct it was a plugin.

    It turned out to be Jetpack by WordPress.com if I disable this plugin the popup works perfectly, I've had this plugion installed for a while so it may be due to an recent update.

    Thanks again.

  4. Jeremy Herve
    Happiness Engineer
    Posted 1 year ago #

    @opajaap I work on the Jetpack plugin, and I would appreciate if we could work on a way to solve this conflict between WP Photo Album Plus and Jetpack Photon.

    Could you give me more details about the way you call and display the images in the popup?

  5. Jacob N. Breetvelt
    Member
    Plugin Author

    Posted 1 year ago #

    The thumbnail is an image, diaplayed smaller than the natural sizes using inline style width: and height:.

    On hoovering the thumbnail image, the function wppaPopUp() in wppa.js populates the popup placeholder div with the thumbnail image of initially the same size accompanied with optional text.

    jQuery('#wppa-popup-'+mocc).html(...)

    (mocc is a counter that counts the occurrence of a wppa shortcode or script.)

    Then, after calculation of placement and sizes, the following code:

    // Do the animation
    	jQuery('#wppa-popup-'+mocc).stop().animate({"marginLeft":leftDivBig+"px","marginTop":topDivBig+"px"}, 400);
    	jQuery('#wppa-img-'+mocc).stop().animate({"marginLeft":lrMarg+"px","marginRight":lrMarg+"px","width":widthImgBig+"px","height":heightImgBig+"px"}, 400);

    executes the animation to the natural sizes.

    Unfortunately the jetpack interference adds the ?resize argument so that the animation fails.

  6. Jeremy Herve
    Happiness Engineer
    Posted 1 year ago #

    Would you mind pointing me to the function calculating the sizes for the thumbnail and for the large images in your code?
    http://plugins.trac.wordpress.org/browser/wp-photo-album-plus/trunk

    I'd like to understand why the images do not get resized to the proper dimension when using the Jetpack Photon module.

    Thanks!

  7. Jacob N. Breetvelt
    Member
    Plugin Author

    Posted 1 year ago #

    wppa-functions.php (in version 5.0.11): line 2208:

    function wppa_get_imgstyle_a($file, $xmax_size, $xvalign = '', $type = '')
  8. Jeremy Herve
    Happiness Engineer
    Posted 1 year ago #

    Thank you. I had a look at your plugin, and noticed that you're using functions like is_file() and getimagesize() to get the image paths. While this will work with a local image, you will experience issues with all kinds of remote images, like the ones created by the Photon module.

    To avoid such issues, I would suggest that you use native WordPress functions like wp_get_attachment_image_src to get information about images added to WordPress. You can read more about it here:
    http://codex.wordpress.org/Function_Reference/wp_get_attachment_image_src

  9. Jacob N. Breetvelt
    Member
    Plugin Author

    Posted 1 year ago #

    This routine is not suitable for me, i do not use images added to wordpress, i use my own image files and have full filesystem access to them.

    All width's and heights the plugin generates are correct.
    All <img> tags the plugin generates have inline styles width and height to prevent other plugins and/or css files to damage my layout as much as possible.

    In responsive themes my js functions correct the size dynaicly. The only place where i do not specify height and width is the popup. The html is generated by a js function, using the img's natural sizes.

    Are the modifications to wppa+ generated html done by a content action, if so at what priority? I could recommend my users tu use the old scripting method, with a configuarable content filter priority ( default 1010 ), in stead of using shortcodes that use priority 11.

    Or do i have to check all my img urls on the existance of a &resize= argument and subsequently remove them???

    What is the purpose of the interference with &resize= anyway???

  10. Jeremy Herve
    Happiness Engineer
    Posted 1 year ago #

    This routine is not suitable for me, i do not use images added to wordpress, i use my own image files and have full filesystem access to them.

    Although that would work for most people, people using a CDN plugin, or hosting their images on an external domain, will experience issues.

    What is the purpose of the interference with &resize= anyway???

    You can read more about how Photon works here:
    http://jetpack.me/support/photon/
    http://developer.wordpress.com/docs/photon/
    http://developer.wordpress.com/docs/photon/api/

  11. Jacob N. Breetvelt
    Member
    Plugin Author

    Posted 1 year ago #

    Thanx for the info, but:

    1. the images in wppa+ have no attachmet ids, so wp_get_attachment_image_src() is not usable.
    2. it does not answer the question what is adding the ?resize= argument and when is it done.

    Making wppa+ capable to handle exteral image file holding is a different topic that has nothing to do with the problem in this thread.

    If someone could answer question 2 i could find a solution probably...

  12. Jeremy Herve
    Happiness Engineer
    Posted 1 year ago #

    2. it does not answer the question what is adding the ?resize= argument and when is it done.

    Photon is adding this argument, when resizing the images to fit the img tag width and height attributes.
    You can check the source code to learn more:
    http://plugins.trac.wordpress.org/browser/jetpack/trunk/functions.photon.php

    You could also use the jetpack_photon_skip_image filter to have Photon ignore your images:
    http://plugins.trac.wordpress.org/browser/jetpack/trunk/class.photon.php#L156

    However, I'm afraid that would only help with the Jetpack plugin, and not with other CDN plugins out there.

  13. Jacob N. Breetvelt
    Member
    Plugin Author

    Posted 1 year ago #

    This is info that helps me further, thanx.

  14. Jacob N. Breetvelt
    Member
    Plugin Author

    Posted 1 year ago #

    @DarrenShan:

    I will make code modifications to prevent photon to modify wppa image urls in the next version ( 5.0.12 ) and would like you to test the situation again to show that it is fixed.

    Expected release of 5.0.12: early next week.

  15. DarrenShan
    Member
    Posted 1 year ago #

    @opajaap

    Yes, no problem, more than happy to test.

  16. DarrenShan
    Member
    Posted 1 year ago #

    @opajaap

    I've just upgraded to version 5.0.12 and enabled and can confirm that Popups now work correctly with Photon enabled.

    Thanks for your help.

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • WP Photo Album Plus
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic