Mystique and WP-Syntax Incompatibility

If you use Mystique theme and WP-Syntax plugin (the syntax highligher) together, you will notice that, your code snippets will use Mystique’s fonts instead of monospace for colored words. When reading codes, monospace fonts like Courier fell much better, because they are easier to read.

Mystique’s style.css file defines default fonts with “*”, so every element on your site which does not have font information will use Mystique’s default fonts. WP-Syntax uses span elements for colors, and these elements do not have their font attributes defined.

In order to solve this problem, you have to add the following to wp-syntax.css file of the plugin:

.wp_syntax span {
  font-family: Courier, "Courier New", monospace;
}

This way, WP-Syntax will use the correct fonts for every span element, rendering colored words with correct fonts.

You may also like...

8 Responses

  1. Cyril says:

    Hello,

    how you put “x-repeat” at body in http://liguepes.com/blog.php/?mystique=css

    Thanx

  2. Thanks much! I actually use Mystique and decided to try and
    fix this issue on my site today. I was shocked when my Google
    search of: “WP-Syntax courier” brought this page up! Just glad I
    didn’t have to do too much troubleshooting on this. ~Greg

  3. Ryan says:

    Will this work with Google Fonts? I have noticed that when I try to apply Google Fonts to my titles it only applies to certain ones in my mystique theme.

  4. lovelucy says:

    Great, I also have this problem. At first I tried to change the “*” to “html,body,h1,h2,h3,h4,h5,h6,p,br,form,input,button,textarea,select,fieldset,blockquote,ul,ol,li,dl,dt,dd,pre” in Mystique’s style.css. Then I found this post and felt that this solution is better. Thank you for sharing.

  1. July 1, 2014

    scott tucker

    Mystique and WP-Syntax Incompatibility | Kerem Erkan

Leave a Reply

Your email address will not be published. Required fields are marked *