How to add body class in Wordpress if the page is being viewed in an iframe?

Question

From the post How to identify if a webpage is being loaded inside an iframe or directly into the browser window? I understand you can detect whether or not your page is being viewed through a frame or not.

Using a WordPress site. I'd like to append a body class tag to my site dependent on it's view. I'm doing this so I can tweak the styling. I understand this can't be done via PHP and you need to use JavaScript.

Can somebody walk me through an example of how I can add my body class with this?

if (top === self) { not iframe -do nothing } else { in a frame - add body class }

Thanks in advance for the hand holding.

Answer 1

You can do this with jQuery by adding this snippet to your document head . This will add to the body class attribute if the page with javascript code is being embedded through an iframe:

<script type="text/javascript">
$(function() {
  var isInIFrame = (window.location != window.parent.location) ? true : false;
  if(isInIFrame) {
    $('body').addClass('iframe');
  }
});
</script>

You can view some more source code for this answer on Github