RSS Feed

Blog

DISQUS Code Formatting Suggestions for their Comment Threads

DISQUS Code Formatting Suggestions for their Comment Threads
Posted on Jun 4, 2012 by Stephen Owens
General category
   [ Return ]

In response to @DISQUS via twitter; since it's tough to give case examples in less than 145 characters.

The Discussion Thus Far

@StudiOwens [source]: "@disqushelp anyway to add code to comments without URLs being truncated and turned into a link? Include html tags without using < $gt; ?"

@DISQUS [source]: "@StudiOwens Not currently. I'll pass that on to the team for consideration. What's the use case, to help flesh this out? @thetylerhayes"

Clarification on My Original Question

Idealy there would be a way to say to DISQUS, "hey this next part is plain text so don't process or parse it."

Maybe something as simple as surroudning some text with <code></code>. This could denote chunks of plain text that are to be displayed as is, and not to be processed.

Usage Case Example

Lets say I want to include a code snippet that is a mix of HTML, URLs, images, and PHP in the comments. This could be in response to a question by one of my readers, or perhaps a clarification or expansion of the topic in the related blog post.

Current Situation:

DISQUS processes the tags (or deletes them), attaches images to the comment, and truncates / hyperlinks any URL.

Example Code:

If I wanted to include some very simple code for one of my readers; here are four very basic lines of code:

  1. <a href="http://www.studio-owens.com"><img
    src="http://www.studio-owens.com/remote/TAG_Studio-Owens.jpg"
    alt="Studio-Owens.com by Stephen R. Owens"
    /></a><br />
    
  2. <?php 
    
  3.   echo '<a
    href="http://www.studio-owens.com">Studio-Owens.com by
    Stephen R. Owens</a>'; 
    
  4. ?>

Prepare the Code for a DISQUS Comment

I must first prepare it as best I can for a DISQUS comment. By replacing the less than and greater than signs with their html names &lt; (for <) and &gt; (for >). Then surround the code with <pre><code></code></pre>.

Here is the sample code above prepared for DISQUS:

  1. <pre><code>
    
  2. &lt;a
    href="http://www.studio-owens.com"&gt;&lt;img
    src="http://www.studio-owens.com/remote/TAG_Studio-Owens.jpg"
    alt="Studio-Owens.com by Stephen R. Owens"
    /&gt;&lt;/a&gt;&lt;br /&gt;
    
  3. &lt;?php 
    
  4.   echo '&lt;a
    href="http://www.studio-owens.com"&gt;Studio-Owens.com by
    Stephen R. Owens&lt;/a&gt;'; 
    
  5. ?&gt;
    
  6. </code></pre>

When I type the prepared code into the comment box it doesn't exaclty work out. See my example comment below via DISQUS and/or here is an image of the comment...

DISQUS processes the tags (or deletes them), attaches images to the comment, and truncates / hyperlinks any URL.

If would be really nice is the URLs were not turned into hyperlinks, and if I didn't have to replace all the < and > with &lt; and &gt;.

Share
Like what you read? Get updates for free!
comments powered by Disqus