Options to open a WordPress post in a responsive popup
September 10, 2016 12:04 PM Subscribe
I'm looking for a stable plugin that can display an existing WordPress post from my site within a responsive popup window/lightbox when the user clicks a link. I've installed the free version of Popup Builder, which works pretty well, but it doesn't let me display a post, requiring that I recreate the post content inside their editor as either HTML OR a shortcode (not both). The pro version includes an iframe option that may be suitable, so I may check that out if I can't find any other options. Any suggestions?
I'd like to be able to display a full post in each popup because these 30+ posts already exist, because each post contains a mixture of HTML and shortcode for a small slider, and because the individual posts are searchable within the site, which is a big plus.
If I need to write the code within my CSS and page template to make my own modal window, so be it, but I'm working with the Genesis framework for the first time and still figuring out PHP. Any pointers here would also be welcome.
I'd like to be able to display a full post in each popup because these 30+ posts already exist, because each post contains a mixture of HTML and shortcode for a small slider, and because the individual posts are searchable within the site, which is a big plus.
If I need to write the code within my CSS and page template to make my own modal window, so be it, but I'm working with the Genesis framework for the first time and still figuring out PHP. Any pointers here would also be welcome.
This is kind of crazy. It is 2016; why is your entire WP site not responsive?
posted by DarlingBri at 3:30 PM on September 10, 2016
posted by DarlingBri at 3:30 PM on September 10, 2016
Response by poster: My site is completely responsive, built on a Genesis child theme. I'm not sure where I gave the impression that it wasn't. It's also the first time I'm customizing a responsive theme in any way beyond adding a lick of CSS paint, so I'm trying to sort out several things at once. This is the one specific question I came to AskMe about.
I've confirmed that an iframe within a popup won't do because -- d'oh! -- that will show the post wrapped in the header, footer and other page elements. I'm glad that I confirmed this before buying the pro version of my current plugin.
At this point, I think I'm looking at just digging into PHP to make this work, and if it doesn't, I have some other options for displaying this material.
posted by maudlin at 4:31 PM on September 10, 2016
I've confirmed that an iframe within a popup won't do because -- d'oh! -- that will show the post wrapped in the header, footer and other page elements. I'm glad that I confirmed this before buying the pro version of my current plugin.
At this point, I think I'm looking at just digging into PHP to make this work, and if it doesn't, I have some other options for displaying this material.
posted by maudlin at 4:31 PM on September 10, 2016
Best answer: You mention: "I've confirmed that an iframe within a popup won't do because -- d'oh! -- that will show the post wrapped in the header, footer and other page elements." - that's true. Now, what you could do is the following:
* append a querystring parameter to the url you call for the popup like
* read that querystring parameter as part of your template files
* change the instances of the header (and related) from simply
Now, that's my first answer. But there are a number of ways you potentially could handle this. My questions for clarification:
1. Is the parent website also WordPress?
2. Or is this a non-WordPress site pulling in WordPress data?
3. And are the website and the WP instance on the same domain?
posted by artlung at 2:55 PM on September 12, 2016 [1 favorite]
* append a querystring parameter to the url you call for the popup like
?slim=true* read that querystring parameter as part of your template files
$slim = (isset($_GET['slim']) && isset($_GET['slim']) == 'true') ? true : false;* change the instances of the header (and related) from simply
get_header(); to if ($slim) { get_header(); } ... in this way the site infrastructural code won't get displayed when you call it with slim=trueNow, that's my first answer. But there are a number of ways you potentially could handle this. My questions for clarification:
1. Is the parent website also WordPress?
2. Or is this a non-WordPress site pulling in WordPress data?
3. And are the website and the WP instance on the same domain?
posted by artlung at 2:55 PM on September 12, 2016 [1 favorite]
Best answer:
... I meant
posted by artlung at 3:02 PM on September 12, 2016
$slim = (isset($_GET['slim']) && $_GET['slim'] == 'true') ? true : false;... I meant
posted by artlung at 3:02 PM on September 12, 2016
Response by poster: Thanks, artlung! I really appreciate the sample code.
My site is WordPress (Genesis framework, child theme) and the posts I want to show in the popup are from that site, too. It's all the same domain and server -- nothing is being pulled from any external site.
I am still pretty new to PHP, though. I'm about 80% confident that I get the logic of what you're doing there, but I may need to find a decent tutorial and learn PHP properly now instead of cargo-culting my way through this. For example, I have worked out a page template adapting PHP from sample code to loop through the current set of custom posts and display them as a nicely formatted list on my products page (product title as H2, a couple of images, and a few lines of description). This list is preceded on the page by a set of links generated by a separate loop (name of product, link to the corresponding description anchored down the page.) But I really need to learn more.
So it sounds as if I have to modify the loop that that index of internal links I already have to open a new popup instead. Guess it's finally time to take those lynda.com courses pn PHP and WordPress customization.
posted by maudlin at 12:00 AM on September 13, 2016 [1 favorite]
My site is WordPress (Genesis framework, child theme) and the posts I want to show in the popup are from that site, too. It's all the same domain and server -- nothing is being pulled from any external site.
I am still pretty new to PHP, though. I'm about 80% confident that I get the logic of what you're doing there, but I may need to find a decent tutorial and learn PHP properly now instead of cargo-culting my way through this. For example, I have worked out a page template adapting PHP from sample code to loop through the current set of custom posts and display them as a nicely formatted list on my products page (product title as H2, a couple of images, and a few lines of description). This list is preceded on the page by a set of links generated by a separate loop (name of product, link to the corresponding description anchored down the page.) But I really need to learn more.
So it sounds as if I have to modify the loop that that index of internal links I already have to open a new popup instead. Guess it's finally time to take those lynda.com courses pn PHP and WordPress customization.
posted by maudlin at 12:00 AM on September 13, 2016 [1 favorite]
Best answer: Go maudlin!
If you're up for customizing yourself, then rock on. For the kind of work you're doing I find it very helpful to use the Template Hierarchy and especially
posted by artlung at 12:22 PM on September 13, 2016 [1 favorite]
If you're up for customizing yourself, then rock on. For the kind of work you're doing I find it very helpful to use the Template Hierarchy and especially
get_template_part() [ref] for those parts that I may be reusing or are highly specialized. It helps keep me sane and remember the specialty parts. I highly recommend looking through the WordPress developer site to see what functions are available.posted by artlung at 12:22 PM on September 13, 2016 [1 favorite]
This thread is closed to new comments.
posted by johngoren at 1:37 PM on September 10, 2016 [1 favorite]