Language name in code blocks

[pushbroomsweep]

Is it possible to include the language name in one corner (say the bottom-right corner) of the code blocks?

[niclasheinz]

Hi @pushbroomsweep

This is currently not available out-of-the-box. What you can do, however, is to first enable code highlighting and add a title in the code block.

Here is a sample of how you can easily add a Python label to Python code blocks using CSS:

.language-py .filename::after {
    content: " Python";
    font-size: 14px;
    font-weight: bold;
    color: #fff;
    background-color: #3572A5;
    padding: 2px 6px;
    border-radius: 4px;
    margin-left: 8px;
    vertical-align: middle;
    display: inline-block;
}

This will look like this:

So that you can use my CSS you have to make sure to define py in the code block in my example. This is what my example looks like:

``` py title="bubble_sort.py"
def bubble_sort(items):
    for i in range(len(items)):
        for j in range(len(items) - 1 - i):
            if items[j] > items[j + 1]:
                items[j], items[j + 1] = items[j + 1], items[j]
 _```

---

References:

• https://squidfunk.github.io/mkdocs-material/customization/?h=extra+css#additional-css