Genesis Featured Post open in lightbox

[simbasounds]

This is a long shot, I know, but here goes..

Does anyone have any idea how to make posts from the Genesis Featured Posts widget open in a lightbox?
ie. when a post's thumbnail is clicked-on, the whole post, not just the image should overlay the widget page.

I'll be building a post thumbnail grid by hiding titles, excerpts, post meta and content in CSS, so I guess the solution would involve something like hijacking the link in jQuery, then un-hiding those items in the overlay.

It's the hijacking part I need help with, either by filtering the Genesis Featured Posts links to make them meet the jQuery lightbox requirements; or else modifying the jQuery so it triggers an overlay instead of linking to the post.

[avgjoegeek]

I'm no jquery expert but this might give a start in the right direction?

http://www.endocreative.com/how-to-insert-content-in-a-popup-using-lightbox-plus-for-wordpress/

This guy was looking for something similar and found a plugin to help.

[simbasounds]

Ah, thanks, yes I saw that : ) and installed the plugin, tried to get my head around making it work with Genesis Featured Posts. And also started looking at http://defunkt.io/facebox/

Eventually the designer I'm developing with said he wasn't that keen on the idea anyway, so it's a mind-bender for another day. But I think AJAX would be the way to go. Will update here if I ever get the time to find the full solution.

[simbasounds]

I eventually ended up implementing this on my own site by installing the ShadowBox plugin:
https://wordpress.org/plugins/shadowbox-js/

In my archive-portfolio.php I used a rel="shadowbox" link on my image block post links:

add_action('genesis_entry_content', 'post_thumbnail');
function post_thumbnail() {
	if ( has_post_thumbnail() ) { ?>
		<a href="<?php echo get_page_link(); ?>" rel="shadowbox">
			<?php the_post_thumbnail( $size, $attr ); ?>
		</a>
	<?php }
}

This makes the links open the post in an iframe lightbox.

But the posts in the iframe lightbox had a duplicate header and navigation. Since the posts needed to be able to open as stand-alone posts - say, if linked-to from a Google search - I couldn't remove the duplicate site structure markup with php. They needed to to be hidden using CSS display:none only in the iframe.

This was achieved by using a script which detects if the post is inside the iframe, and hides structural elements accordingly:

<script type='text/javascript'>
if (self !== top) document.write('<style type="text/css"> .site-header,.site-container .nav-primary,.site-container .responsive-primary-menu-container,.site-footer {display: none;}</style>');
</script>

Here's the result:
http://simonbarnett.co.za/portfolio/

There's an additional issue in that links inside the iframe posts need to open in the full browser window. Currently they open inside the lightbox. The links will need to be filtered to have target="_top". In most cases the archive-portfolio.php can be modified, but I think Genesis uses a custom function for taxonomy links because this doesn't work:

function change_target($result) {
	$result = str_replace('<a', '<a target="_top"', $result);
	return $result;
}
add_filter('wp_list_categories', 'change_target');
add_filter('the_category', 'change_target');

I'll start a new thread for this query.

[Author]

Posts