Inline code formatting

Talesh · ‎02-08-2016

It would be nice if we can have inline code formatting that would change the font to something monospaced without having it roll onto a new line. I tried using <PRE> but the input form didn't like that. If I am somehow the village idiot and haven't figured out how to do this, be gentle

-T

beejhuff · ‎02-08-2016

I just wanted to second @Talesh's suggestion. Code formatting is tough, I know but it helps so much when trying to deep dive into an issue here in the forums. As we continue to expand contributions here in the Magento Forums I think it will really help a lot of people (both submitters and responders) to have even just a few basic code formatting options available to us.

But since we're on that topic anyway, highlighting / syntax coloring for PHP, HTML, Javascript and CSS would be nice too

Here's what I get when I use the Insert Code menu option:

PHP:

<?php 
        // create curl resource 
        $ch = curl_init(); 

        // set url 
        curl_setopt($ch, CURLOPT_URL, "example.com"); 

        //return the transfer as a string 
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1); 

        // $output contains the output string 
        $output = curl_exec($ch); 

        // close curl resource to free up system resources 
        curl_close($ch);      
?>

At least it's pre-formatted, but not easy to read without syntax highlighting (compared to the PHP Official Docs where I found this sample)

Simple HTML (again, it's pre-formatted but not quite as readable as the Mozilla Docs where I found the sample)

<!DOCTYPE html>
<html>
<head>
  <title>Hi there</title>
</head>
<body>
  This is a page
  a simple page
</body>
</html>

Simple CSS (same story, code source)

<head>
  <title>My first styled page</title>
  <style type="text/css">
  body {
    color: purple;
    background-color: #d8da3d }
  </style>
</head>

Simple JavaScript (same story, code source)

var myImage = document.querySelector('img');

myImage.onclick = function() {
    var mysrc=myImage.getAttribute('src');
    if(mysrc=== 'images/firefox-icon.png') {
      myImage.setAttribute ('src','images/firefox2.png');
    } else {
      myImage.setAttribute ('src','images/firefox-icon.png');
    }
}

I've noticed that SOME types of code does appear to include some formatting, but it appears to be mostly shell commands (at least here's an example).

[root@webserver var]# locate .htaccess
/root/.htaccess
/var/www/html/magento/.htaccess
/var/www/html/magento/app/.htaccess
/var/www/html/magento/downloader/Maged/.htaccess
/var/www/html/magento/downloader/lib/.htaccess

Of course, I may be doing this wrong so any help would be appreciated

sherrie · ‎08-26-2016

Sorry I've missed this. It's not visible in this area, but in the Q&A parts of the forum you can use the {i} button on the WYSIWYG toolbar to insert code. Does that solve this for you?

beejhuff · ‎09-01-2016

I am thinking it might but I'll have to find an open question and test it out. @Talesh will need to confirm his specific request as ours were a little different

Talesh · ‎09-09-2016

I have been working around it by using monospaced fonts in bold inline instead of a code setting. It takes a little longer but we're all good. Thanks for reviewing. You can close as resolved.

Talesh · ‎09-29-2016

The font features of the comment box shown in teh screenshot are not available on the Security Forum, so I don't have the ability to use Monospaced fonts there.

Vinai · ‎12-14-2016

Instead of having to click buttons, it would be much nicer if markdown where supported (including inline code).

If you think so, too, please check this:

https://community.magento.com/t5/Share-Ideas-for-the-Forum/Support-markdown-in-forum-posts/idi-p/552...