Custom Text Colors for Defined Elements?

385 views
Skip to first unread message

Shawn Liebling

unread,
Dec 23, 2021, 1:30:32 PM12/23/21
to BBEdit Talk
Hi people! I'm not super technical, so simple explanations would be great.

So, I am working on a huge project where it would really help to have certain elements color coded.  Here is an example (numbers are not accurate):

[John Smith] <3435,3549>"Hello everyone," John exclaimed. He looked at the crowd. <3685,3798>"Let's begin this conversation with a fun story."

What I want is for the attribution ([John Smith]) to be a blue color, the number codes (<3435,3549>) to be very light grey so  they don't distract me, the dialogue (text inside quote marks) to be brown, and the non-dialogue text to be black.

I searched this group a bit and found a couple conversations that as asking a similar question, but there aren't any answers that work for what I'm wanting to do. 

So how might I go about this? I'm ok with adding a little code to make it work, but ideally I would be able to have something set up where anything within certain confines are color coded, like anything inside <> is light grey, etc.

I am currently getting around this by having my file be in HTML and using the elements already defined, but it looks messy and I don't know what all the syntax means. Here is an example screenshot of my current workaround:

Screen_Shot_2021-12-23_at_8.55.16_AM.png

With that in mind, another question is; is there a definition somewhere of what items in the text color prefs are exactly? Like in the HTML section, what is an "anchor tag"? And in  Markdown section, what is a "List item marker"?, etc.

I figure if I can't easily set up custom defined coloring, then maybe I can save my files in another format and use the items that are already defined, especially if the code has minimal extra junk in it. For example, the <!-- --> comment is a little messy, so having something like <! > would be easier for me to deal with.

I hope that all made sense. I'm still a bit of a BBEdit novice.

Thanks much for any help y'all can provide!
-Shawn

Media Mouth

unread,
Dec 23, 2021, 1:57:58 PM12/23/21
to BBEdit Talk
Something you might consider, esp. if you want to keep things simple, is custom tags in your HTML -- simple HTML + CSS.  There are ways of working with it that are pretty tight and minimal.

For instance

<dlg>"Hello everyone,"</dlg> <blu>John</blu> exclaimed. He looked at the crowed.  <dlg>"Let's begin this conversation with a fun story."</dlg >

<dlg> and <blu> are not actual recognized HTML tags, so they get interpreted as inline objects (like a <span>)
In major broswers they are responsive to CSS, for instance

