zenphoto forums » Themes

zpBootstrap: colorbox

(6 posts)
  • Started 3 months ago by reddduke
  • Latest reply from acrylian
  1. reddduke

    Apprentice
    Joined: Dec '16
    Posts: 3

    Hello, I use Zenphoto V 1.4.11 and Theme zpBootstrap V 1.4.6

    It is a great theme, but is there a possibility to to display the full size image with Colorbox in Image page?
    Only the slideshow is using colorbox.

    Kind regards,Ria.
    http://www.redduke.org

    Posted 3 months ago #
  2. Zenphoto development team
    fretzl

    Zenphoto team
    Joined: Sep '08
    Posts: 1,088

    Try something like this:

    In image.php change

    <div class="center">
    <?php printDefaultSizedImage(getImageTitle(), 'image ombre remove-attributes'); ?>
    </div>

    to

    <div class="center">
    <a class="colorbox" href="<?php echo html_encode(getFullImageURL()); ?>" title="<?php echo getAnnotatedImageTitle(); ?>">
    <?php printDefaultSizedImage(getImageTitle(), 'image ombre remove-attributes'); ?>
    </a>
    </div>

    And in inc_header.php change

    $(document).ready(function() {
     $("a[rel='slideshow']").colorbox({
      slideshow: true,
      slideshowSpeed: <?php echo getOption('zpB_slideshow_speed'); ?>,
      slideshowStart: '<?php echo gettext("start slideshow"); ?>',
      slideshowStop: '<?php echo gettext("stop slideshow"); ?>',
      previous: '<?php echo gettext("prev"); ?>',
      next: '<?php echo gettext("next"); ?>',
      close: '<?php echo gettext("close"); ?>',
      current : "image {current} / {total}",
      maxWidth: "95%",
      maxHeight: "95%",
      photo: true
     });
    });

    to

    $(document).ready(function() {
     $("a[rel='slideshow']").colorbox({
      slideshow: true,
      slideshowSpeed: <?php echo getOption('zpB_slideshow_speed'); ?>,
      slideshowStart: '<?php echo gettext("start slideshow"); ?>',
      slideshowStop: '<?php echo gettext("stop slideshow"); ?>',
      previous: '<?php echo gettext("prev"); ?>',
      next: '<?php echo gettext("next"); ?>',
      close: '<?php echo gettext("close"); ?>',
      current : "image {current} / {total}",
      maxWidth: "95%",
      maxHeight: "95%",
      photo: true
     });
    
     $("a.colorbox").colorbox({
      previous: '<?php echo gettext("prev"); ?>',
      next: '<?php echo gettext("next"); ?>',
      close: '<?php echo gettext("close"); ?>',
      maxWidth: "95%",
      maxHeight: "95%",
      photo: true
     });
    });
    Don't forget to read the Forum rules and usage resources
    Posted 3 months ago #
  3. reddduke

    Apprentice
    Joined: Dec '16
    Posts: 3

    Thanks for your quick response.
    I will immediately get to work :)

    Kind regards, Ria.
    http://www.redduke.org

    Posted 3 months ago #
  4. Zenphoto development team
    fretzl

    Zenphoto team
    Joined: Sep '08
    Posts: 1,088

    Sorry, I made a mistake. I was looking at an older version of the theme.

    The change in image.php is still ok, but in inc-header.php add this code right before the closing </head> tag:

    <?php if ($_zp_gallery_page == 'image.php') { ?>
    <script type="text/javascript">
    //<![CDATA[
    $(document).ready(function() {
     $("a.colorbox").colorbox({
      previous: '<?php echo gettext("prev"); ?>',
      next: '<?php echo gettext("next"); ?>',
      close: '<?php echo gettext("close"); ?>',
      maxWidth: "95%",
      maxHeight: "95%",
      photo: true
    });
    });
    //]]>
    </script>
    <?php } ?>
    Don't forget to read the Forum rules and usage resources
    Posted 3 months ago #
  5. reddduke

    Apprentice
    Joined: Dec '16
    Posts: 3

    fretzl,
    It works fine with image page, but I made also a mistake :(

    Something went wrong in 'google translation'... sorry!

    The right question: Is there a possibility to to display the full size image with Colorbox in the album page by clicking the thumbnail?
    Zenphoto V 1.4.11 and Theme zpBootstrap V 1.4.6

    Kind regards,Ria.
    http://www.redduke.org

    Posted 3 months ago #
  6. Zenphoto development team
    acrylian

    Zenphoto team
    Joined: Jul '07
    Posts: 16,708

    It is but you then have to modify the theme. I don't have the theme in front of me right now. But basically you need to replace the image link to the image page within the next_image loop on the theme's album.php with that of the full image url.

    Then attach the colorbox class to the link and the rel attribute to trigger the gallery grouping mode (if you do this people will not be able to link specific images anymore of course, although the image page still exists). Then also add rel:' - the value you set - '` to the js define above. (info also here: http://www.jacklmoore.com/colorbox/).

    Note that this will only work for the current page if you use paginated thumbs.

    Don't forget to read the Forum rules and usage resources
    Posted 3 months ago #

RSS feed for this topic

Reply

You must log in to post.