To customize syntax highlighting styles for your CNBlogs posts using Markdown, follow these steps:

Download Required Resources

First, obtain the necessary styling resources. You can preview various themes before selecting one that fits your preference.

Modify CSS Selectors

After extracting the downloaded package, navigate to the highlight\style directory and choose your preferred theme file.

Edit the CSS file by replacing all instances of .hljs with .cnblogs-markdown .hljs, ensuring there's a space between the two class names. This adjustment ensures proper rendering within CNBlogs' Markdown environment.

Apply Custom CSS to CNBlogs

In your CNBlogs dashboard:

1. Go to "Manage" → "Settings" → "Page Custom CSS".
2. Paste your modified CSS code into the editor.
3. Save the changes.

Troubleshooting Style Conflicts

If certain styles like background colors or text colors don't render correctly, use the !important declaration to override default styles.

For example, if the background color isn't applied:

.cnblogs-markdown .hljs {
  display: block;
  overflow-x: auto;
  padding: 0.5em;
  background: #232323 !important;
  color: #e6e1dc;
}

Example Configuration

The following CSS implements a style similar to Android Studio's default theme:

.cnblogs-markdown .hljs {
  color: #a9b7c6;
  background: #282b2e;
  display: block;
  overflow-x: auto;
  padding: 0.5em;
}

.cnblogs-markdown .hljs-number,
.cnblogs-markdown .hljs-literal,
.cnblogs-markdown .hljs-symbol,
.cnblogs-markdown .hljs-bullet {
  color: #6897BB;
}

.cnblogs-markdown .hljs-keyword,
.cnblogs-markdown .hljs-selector-tag,
.cnblogs-markdown .hljs-deletion {
  color: #cc7832;
}

.cnblogs-markdown .hljs-variable,
.cnblogs-markdown .hljs-template-variable,
.cnblogs-markdown .hljs-link {
  color: #629755;
}

.cnblogs-markdown .hljs-comment,
.cnblogs-markdown .hljs-quote {
  color: #808080;
}

.cnblogs-markdown .hljs-meta {
  color: #bbb529;
}

.cnblogs-markdown .hljs-string,
.cnblogs-markdown .hljs-attribute,
.cnblogs-markdown .hljs-addition {
  color: #6A8759;
}

.cnblogs-markdown .hljs-section,
.cnblogs-markdown .hljs-title,
.cnblogs-markdown .hljs-type {
  color: #ffc66d;
}

.cnblogs-markdown .hljs-name,
.cnblogs-markdown .hljs-selector-id,
.cnblogs-markdown .hljs-selector-class {
  color: #e8bf6a;
}

.cnblogs-markdown .hljs-emphasis {
  font-style: italic;
}

.cnblogs-markdown .hljs-strong {
  font-weight: bold;
}