Bold code in a question

Question

Frequently when I ask a question I have to include quite a bit of code for reference purposes.

It would be nice to be able to bold the important lines in the code.

For example this code:

<DataTrigger Value="True">
    <DataTrigger.Binding>
        <MultiBinding Converter="{StaticResource DisableWorkItemConverter}">
            <Binding ElementName="MainForm" Path="PickedWorkItemID"/>
            <Binding Path="Id"/>
        </MultiBinding>
    </DataTrigger.Binding>
    <Setter Property="IsEnabled" Value="False"/>
    <Setter Property="IsSelected" Value="False"/>
</DataTrigger>

Is not way long, but the important part (as seen in this question) is the second to last line. However, if I try to bold it, it ends up looking like this:

<DataTrigger Value="True">
    <DataTrigger.Binding>
        <MultiBinding Converter="{StaticResource DisableWorkItemConverter}">
            <Binding ElementName="MainForm" Path="PickedWorkItemID"/>
            <Binding Path="Id"/>
        </MultiBinding>
    </DataTrigger.Binding>
    <Setter Property="IsEnabled" Value="False"/>
    **<Setter Property="IsSelected" Value="False"/>**
</DataTrigger>

Not what I was going for. It would be nice to be able to draw attention to specific lines of code when needed.

(One suggestion of a different color background sounds nice too (ie a yellow background to draw the eye to the relevant code.)

If there is some other way to bold in code please let me know.

Answer 1

I see a few options:

1. Simply add a comment in the appropriate language syntax to draw attention to the important line of code.

2. However, It might be better to have automatic line numbering for code blocks, so then you can just say "see here on line X...".

If you are including so much code that it is not clear which are the "important" parts, generally you are including too much code. Try to boil it down to the smallest working example possible.

Answer 2

You could always try to create the HTML by hand:

<DataTrigger Value="True">
    <DataTrigger.Binding>
        <MultiBinding Converter="{StaticResource DisableWorkItemConverter}">
            <Binding ElementName="MainForm" Path="PickedWorkItemID"/>
            <Binding Path="Id"/>
        </MultiBinding>
    </DataTrigger.Binding>
    <Setter Property="IsEnabled" Value="False"/>
    <Setter Property="IsSelected" Value="False"/>
</DataTrigger>

<pre><code>&lt;DataTrigger Value="True"&gt;
    &lt;DataTrigger.Binding&gt;
        &lt;MultiBinding Converter="{StaticResource DisableWorkItemConverter}"&gt;
            &lt;Binding ElementName="MainForm" Path="PickedWorkItemID"/&gt;
            &lt;Binding Path="Id"/&gt;
        &lt;/MultiBinding&gt;
    &lt;/DataTrigger.Binding&gt;
    &lt;Setter Property="IsEnabled" Value="False"/&gt;
    <b>&lt;Setter Property="IsSelected" Value="False"/&gt;</b>
&lt;/DataTrigger&gt;
</code></pre>

I would like to point out that you will have to replace < with <, and > with >.

Answer 3

I've done this on occasion, though I can't find the answers in which I've done it.

this is bold code and this isn't

And this is how I did it:

<code>this is **bold code** and this isn't</code>

or also:

this is bold code and this isn't

And this is the source:

<code>this is <b>bold code</b> and this isn't</code>

Answer 4

Not pretty, just a workaround.

Ascii art is your friend.

<DataTrigger Value="True">
    <DataTrigger.Binding>
        <MultiBinding Converter="{StaticResource DisableWorkItemConverter}">
            <Binding ElementName="MainForm" Path="PickedWorkItemID"/>
            <Binding Path="Id"/>
        </MultiBinding>
    </DataTrigger.Binding>
    <Setter Property="IsEnabled" Value="False"/>
    <Setter Property="IsSelected" Value="False"/>     <-----+
</DataTrigger>                                              |
                                                            |
                                                            |
             yo, this line here! ----------------------------

Answer 5

Usually I will tag a comment on the line I'm trying to highlight. Comments have different syntax highlighting than normal code. Perhaps the highlighting of comments could be made bold to make it more noticeable or the bold highlighting only apply in a commented section?

  var foo = new Bar();  // here is the problem...

Answer 6

That sounds like a good idea. Here's how I would implement it:

Unformatted markdown

Here's my example code:

    var fruit = "Apple"
 -> if isRipe(fruit) do
        eat(fruit)
    end

Rendered post

Lines having that arrow should automatically be highlighted with a differently coloured background. Maybe one could add a reference number for each highlighted line.

Here's my example code:

 var fruit = "Apple"
 if isRipe(fruit) do                                                       [1]
     eat(fruit)
 end

Answer 7

Some IDEs look for keywords within comments and treat them like bookmarks. Specifically, if you type TODO: fix this bug in a comment it is added as an item in the "table of contents" pop up menu.

What if a special keyword or syntax within a comment triggered the highlighting? For example:

<DataTrigger Value="True">
    <DataTrigger.Binding>
        <MultiBinding Converter="{StaticResource DisableWorkItemConverter}">
            <Binding ElementName="MainForm" Path="PickedWorkItemID"/>
            <Binding Path="Id"/>
        </MultiBinding>
    </DataTrigger.Binding>
    <Setter Property="IsEnabled" Value="False"/>
    <Setter Property="IsSelected" Value="False"/> <!-- HELP: here is the problem -->
</DataTrigger>

HELP: seems like a reasonable keyword that won't generate too many false positives. Either the background of the line could be colored, or (this may be simpler to implement) that particular comment can receive louder formatting (since the default comment formatting is light gray text).

Answer 8

After looking through all conservations, I still think that bolding in code is handy, especially for those who doesn't have much time. Yeah, there's many other ways to draw attention, but bolding just seems easier for starter.

Answer 9

In addition, sometimes it's useful to be able to have formatting inside code blocks: for instance, to represent some "computer-genic" hierarchical structure (e.g. filesystem) with nested lists. Or should code blocks be used for that at all? Triple backticks are used for block code with ignored formatting. Double backticks are redundantly used same as single ones (except with some added escaping functionality). My suggestion is to use double backticks for block code with allowed formatting. (By the way, it resembles strict equality check === vs loose one == in some programming languages :)

Usage examples (notice the double backticks):

This...:

``
- c:
    - documents and settings
        - admin
        - all users
        - default user
        - *username*
            - application data
            - local settings
                - temp
    - program files
        - Microsoft Office
        - Windows Media Player
    - Windows
        - fonts
        - system32
``

...should generate this:

c:
documents and settings
admin
all users
default user
username
application data
local settings
temp
program files
Microsoft Office
Windows Media Player
Windows
fonts
system32

and this...:

``
create [temp|temporary] table [if not exists] *table-name* (
    *column-name* [*type-name*]
)
``

...should generate this:

create [temp|temporary] table [if not exists] table-name (
    column-name [type-name]
)

and since markdown isn't markup, markup shouldn't be rendered, but stay literal, as written:

``
<book id="bk101">
    <author>Gambardella, Matthew</author>
    <title>XML Developer's Guide</title>
    <genre>Computer</genre>
    **<price>44.95<price> <!-- error: wrong closing tag -->**
    <publish_date>2000-10-01</publish_date>
    <description>An in-depth look at creating applications with XML.</description>
</book>
``

the above generates this (markup is untouched):

<book id="bk101">
    <author>Gambardella, Matthew</author>
    <title>XML Developer's Guide</title>
    <genre>Computer</genre>
    <price>44.95<price> <!-- error: wrong closing tag -->
    <publish_date>2000-10-01</publish_date>
    <description>An in-depth look at creating applications with XML.</description>
</book>

If you need markup formatting flexibility (e.g. colored highlights), you can wrap your code in <pre><code> and style as you wish (until markdown introduces similar styling possibilities).

Answer 10

The OP picked XAML to ask the question, when dealing with XML-based languages it would be hard using pre/code, but for the reference, if you're dealing with C# for example or any other language not involving a lot of less-than/greater-than signs, this should be really easy to achieve.

This:

public void Greet()
{
    Console.WriteLine("Hello world!");
}

Would be rendered from the following input:

<pre>
public void Greet()
{
    Console.WriteLine(<b>"Hello world!"</b>);
}
</pre>