How to configure the FEN viewer?

I'm going to explain how you can publish re-playable chess games on your blogspot blog without the need to use another external site. This will be done in some different steps, which will enable you to detect possible problems as early as possible (without having done a lot of work).

This first step will enable you to use the FEN viewer.

First, Go to Layout » Edit html
and make a backup of your template

Now we look for the line with the title tag. This is probably something like <title><data:blog.pageTitle/></title> and copy the following lines just before this line.

<script src=''

Next you have to add the following lines to the css part
.board img{margin:0;padding:0;border:0;background:none transparent}
.board table,tr{margin:0;line-height:9px}

If you don't know where to add it an appropriate place is probably just before the line
And now the configuration part is finished (after you have saved your template) and you are able to use the FEN-viewer in your posts, just like in the post about displaying a diagram and about the improved blogspot FEN viewer.
Use the edit html to insert this kind of code in a post. The used code (in your post) for this last mentioned diagram with the letters, figures and Black to move indication is
<script language="JavaScript">
  • The first argument is the FEN code of the diagram that has to be displayed
  • The second optional argument (0, 1 or 2) indicates if the White/Black-to-move indication has to be shown. No move indication: 0, White to move: 1 and Black to move:2
  • The third optional argument indicates if the figures and letters have to be shown.

The code mentioned above results in:

  • After a few mistakes it worked out well for me :) Thanks for these tips

  • For some reason I just can't get this to work :(
    Could you please describe a bit better where exactly the codes should be inserted? Im using blogspot too ( so it should work...hmmm

    I tried the viewer at , and it worked fine. The design tho, doesn't fit my blog, so I wanted to give yours a try...

  • @ T. Hansen

    Somehow I have missed this comment before, and I can't contact you. Somehow I am unable to leave a comment on your blog.

    Can't you find the title tag in your theme? Maybe you can just give it another try, create a test post and let me know.

  • я сделал вроде все по схеме, а у меня отображается не понятно что. Посмотрите, please,

  • I looked at your site. You mention that you have done everything as described, but it doesn't even include the link to the javascript from or the css part that has to added. Furthermore it doesn't even contain a game with this viewer.
    So I don't know why you asked me to have a look at your site.

  • Regrettably it doesn't look too great in Opera, the row letters at the bottoms are skewed to the right.

  • @ Diego Amicabile
    I'll see the problem and will solve it in the next weeks.
    In the meantime you can just use it without the third optional argument. It's not necessary to use the figures and numbers.

  • @ Diego Amicabile
    I think that the problem has been solved.

  • Not sure, on this post for instance in Opera it is still skewed to the right. It is ok in Firefox though. Am I forgetting something ?

  • I have only adapted the code on this blog. After some more testing the external JavaScript file will also be updated. (This will take a couple of days)
    So at the moment you can only check the result of the update on this blog (on the post above).

  • Hi!

    It's only been about 3,5 yrs since my problem where posted, so I thought I'd give it a new shot :D

    The test board came up correctly, so now I guess I'm good to go further! :)

  • @ Diego Amicabile
    Yesterday the new code has been uploaded. The problem with opera should be solved.

  • Am i missing something but i cant seem to find where i can download this publishing tool?!

  • You don't have to download anything at all, but if you want to copy and paste the code in your own template as described in you can download it here: