Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • April 5, 2015 at 12:04 pm #423594
    Alex

    I open link to page with query parameters like this : ?iframe=true&width=640&height=360
    Link with lightbox
    https://www.dropbox.com/s/whxe3vwgf3yatkw/Image%20002.png?dl=0

    Page opens OK BUT shows together with all site design
    Whole page show
    https://www.dropbox.com/s/15y2rd3auxpxg20/Image%20003.png?dl=0

    QUESTION: Is it possible to show in modal window post/page content only? without sidebars, header, menu and footer?

    • This topic was modified 9 years, 7 months ago by Alex. Reason: Dropbox image link added
    April 5, 2015 at 12:51 pm #423610
    Alex

    Maybe there is some query parameter like “header=no” which shows page without header/footer/sidebars?

    April 6, 2015 at 7:37 pm #424174
    Yigit

    Hey!

    I do not think that would be easily possible.
    As a workaround, you can save templates you have created using Avia Layout Builder and load them on other pages http://i.imgur.com/pkv1y7C.jpg
    You can duplicate your page and choose to display it without sidebar and with Blank page template and link that page instead

    Regards,
    Yigit

    April 7, 2015 at 7:50 am #424476
    Alex

    Ok. But how to manage this in not easy way?
    There would be some good solution if I could pass page template to use via query string.
    For example, in general page could be opened like other pages (with header footer etc) but if I open page with query string like ?header=no, than content only should be displayed.
    Could you point me where to start to code in this way?

    April 7, 2015 at 5:57 pm #424856
    Elliott

    Hi!

    I didn’t test it out but maybe something like this in the bottom of your functions.php file would work.

    add_action( 'wp_footer', 'enfold_customization_extra_css' );
function enfold_customization_extra_css() {
	if ( $_GET['header'] == "true" ) { 
	?>
		<style type = "text/css">
			#header { display: none !important; }
		</style>
	<?php
	}
}

    Best regards,
    Elliott

    April 7, 2015 at 6:20 pm #424866
    Alex

    Thanks. This code works. BUT it just hides header. And it means that I must enumerate all the stiles to hide.
    Probably you have some ideas how using this approach show ONLY content css class (with all related css inside class)?

    April 8, 2015 at 2:16 pm #425292
    Ismael

    Hey!

    Maybe this will work:

    add_action( 'wp_footer', 'enfold_customization_extra_css' );
function enfold_customization_extra_css() {
	if ( $_GET['header'] == true ) { 
	?>
	<script>
	(function($){	
		var remove = $('#header, aside, #footer, #socket');
		$(remove).css('display', 'none');
		$('#main').css('padding-top', 0);
		$('main.template-page.content.av-content-small').css({'width' : '100%', 'border' : 'none'});
;	})(jQuery);
	</script>
	<?php
	}
}

    Cheers!
    Ismael

    September 30, 2015 at 2:11 pm #511486
    Bruno Abreu

    Hey guys.. i just tried to use this code in the bottom of my functions.php and didn’t work.. i need to show a page inside an iframe.. but with no header.. no footer and no sidebars… can someone help me please ? Thanks!

    September 30, 2015 at 5:01 pm #511691
    Elliott

    Hi!

    Edit the page and set it to use the “Blank” template.

    Best regards,
    Elliott

    September 30, 2015 at 8:08 pm #511804
    Bruno Abreu

    Yes.. but this page I use aswell not inside an iFrame.. so i’d like to have both options.. and duplicated content i’ve heard is not good for google.. so sometimes I need the content to show in an iframe.. it would be perfect to have a code to not show only on iframes…
    thanks!

    • This reply was modified 9 years, 1 month ago by Bruno Abreu.
    October 1, 2015 at 7:30 pm #512381
    Elliott

    Hi!

    I’m not sure I understand. The page in your iframe is going to be another page on your site correct? If you edit that page and set it to use the blank template then the header, footer, etc etc, is not going to display.

    Send us a link to your page so we can get a better idea.

    Best regards,
    Elliott

    February 23, 2018 at 6:19 pm #916788
    FindlyTalent

    I know this post is from 2015 but it’s what showed up when I was searching on Google and it doesn’t look like anyone gave him the answer he was looking for. If you need to do something like this, this the solution I found worked best.

    function add_modal_qs(){	
	if(isset($_GET['modal'])) {
		global $avia_config;
		if(isset($avia_config)) {
			$avia_config['template'] = 'blank';
		}
	}
}
function add_modal_html_class(){
	if(isset($_GET['modal'])){
		echo ' modal-friendly ';
	}
}
add_action('init', 'add_modal_qs');
add_action('html_classes', 'add_modal_html_class');

    This removes the header, footer, and sidebars, and adds a custom class to the HTML tag so you can modify the styles to make it fit an IFrame better, IF ?modal is added to the end URL. You should make other adjustments like limiting it to just pages that you want allowed to use it.

    • This reply was modified 6 years, 9 months ago by FindlyTalent. Reason: Clarifications
    February 23, 2018 at 11:33 pm #916918
    Yigit

    Hi,


    @FindlyTalent     Thanks for sharing! :)

    For future readers: It is now possible to hide footer, header and sidebar on page edit screen :)

    Best regards,
    Yigit

  • Author
    Posts
Viewing 13 posts - 1 through 13 (of 13 total)
  • The topic ‘Open page in modal lightbox without sidebars header and footer’ is closed to new replies.