WordPress Plugin – FV Code Highlighter
Posted by Frank | Filed under Wordpress Plugins
The main subject of this blog will be web development and feature some interesting articles and tutorials ranging from PHP and jQuery to HTML and CSS. The problem I was facing when I built this theme was the lack of awesome code highlight plugin. I just couldn’t find one that was working for me.
FV Code Highlight Example
I thought maybe more people were looking for a plugin that simply publish codes that looks great. I started to write my own, and the FV Code Highlight plugin was born and now open for the public. The features are plain and simple, read on.
Description
This plugin supports the highlighting of PHP, HTML, CSS and XML. The default tag-highlighter color scheme uses the same colors Adobe’s Dreamweaver is using. This makes it easy for your visitors to recognize what type of codes you wrote. These colors can be changed to your liking in the WPadmin section of your blog.
Features
- Easy to use
- Renders XHTML, CSS, XML and PHP (in parts)
- Default look: Dreamweaver style
- Customizable look of codes and code box
How to use this plugin?
1. Upload the folder `fv-code-highlighter` to the `/wp-content/plugins/` directory
2. Activate the plugin through the ‘Plugins’ menu in WordPress
3. Place 
in your pages to use the highlighter
Example
CSS Code
/* Comment */ @import url("main.css"); h3, .head2 { font-family: "Sans-Serif"; font-weight: bold; color: #336699 !important; } @media screen, print { pre { margin: 0px 10px 10px; } h1 { font-size: 14px; padding-top: 10px; } }
(x)HTML Code
<style type="text/css"> headline {font-size: 24pt;} </style> <!-- Comment --> <td><a href="link">Plain Text </a> <img src="image" alt="" width="15" /> <form action="action.pl"> <input type="submit" value="Press Me" /> </form>Text</td>
Plugin Info
AUTHOR: Frank Verhoeven
AUTHOR URL: http://www.frank-verhoeven.com/
WORDPRESS VERSION: 2.5+
TESTED UP TO: 2.6.2
CURRENT VERSION: 1.0
Download
DEMO: Live Demo
DOWNLOAD: FV Code Highlighter, Mirror
September 13th, 2008 at 1:18 am
Awesome plugin my friend! Use it all the time.
September 14th, 2008 at 1:13 pm
Thanks, and thanks again for all your help and support!!
September 15th, 2008 at 7:12 pm
Hi, ur plugin is very nice, i am using it…but this version still not support JAVA. Anyway, i have modify it so that it able to format some simple JAVA code. I am wating for ur next release, hope that coming release ll include JAVA formating.Thanks ya, nice job!
September 15th, 2008 at 8:55 pm
Hey bighead,
Thanks for the compliment!
At this moment I don’t know much about Java, but I will try to get it implemented in the next release.
September 17th, 2008 at 8:10 am
Thank you for a great plugin Frank!
I got an error I wanted to run by you in case it is a bug. Of course it might just be my fault instead.
When I use the
on a code segment it all works well.
When I use the
on a code segment I get the error while the blog post is rendering:
Fatal error: Call to undefined function: htmlspecialchars_decode() in /home/itrating/public_html/wp-content/plugins/fv-code-highlighter/phpHighlighter.php on line 19
My WordPress engine is version 2.6.1
Thanks
September 17th, 2008 at 8:51 am
tmax, thanks!
I guess you’re running PHP 4, since this function only works on 5.1 and up. However, the problem can be fixed!
Open the file phpHighlighter.php with notepad or your favorite text editor (it’s in the fv-code-highlighter directory), and search for the next line:
It should be line number 19.
Now replace that line with this line:
And everything should work perfect!
In the next release this problem will be automatically fixed, since it will get a better PHP highlighter.
September 17th, 2008 at 9:01 pm
Thank you Frank!
I tried exactly what you said. I now get the following error:
“Warning: cannot yet handle MBCS in html_entity_decode()! in /home/itrating/public_html/wp-content/plugins/fv-code-highlighter/phpHighlighter.php on line 19″
Since you mentioned that this will get fixed in the next version I am happy to wait until that comes out instead of pestering you with this, though.
Thank you for the great plugin!
September 17th, 2008 at 9:23 pm
Too bad it didn’t help you
I hope to get version 1.1 ready within three weeks.
September 21st, 2008 at 3:45 pm
Very Good~!!
October 2nd, 2008 at 3:24 am
plug-in isn’t working for me – I’m running wp 2.6.2
I inserted the code
but it just displays as plain text. This is within an actual blog post. Is this plugin only for pages? thanks
October 2nd, 2008 at 11:07 am
It should work both in pages and posts,
be sure to use the right syntax as described aboveand download the latest version. If that still doesn’t work, please send me an email with your server details, so I am able to find the problem.October 4th, 2008 at 5:52 am
Another satisfied customer! Works great.
October 26th, 2008 at 5:22 pm
[...] FV Code Highlighter – If you want to highlight code tags like HTML, CSS, PHP or JavaScript on your WordPress blog you [...]
October 29th, 2008 at 5:39 pm
hi!
i can’t use the plugin i have it active but i place the
and i can see the { code} and nothing higlighted
what am i doing wrong?
October 29th, 2008 at 9:44 pm
Hey,
You need to remove the = between code and type. So it becomes {code type=php}.
November 16th, 2008 at 1:44 am
[...] FV Code Highlighter [...]
November 24th, 2008 at 12:30 am
how can i put javascript theme in this, now days its more javascript then html.. can we have javascript option too please..
November 24th, 2008 at 4:22 pm
As soon as PHP is fixed (it now still has some bugs), I can easily add JavaScript support very easy. So it will come soon
November 29th, 2008 at 12:16 pm
Wow… thanks God ! I found You Franks… FV COde Highlighter it’s So helpfull
December 12th, 2008 at 3:17 pm
GREAT PLUGIN!
February 10th, 2009 at 3:56 am
great plugin, work perfectly on wordpress 2.7. thanks
February 10th, 2009 at 4:34 am
[...] FV Code Highlighter works very similar to most the other syntax highlighting scripts, but I like how the plugin use the default dreamweaver tag color and the background color. [...]
February 11th, 2009 at 4:19 pm
[...] Auswahl war groß. Ich wählte dann das WordPress-Plugin FV Code Highlighter von Frank Verhoeven aus. Interessant fand ich, dass die standardmäßig Hervorhebung mit der [...]
February 19th, 2009 at 11:05 am
[...] FV Code Highlighter WP Plugin [...]
February 20th, 2009 at 8:10 am
[...] FV Code Highlighter WP Plugin [...]
February 25th, 2009 at 10:46 pm
Great plugin! Any news on the js support?
March 9th, 2009 at 12:25 am
I would love to use this plugin, but for some reason it’s giving me a fatal error on activation (Fatal error: Cannot redeclare class FVCodeHighlighting in /…/wp-content/plugins/fv-code-highlighter/FVCodeHighlighter.php on line 13)..
Any idea on what’s going wrong?
March 9th, 2009 at 1:15 am
Okay, the fatal error is fixed now. Apparently I had an extra folder called trunk which caused this (just re-downloaded and there isn’t any trunk folder in that one.. odd..).
Still isn’t working though..
April 11th, 2009 at 7:45 pm
[...] FV Code Highlighter [...]
April 17th, 2009 at 6:51 pm
[...] 3) FV Code Highlighter [...]
May 13th, 2009 at 4:18 am
Great plugin. Cannot wait for PHP to start working. Also is there anything in the works for bash?
May 24th, 2009 at 5:50 pm
[...] avoir recherché et tester de nouveau plugin, je suis tombé sur FV Code Highlight. Ce n’est pas le plus beau, ni le plus complet mais quand je saisi un code, deux jours après [...]
May 25th, 2009 at 1:00 pm
[...] FV Code Highlighter WP Plugin [...]
June 20th, 2009 at 1:54 pm
[...] Do you publish visible code on your blog posts? Here’s a nifty plugin for that: FV Code Highlighter. See how it works here and [...]
July 1st, 2009 at 11:03 pm
I love this Plugin, It’s great…
The colors are great, and its working fine in PHP code…
The only think I will suggest you to add are one or two functions…
A Copy All Button and why not, a Print Button
Well that are just ideas from others plugin…
(Sorry my english, I am from Argentina)
Are you working in more codes like JS C++ and more?
July 4th, 2009 at 6:38 am
NeatHighlighter.com is a very easy to use highlighter and highlights code in standard colors
July 18th, 2009 at 10:39 pm
[...] FV Code Highligher by Frank Verhoeven. You can view samples on the website. It works for CSS and HTML only at the moment. The design of the code box is pretty. [...]
July 28th, 2009 at 9:52 pm
[...] FV Code HighlighterFrank Verhoeven released this great code higlither that transforms plain text in higlighted code in the same style of the Dreamweaver higligther. The [...]
July 29th, 2009 at 12:52 pm
[...] fv code highlighter frank verhoeven tarafından üretilen bu renklendirici dreamweaver kullanıcılarına pek de yabancı gelmeyecek [...]
July 30th, 2009 at 12:18 am
This brings me to an idea:…
July 30th, 2009 at 8:00 am
[...] 1. SyntaxHighlighter2. Quick Highlighter3. FV Code Highlightermore.. [...]
July 31st, 2009 at 12:40 pm
[...] fv code highlighter frank verhoeven tarafından üretilen bu renklendirici dreamweaver kullanıcılarına pek de yabancı gelmeyecek [...]
August 15th, 2009 at 3:17 pm
[...] FV Code Highlighter [...]
August 18th, 2009 at 6:02 pm
Same problem as Hiranthi:
Fatal error: Cannot redeclare class FVCodeHighlighting in /home/.sites/***/***/wp-content/plugins/fv-code-highlighter/FVCodeHighlighter.php on line 13
Interestingly enough, the plugin works. All code is being displayed all pretty but the plugin is in the “inactive” category.
Any ideas what went wrong?
August 21st, 2009 at 9:52 pm
I think it doesn’t work with 2.8.4
August 23rd, 2009 at 9:04 am
Вообще, на мой взгляд, самое лучшее в личном блоге, так это самопознание.
September 2nd, 2009 at 4:13 am
Hi Frank, I was wondering if you have intention of extending the code highlight to other languages like ColdFusion (cfml), Flex (mxml).
If not, where could I jump in to modify the highlighting ? I’m a ColdFusion developer and I post codes in my blog.
Thanks for your attention.
September 4th, 2009 at 9:12 pm
Thanks! Good news
September 7th, 2009 at 8:14 pm
thanks for this!
<p>test
September 24th, 2009 at 9:04 pm
[...] FV Code Highlighter WP Plugin [...]
September 28th, 2009 at 11:40 am
[...] FV-Code Highlighter. Il fonctionne presque mais ne colorie rien! Alors je l’enlève, c’est dommage il faisait partie de ceux qui nécessitent le moins de pirouettes, il suffit d’insérer votre code entre les fausses balises:
, où “type” peut prendre les valeurs qui m’ intéressent: HTML, CSS, PHP et XML. Il manque les javascripts, de toute façon. Tant pis. [...]
October 10th, 2009 at 5:02 am
Silkroad Online (silk road gold) is a fantasy MMORPG set in the 7th century AD, along the Silk Road between China and Europe. The game requires no periodic subscription fee, but players can purchase premium items to customize or accelerate gameplay.
Silkroad Online is noted for silk road gold its “Triangular Conflict System” in which characters can select from the three jobs of trader, hunter, and thief to engage each other in player versus player combat. Thieves attack traders who are protected by hunters. Hunters kill thieves getting experience to level up to a higher level of hunter. Traders silk road gold complete trade runs to get experience to level up to a higher level of trader, and thieves kill traders and hunters to level up. Thieves can also steal goods dropped by traders to take to the thieves’ den to exchange for gold and thief experience.
November 28th, 2009 at 8:15 am
[...] fv code highlighter frank verhoeven tarafından üretilen bu renklendirici dreamweaver kullanıcılarına pek de yabancı gelmeyecek [...]
December 1st, 2009 at 4:07 pm
[...] FV Code Highlighter WP Plugin [...]
December 18th, 2009 at 6:58 am
[...] ceva timp am descoperit un plugin denumit FV Code Highlighter care m-a ajutat intr-o anumita masura sa rezolv aceasta problema intr-o anumita [...]
January 9th, 2010 at 9:40 pm
[...] you could have read here, the current release of my code highlighter has some trouble with highlighting PHP on servers [...]
January 11th, 2010 at 11:06 pm
[...] FV Code Highlighter WP Plugin [...]
January 17th, 2010 at 5:34 pm
[...] mon choix s’est tourné vers FV Code Highlighter. Il fonctionne avec HTML, CSS et PHP. La présentation est sobre et imite le code source dans [...]
January 24th, 2010 at 5:14 pm
[...] FV Code Highlighter uses a similar format as Dreamweaver to highlight particular types of code so anyone familiar with that coding scheme will have an easy time looking through your coding samples. It will highlight code from HTML, PHP, CSS and XML. The highlight colors can be changed if you prefer them something different but the familiarity with Dreamweaver makes the default settings quite useful. [...]
January 31st, 2010 at 10:17 am
Awesome Plugin, had a few niggles but after reading others users comments I had it working in no time CHEERS
February 3rd, 2010 at 6:12 am
Thanks for the compliment!
February 10th, 2010 at 6:18 am
[...] vì nó còn tùy thuộc vào nhu cầu của bạn nữa. Hiện tại tôi đang dùng plugin FV Code Highlighter cho blog của [...]
February 26th, 2010 at 12:14 pm
[...] http://www.frank-verhoeven.com/wordpress-plugin-fv-code-highlighter/ Click here to cancel reply. [...]
February 27th, 2010 at 6:58 pm
Great plugin! One question. Can you adjust the width of the code snippit without hardcoding a css value for the span class?
March 4th, 2010 at 1:38 pm
I have been trying to use this plug-in but have not succeeded. I use the syntax mentioned i.e.
. The codeblock is displayed but it is not highlighted. I am currently using wordpress version 2.9.2.
March 17th, 2010 at 1:26 am
[...] next one I found was called “FV Code Highlighter” which I found noted in this blog. I am not sure who speckboy is, but he sure has a great [...]
March 18th, 2010 at 10:23 am
[...] 6. FV Code Highlighter [...]
March 20th, 2010 at 4:19 pm
[...] you see & in the above code snippet replace it with just &. There’s a bug in the FV Code Highlighter plugin used to display code snippets here that prevents ampersands in code from displaying properly [...]
March 21st, 2010 at 6:54 pm
wonderful plugin!
Thanks a lot
April 3rd, 2010 at 3:05 pm
[...] 4. FV Code Highlighter [...]
April 10th, 2010 at 2:38 pm
[...] FV Code Highlighter ปลั๊กอินตัวนี้ นานๆ จะได้ใช้ที ซึ่งเมื่อไหร่ก็ตามที่ผมมีการเขียนโค้ดโปรแกรม (coding) ลงในบทความ ผมก็จะเรียกใช้งานเจ้าปลั๊กอินนี้ทันที ซึ่งปั๊กอินตัวนี้มันจะทำให้ เราอ่าน Code ที่เราเขียนลงในบทความง่ายขึ้น มีการทำ highligh Code ให้สีแตกต่างกันออกไป ทำให้ง่ายต่อการอ่านครับ [...]
April 17th, 2010 at 5:14 pm
Hi,
first of all thank you very much for this great plugin.
And I have a question, why does this plugin write some tags in there which do not exist in my code? Look at the screenshot:
http://emdesigns.de/demo/code1.jpg
and
http://emdesigns.de/demo/code2.jpg
I hope you can help me.
April 20th, 2010 at 10:47 pm
Hi there,
Where must I put the code. I would like to use it on wordpress theme editor. I put the code on theme-editor.php, but I can not see any difference.
Thanks
Valentin
April 24th, 2010 at 8:11 am
I want use it.But wordpress told me the header have a mistake.
April 28th, 2010 at 5:24 pm
Frank, great tool. Please add to your docs up at the top that you need to specify {code type=XXX} Although it makes complete sense, most of us are looking for a quick solution and do not always think as deeply as the designer. We obviously code -but we’re lazy too bud.
May 23rd, 2010 at 10:59 pm
[...] FV Code Highlighter [...]
May 25th, 2010 at 6:14 am
.horizontalaccordion>ul { margin: 0; padding: 0; list-style:none; height: 300px; }June 6th, 2010 at 10:37 pm
[...] FV Code Highlighter – Developed to give the blogger full control over their codes, FV Code Highlighter will allow you to highlight HTML, CSS, PHP, or JavaScript with ease. submit_url = 'http://traffichoss.com/my-top-10-wordpress-plugins/'; [...]
June 20th, 2010 at 3:33 pm
[...] 4. FV Code Highlighter [...]
June 22nd, 2010 at 12:28 am
Nice work! and thank you very much for this wonderful plugin…