The mind of the six billionth one…
Posts tagged Mystique
Adding Facebook and LinkedIn icons on Mystique v2.x
Feb 25th
Mystique theme for WordPress has reached version 2.0. Milenko is very active on updating it. With 2.0, you don’t need to edit any theme files manually, and this makes it much easier to add new social networking icons and replace the default Twitter and RSS icons. Here is how to do it:
First, download the image below (all icons were created by Mark Hewitt, I only merged the LinkedIn icon into the default icon set. You can find other icons on his site.), and upload it to your site. It will go to the SITE_ROOT/wp-content/uploads/ directory, if you did not change your upload destination.
![]()
OK, now that you have uploaded your image to your site, you will have to edit your site style. You will add the necessary changes to Mystique’s settings, so that they will not be overwritten after a theme update. Go to your admin panel and select Mystique settings under Appearance. In the settings page, select the User CSS tab, and add the following lines there:
/* Extra navigation icons */ #header a.nav-extra.rss{background:url("/wp-content/uploads/nav-icons.png") no-repeat scroll right top transparent} #header a.twitter{background:url("/wp-content/uploads/nav-icons.png") no-repeat scroll -128px top transparent} #header a.linkedin{background:url("/wp-content/uploads/nav-icons.png") no-repeat scroll -64px top transparent} #header a.facebook{background:url("/wp-content/uploads/nav-icons.png") no-repeat scroll 0px top transparent}
The numbers after scroll in these lines select which icon to show. 0px is the first icon (i.e. Facebook), -64px is the second one (i.e. LinkedIn) etc. with decreasing 64 pixels.
Adding up on Mark Hewitt’s Mystique Facebook Icon Hack
Jan 22nd
UPDATE: This post is only valid for Mystique versions up to 1.7.2. Newer versions need a different approach which can be found on this post.
Well, Mystique is a beautiful theme, but the original icons for Twitter and RSS Feed you see on the upper right were not very appealing to the eye. And the Facebook and LinkedIn icons? They are not part of the theme.
So, what I have done to add those extra icons is, follow the instructions on Mark Hewitt’s Facebook Icon for Mystique Theme post. But editing the style.css file and uploading the icons over and over is not necessary after each theme update, so here are more update friendly instructions:
First, download the following image (all icons created by Mark, I only merged the LinkedIn icon into the default icon set), and upload it to your site. It will go to the SITE_ROOT/wp-content/uploads/ directory, if you did not change your upload destination.
![]()
OK, now that you have uploaded your image to your site, you will have to edit your site style. But instead of editing the style.css file directly, you will add the necessary changes to Mystique’s settings, so that they will not be overwritten after a theme update. Go to your admin panel and select Mystique settings under Appearance. In the settings page, select the User CSS tab, and add the following lines there:
Mystique and WP-Syntax Incompatibility
Jan 18th
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.
New blog theme, Mystique
Nov 20th
I was using the Arclite theme from designer Milenko Popovici (digitalnature), and went to his site to check for updates to the theme. I saw Mystique theme there and loved it instantly. So, I will be using it for my blog from now on. This man has real talent! ![]()



