Take the 2-minute tour ×
Web Applications Stack Exchange is a question and answer site for power users of web applications. It's 100% free, no registration required.

I am trying to post some source code on a WordPress.com blog. WordPress actually makes posting syntax-highlighted code quite easy--you wrap the code in a [sourcecode] block, optionally specify the language with the lang attribute, and you're good.

I've never had a problem with this before, but I recently found an issue I can't fix. I'm trying to render some source code on the blog with the following.

[sourcecode lang="html"]
<iframe src="http://someserver.edu/somescript.php?id=223"
        marginwidth="0" marginheight="0" frameborder="0" 
        scrolling="no" width="210px" height="60px"></iframe>
[/sourcecode]

When I try to preview the post, the HTML gets stripped from the [sourcecode] block. When I try to escape the < and > characters, the code block is rendered, but the raw text is shown without interpreting the encodings (so you see &lt; instead of <, etc).

I'm guessing the original HTML is being stripped as rendering an iframe could lead to security vulnerabilities. But I don't want to render the iframe, I want to render the code behind the iframe, which should not present any security issues. How can I tell the blog to render my source code correctly?

share|improve this question
    
I think this should be moved to WordPress stack exchange. I've flagged the question accordingly. (BTW, have you tried using an iframe plugin?) –  user 99572 is fine Feb 11 '13 at 21:43
2  
@user99572isfine - questions about wordpress.com are off topic on the Wordpress site. Their site is for "WordPress developers and administrators" and point back to us for questions about the use of wordpress.com - wordpress.stackexchange.com/faq –  ChrisF Feb 11 '13 at 23:25
    
@user99572isfine Indeed, Wordpress.SE explicitly states that wordpress.com questions are off-topic, and wordpress.com doesn't support plugins like the ones you can install on a Wordpress blog you download and host yourself. –  Daniel Standage Feb 13 '13 at 1:20
    
@DanielStandage When you preview the post, is the iframe rendered in the resulting HTML or is it plainly ripped out? –  Alpha Feb 13 '13 at 4:40
    
@Alpha when I click save or preview, the iframe code is no longer there between the [sourcecode] tags. So it's not that it's getting rendered and I can't see the resulting iframe, it's that Wordpress.com seems to be treating it as actual HTML (rather than code, which is my intent) and stripping it out before it can be rendered. –  Daniel Standage Feb 14 '13 at 15:55

2 Answers 2

I honestly think this is a legitimate Wordpress.com bug. I have asked for support in the official site, hoping that we either can get a workaround or if it is a real problem as I think, it gets picked up and solved.

In my assumption, these are the security measures of iframes not being allowed overlapping with the source code display feature. Funnily enough, this does not happen with scripts.

A not-so-nice workaround I have been able to find is the following:

[sourcecode lang="html"]
<iframe src="http://someserver.edu/somescript.php?id=223"
    marginwidth="0" marginheight="0" frameborder="0" 
    scrolling="no" width="210px" height="60px"></ iframe>
[/sourcecode]

(Note the space in the </ iframe> closing tag.)

I think most browsers will be forgiving enough to allow the iframe to be used like that (so, if you have public that needs just to copy and paste without technical explanations, this will still be useful), and since Wordpress cannot pickup the ending tag correctly, it won't strip your iframe out. I have tried this with the latest version of IE, FF and Chrome and they seem to pick it up nicely. However, this will not pass a HTML validation check (it will actually complain about the unclosed tag).

This is not ideal at all, but it seems to be working.

share|improve this answer
    
I'm guessing Wordpress pre-processes the text and strips out aberrant HTML before it runs the syntax highlighting. I'm not going to pretend I know the intricacies of their system, but that's my first thought for fixing this--perhaps reverse the order of those two... –  Daniel Standage Feb 15 '13 at 11:37

One solutions that works for me is to host my code snippets on Github Gist, then you can embed the Gist into your post on Wordpress using this shortcode:

[gist *FULL LINK TO GIST*]

You can customize the embedded Gist and the instructions on how to do that are here.

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.