Archived topic
Hide the header and footer if url parameter exist
1 reply · Started by Kelvin on March 15, 2022
Dear Sir/Madam,
I have a site using GP, I know how to hide the header and footer from the Elements, I want to allow another site to embed my site content without the header and footer, is it possible to do it if I pass with an url parameter and I can remove the header and footer? Please advise.
Best regards,
Kelvin.
Hi Kelvin,
Are you referring to adding a custom URL parameter like this which would indicate if the footer and header shouldn’t be displayed?: https://share.getcloudapp.com/Z4u7zvPQ
If so, you would need a custom code for this. For instance, if you’re familiar with Javascript, here is a code you may try:
<script type="text/javascript">
const queryString = window.location.search;
const urlParams = new URLSearchParams(queryString);
var myheader = urlParams.has('header');
var myfooter = urlParams.has('footer')
if(myheader){
document.querySelector('header').style.display = "none";
}
if(myfooter){
document.querySelector('.site-footer').style.display = "none";
}
</script>You may add this code through a Hook Element with hook wp_footer and display it to the Entire site as such: https://share.getcloudapp.com/p9u6znK4
With this code, if you add /?header=anything&footer=anything, the header and footer would not display.
Note that anything can be any word or character. If this doesn't hide the right elements, kindly share the link to the site in question so we may determine the appropriate selectors. :)
Hope this clarifies. :)