blu {color:blue;}
dlg {color:#aaa;}

The shorter your custom tag names, the cleaner your document.  Obviously be careful not to accidentally use existing short HTML tags (e.g. <b> <a> <li>) (actually, you can even use them, so long as you use CSS to define out their default properties)

This approach can allow you to get pretty sophisticated quickly while keeping your document clean.



Also, you might consider Markdown.  There's a whole world of developers out there whose goal is to simply HTML (the idea behind "Markdown" is to make "Markup" more abbreviated)


On Dec 23, 2021, at 9:30 AM, Shawn Liebling <shawn...@gmail.com> wrote:

Hi people! I'm not super technical, so simple explanations would be great.

So, I am working on a huge project where it would really help to have certain elements color coded.  Here is an example (numbers are not accurate):

[John Smith] <3435,3549>"Hello everyone," John exclaimed. He looked at the crowd. <3685,3798>"Let's begin this conversation with a fun story."

What I want is for the attribution ([John Smith]) to be a blue color, the number codes (<3435,3549>) to be very light grey so  they don't distract me, the dialogue (text inside quote marks) to be brown, and the non-dialogue text to be black.

I searched this group a bit and found a couple conversations that as asking a similar question, but there aren't any answers that work for what I'm wanting to do. 

So how might I go about this? I'm ok with adding a little code to make it work, but ideally I would be able to have something set up where anything within certain confines are color coded, like anything inside <> is light grey, etc.

I am currently getting around this by having my file be in HTML and using the elements already defined, but it looks messy and I don't know what all the syntax means. Here is an example screenshot of my current workaround:

<Screen_Shot_2021-12-23_at_8.55.16_AM.png>

With that in mind, another question is; is there a definition somewhere of what items in the text color prefs are exactly? Like in the HTML section, what is an "anchor tag"? And in  Markdown section, what is a "List item marker"?, etc.

I figure if I can't easily set up custom defined coloring, then maybe I can save my files in another format and use the items that are already defined, especially if the code has minimal extra junk in it. For example, the <!-- --> comment is a little messy, so having something like <! > would be easier for me to deal with.

I hope that all made sense. I'm still a bit of a BBEdit novice.

Thanks much for any help y'all can provide!
-Shawn

--
This is the BBEdit Talk public discussion group. If you have a feature request or need technical support, please email "sup...@barebones.com" rather than posting here. Follow @bbedit on Twitter: <https://twitter.com/bbedit>
---
You received this message because you are subscribed to the Google Groups "BBEdit Talk" group.
To unsubscribe from this group and stop receiving emails from it, send an email to bbedit+un...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/bbedit/0d24f3a2-c774-4936-bec5-2ba3b4a8d6bfn%40googlegroups.com.
<Screen_Shot_2021-12-23_at_8.55.16_AM.png>

jj

unread,
Dec 23, 2021, 3:41:30 PM12/23/21
to BBEdit Talk
Hi Shawn,

Here is a minimal Codeless Language Module that should do what you want.

Name it "Shawn.plist".
Copy it in ~/Library/Application Support/BBEdit/Language Modules.
Restart BBEdit.

The Language Module should now be listed in the Preferences > Languages > Installed Languages.
If a file as the extension .shawn it will be recognized by BBEdit as a Shawn Language file, otherwise use the Language menu at the bottom of the document window.

To configure your favorite colors:

  • go to Preferences > Text Colors
 
  • create a new Color Scheme
 
  • setup the 'Comments', 'Strings' and 'Numbers' colors to your liking
 
  • go to Preferences > Languages
 
  • add the Shawn Language in the Language-specific settings list (bottom [+] button)
 
  • double-click the Shawn language you just added
 
  • in the 'Display' pane select your just create Color scheme
 
  • Restart BBEdit
 
Now on, if you select a 'Shawn' language document it should be highlighted as you want.

HTH

Jean Jourdain

--
Shawn.plist

```

    <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
    <plist version="1.0">
    <dict>
        <key>BBEditDocumentType</key>
        <string>CodelessLanguageModule</string>
        <key>BBLMColorsSyntax</key>
        <true/>
        <key>BBLMIsCaseSensitive</key>
        <true/>
        <key>BBLMKeywordList</key>
        <array>
        </array>
        <key>BBLMLanguageCode</key>
        <string>SHAW</string>
        <key>BBLMLanguageDisplayName</key>
        <string>Shawn</string>
        <key>BBLMScansFunctions</key>
        <false/>
        <key>BBLMFunctionScannerDoesFoldsToo</key>
        <false/>
        <key>BBLMSuffixMap</key>
        <array>
            <dict>
                <key>BBLMLanguageSuffix</key>
                <string>.shawn</string>
            </dict>
        </array>
        <key>Language Features</key>
        <dict>
            <key>Close Block Comments</key>
            <false/>
            <key>Close Statement Blocks</key>
            <false/>
            <key>End-of-line Ends Strings 1</key>
            <false/>
            <key>End-of-line Ends Strings 2</key>
            <false/>
            <key>Escape Char in Strings 1</key>
            <string>\</string>
            <key>Escape Char in Strings 2</key>
            <string>\</string>
            <key>Identifier and Keyword Characters</key>
            <string>\S</string>
            <key>Open Block Comments</key>
            <false/>
            <key>Open Line Comments</key>
            <false/>
            <key>Open Statement Blocks</key>
            <false/>
            <key>Close Strings 1</key>
            <false/>
            <key>Close Strings 2</key>
            <false/>
            <key>Open Strings 1</key>
            <false/>
            <key>Open Strings 2</key>
            <false/>
            <key>Number Pattern</key>
            <string><![CDATA[(?x)
    <
        [\d,]+?
    >
    ]]></string>
            <key>String Pattern</key>
            <string><![CDATA[(?x)
    (
        "(\\"|[^"])*?"  (?# Double-quote)
    |
        '(\\'|[^'])*?'  (?# Single-quote)
    )
    ]]></string>
            <key>Comment Pattern</key>
            <string><![CDATA[(?x)
    \[
        [^\[\]]+?
    \]
    ]]></string>
        </dict>
    </dict>
    </plist>

```

Shawn Liebling

unread,
Dec 25, 2021, 12:21:49 PM12/25/21
to BBEdit Talk
Hi JJ,

I accidentally clicked "reply to author" instead of "reply all", so here is a public response (I've never used Google Groups before, so still figuring it out).

Your solution is perfect and it works like a charm! Thanks so much. This is seriously a game changer and will save me a lot of time.

I'm also excited to know that I can changed the language using the drop down menu at the bottom of the window. I never noticed that feature before. As I said in my original post, I'm still fairly new to BBEdit and coding in general, so there is lots to learn!

Thanks again,
Shawn

Shawn Liebling

unread,
Dec 25, 2021, 12:21:49 PM12/25/21
to BBEdit Talk
Hi Harvey,

Thanks for the tips! I got a perfect solution from JJ, so I am going to use that instead, but I will keep your method in mind for other projects.

-shawn

Reply all
Reply to author
Forward
0 new messages