Fall Sale! Code FALL2024 takes 25% OFF our Pro Plugins & Books »
Web Dev + WordPress + Security

PHP Code Not Displayed in Browser

Recently a reader sent in a bug report about this post on bbPress. For some reason the PHP code snippets were not displaying properly in the browser. Basically, instead of looking neat and tidy as always, the code looked like a garbled mess of spaced-out nonsense. And by “spaced out” I don’t mean in a good way: there was literally like 100px of vertical space breaking up the jumbled lines of code. It was definitely a mess, so I began to investigate.

Affected Browsers

I tested on many browsers on Mac and Windows. Have not yet tested on Linux. From what I can tell, the broken PHP code happens only in Waterfox running on Windows. All other browsers currently display PHP code snippets correctly.

This issue may or may not surface in other browsers, so this post is just FYI and for future reference. Hopefully it helps someone figure out why PHP code is not displayed, broken or whatever. In this case, simple logic suggests the underlying issue is with Windows, not Waterfox.

The Problem

Here are a couple of screenshots to illustrate the problem. The first shows the PHP code looking fine; the second shows it all distorted. Click each thumbnail to view full-size image (opens new tab).

[ Screenshot showing proper display of PHP code snippet ][ Screenshot showing broken display of a PHP code snippet ]

In the second screenshot, you can see the broken code snippet, scattered all over the place. With massive intra-code line spacing and chunks of code displayed outside of the enclosing <pre> element (red arrow).

Closer inspection reveals the underlying issue. Waterfox on PC/Win has a bug with code escaping. Odd, because there is no bug with Waterfox on Mac. Specifically, Waterfox has two issues with displaying proper HTML:

  • Character encoding — Contents of <pre>/<code> tags are not escaped/displayed properly on the page (e.g., angle brackets < >)
  • PHP tags — Opening and closing PHP tags are commented out via HTML comments (i.e., <?php and ?> are replaced with <!--?php and ?-->)

So not all PHP code is affected; it’s a very limited test case. From what I can tell, there are two scenarios where Waterfox/Win chokes on displaying PHP code:

  • If the <pre> tag includes PHP tags, the PHP code will not be displayed
  • If the <pre> tag includes HTML mixed in with the PHP, the PHP code will not be displayed, and the HTML will display all jumbled and broken

Here are a couple of screenshots to give you a better idea of what’s happening in the source code. The first screenshot shows the code displayed properly. The second shows the commented-out PHP tags, and resulting broken code.

[ Screenshot showing the source code of the correct code ][ Screenshot showing the source code of the broken code ]

Admittedly, this is a relatively minor issue. But for code-driven tutorial sites like Perishable Press, it’s important that browsers display code content correctly. Imagine the horror of some newbie trying to following along with the tutorial using the Waterfox browser, and then trying to make sense of that jumbled mess of garbled gibberish. Confusion and frustration on the house.

Security Feature?

One might imagine commenting out opening and closing PHP tags as some sort of security feature, but in reality it is a potential security risk.

Disabling PHP tags breaks proper HTML output. It leaves code samples broken. Broken code that may be used on a live site. And as we all know, broken code can introduce bugs and security issues.

Also, disabling PHP code in HTML content at the browser level accomplishes nothing. Doing so is pointless at best, and a security risk at worst. Why? Because browsers do not (and cannot) execute PHP scripts. It is foolish to disable them.

Other reasons for broken code display

If you are in the same boat, trying to figure out why your PHP snippets are not working, and Waterfox is not the issue, here are some other things to look at.

  • CMS like WordPress filtering or sanitizing certain characters
  • Visiting the page via proxy/VPN service can modify page markup
  • JavaScript errors on the page can cause HTML display to break
  • Browser extensions that interact with web page content
  • CSS or JavaScript may be hiding/obscuring the code
  • Incorrect HTML structure/format et al

I hope it helps. As always comments and feedback welcome :)

About the Author
Jeff Starr = Web Developer. Security Specialist. WordPress Buff.
Wizard’s SQL for WordPress: Over 300+ recipes! Check the Demo »

One response to “PHP Code Not Displayed in Browser”

  1. Jim S Smith 2019/10/10 9:44 am

    This be a good reason that I have become very practiced in using the PHP function “htmlspecialchars()” for printing out code blocks:

    $the_data = htmlspecialchars( $the_data, ENT_NOQUOTES, 'utf-8' );
    
    echo "$the_data";

    I make VERY heavy use of it in my own output-handling projects.

    Another possible situation: Perhaps the affected browser(s) has a “bug” in one or more of the CSS-properties concerning the container HTML? I have seen something like this a few times with FireFox. This was especially the case when I could not get the positioning properties (like “top, left, etc.”) to work on DIV’s, SPAN’s, etc. after declaring a doctype in the document header. Thankfully the issue was finally fixed AFTER waiting through at least THREE versions!

    – Jim

Comments are closed for this post. Something to add? Let me know.
Welcome
Perishable Press is operated by Jeff Starr, a professional web developer and book author with two decades of experience. Here you will find posts about web development, WordPress, security, and more »
Digging Into WordPress: Take your WordPress skills to the next level.
Thoughts
Went out walking today and soaked up some sunshine. It felt good.
I have an original box/packaging for 2010 iMac if anyone wants it free let me know.
Always ask AI to cite its sources.
All free plugins updated and ready for WP 6.6 dropping next week. Pro plugin updates in the works also complete :)
99% of video thumbnail/previews are pure cringe. Goofy faces = Clickbait.
RIP ICQ
Crazy that we’re almost halfway thru 2024.
Newsletter
Get news, updates, deals & tips via email.
Email kept private. Easy unsubscribe anytime.