Docs

[StepUp Team]

Hi 🙂

I’m trying to make the portfolio items to open in lightbox and just remove the portfolio single page.
Basically, I want to turn it into a gallery. I prefer doing that with the portfolio for the ease of editing for my client and to put as little plugins as I can..

so the result I want to achieve is that if you click on an image in the “portfolio archive” page, you’ll get a lightbox and the featured image would show up.. hope I’m understandable…

[StepUp Team]

This reply has been marked as private.

[StepUp Team]

i tried doing this: https://community.theme.co/forums/topic/open-portfolio-in-lightbox/

but it didnt worked…

[StepUp Team]

i had some cache on my website i see that it peremalinks to the image itself… but it doesn’t open in a lightbox..

[Christian]

Hey there,

Please remove the code you got from the other thread as that was for the old X version. For your case since you’re also using Renew, add the code below in your Appearance > Customize > Custom > Global CSS

.x-portfolio .entry-cover {
    display: none;
}

Then, in your functions.php add

add_action( 'wp_footer', 'portfolio_lightbox');

function portfolio_lightbox() {
  if ( is_page_template( 'template-layout-portfolio.php' ) ) {
    echo do_shortcode('[lightbox selector=".page-template-template-layout-portfolio .entry-thumb" opacity="0.875" prev_scale="0.75" prev_opacity="0.75" next_scale="0.75" next_opacity="0.75" orientation="horizontal" thumbnails="true"]');
  }
}

function x_featured_image( $cropped = '' ) {

  $stack     = x_get_stack();
  $fullwidth = ( in_array( 'x-full-width-active', get_body_class() ) ) ? true : false;
  $thumb_id = get_post_thumbnail_id();
  $thumb_url_array = wp_get_attachment_image_src($thumb_id, 'full', false);
  $thumb_url = $thumb_url_array[0];

  if ( has_post_thumbnail() ) {

    if ( $cropped == 'cropped' ) {
      if ( $fullwidth ) {
        $thumb = get_the_post_thumbnail( NULL, 'entry-cropped-fullwidth', NULL );
      } else {
        $thumb = get_the_post_thumbnail( NULL, 'entry-cropped', NULL );
      }
    } else {
      if ( $fullwidth ) {
        $thumb = get_the_post_thumbnail( NULL, 'entry-fullwidth', NULL );
      } else {
        $thumb = get_the_post_thumbnail( NULL, 'entry', NULL );
      }
    }

    switch ( is_singular() ) {
      case true:
        printf( '<div class="entry-thumb">%s</div>', $thumb );
        break;
      case false:
        printf( '<a href="%1$s" class="entry-thumb" title="%2$s">%3$s</a>',
          $thumb_url,
          esc_attr( sprintf( __( 'Permalink to: "%s"', '__x__' ), the_title_attribute( 'echo=0' ) ) ),
          $thumb
        );
        break;
    }

  }

}

Thanks.

[StepUp Team]

AMAZING! Thank you so much!

[Christian]

You’re welcome.

[Author]

Posts