April 2, 2009

HTML Code Generator for Blogs

Step 1/3 - Data Input

In the box below paste the PGN data to be displayed by the Chess Viewer.
:

When you're finished you can move to the PGN Validator step:

Next  >>

44 comments:

 
author Alexis Harakis
authorUrl https://www.blogger.com/profile/17188924780394666555
adminClass blog-admin pid-1363740481
data:comment.favicon 
Alexis Harakis said...

This looks fantastic - my only wish is to customise a little more.
- Width
- Some other colours (text etc..)

Is this possible?

 
author Nikolai Pilafov
authorUrl https://www.blogger.com/profile/00695284688005658187
adminClass blog-admin pid-8567400
data:comment.favicon 
Nikolai Pilafov said...

You're welcome, Alexis
No, there are no text color customizations and the board sizes are fixed.
The main reason is to keep the applet as small as possible, which makes it fast to download and fast to run.

I hate to disappoint you, so, there are some more parameters that you could use:
1) GameToSelect as I described it in Using the Chess Viewer Applet
2) RefreshInterval can be used to broadcast a live game. I already used it during Amber Blindfold And Rapid Tournament (Live Games)
If you know a tournament that gives you a live PGN of the games you can set up a live broadcast on your blog in no time.
I bet you will be surprised how easy it would be.

The thing is that I prefer not to clutter the "HTML Generator" form too much, so if you feel like using such "advanced" parameters you'll have to do it manually. Take a look at the examples and if you have any questions just ask.

Cheers

 
author Alexis Harakis
authorUrl https://www.blogger.com/profile/17188924780394666555
adminClass blog-admin pid-1363740481
data:comment.favicon 
Alexis Harakis said...

Thanks Nikolai - I am using WordPress at the moment - overall I am very pleased with this viewer - it is the best around - I have used the .jar package and this was very easy to set up.

A couple of enhancement suggestions:
- in future it would be nice to make the board size and all colours/fonts configurable (thinking about the moveist on the right)
- maybe you could start by just having an alternative *smaller board version*
- scrolling is still a bit clunky - it seems the viewer refreshes on the screen with each scroll, a minor bug perhaps

Thanks again for making your excellent plugin publicly available

 
author Nikolai Pilafov
authorUrl https://www.blogger.com/profile/00695284688005658187
adminClass blog-admin pid-8567400
data:comment.favicon 
Nikolai Pilafov said...

Thanks for your suggestions, Alexis. I do appreciate them.
I wish I could spend more time with new features and ideas but as of current I’m trying to convince Sun’s JRE developers that compatibility is important and specifications were written so that *everybody* could respect them. Unfortunately, that is taking a lot of time and I feel many of the decisions to be made depend on the responses from Sun.

Let me share one more reason a “smaller board version” is not going to be on my list in the near future. According to the Web Statistics and Trends as of Jan’09 there are only 4% of users who have resolution of 800x600 (down from 8% in Jan’08) and there are 36% with 1024x768 (down from 48% in Jan’08). Overall 57% already use better resolutions than 1024x768. For all of them the fixed size board of CVD already appears smaller on their screens. If the trend goes like that in a few years I’ll have to worry about making the board bigger. I hope, you can understand why it is unlikely that I’ll worry about making a smaller board.

I’d love to see your work with WP. Can you give us a link, please?

 
author Anonymous
authorUrl 
adminClass blog-admin pid-1079544473
data:comment.favicon 
Anonymous said...

Nowadays, there is a lot of devices with small displays (telephones). Smaller board can be very good for portal-like web sites too.
On the other hand, with my screen resolution the apllet is very small and i prefer fetch pgn and use local viwer whenever it's possible.
Your viewer is great, but generally the fixed size applications are past.

 
author 17chessclub
authorUrl http://bspchessclub.blogspot.com/2009/10/yet-another-testing-ground.html
adminClass blog-admin pid-1808043246
data:comment.favicon 
17chessclub said...

Hi Mr Nikolai..Check my posting link here : using color customization for CVD squares.I simply put those two games inside the post body and it works very fine. Thanks for the advice! Cheers!

 
author 17ChessClub
authorUrl https://www.blogger.com/profile/16088928666089245412
adminClass blog-admin pid-1674799183
data:comment.favicon 
17ChessClub said...

Hi all! the link I used earlier on my last post isn't valid anymore.Please use the new one.Just for info, thanks.

 
author bstp
authorUrl https://www.blogger.com/profile/01106953160882820403
adminClass blog-admin pid-73880119
data:comment.favicon 
bstp said...

Hello,

Here is my little tip for you might like : copying the call to chessviewer directly into

Settings/Formatting/Post template

lets the writer only copy and paste the PGN. Here is my first form :

***

[!-- ChessViewer Section Start --]
[SCRIPT id="oChessViewer" type="text/javascript"}/*

(Paste PGN here)

*/ makeChessApplet ( null, { PuzzleMode: "off" } );[/SCRIPT]
[!-- ChessViewer Section End --]

***

(Replacing the [ and ] with < and >, of course.)

Thank you for your great work !

 
author Nikolai Pilafov
authorUrl https://www.blogger.com/profile/00695284688005658187
adminClass blog-admin pid-8567400
data:comment.favicon 
Nikolai Pilafov said...

Very good point, Benoit St-Pierre
What you’re suggesting is to set a post body template which will be used whenever we create a new post. In other words, instead of starting from scratch we are going to have an empty skeleton of a CV section allowing us to just paste our PGN into the middle of it and then publish the post.

This is an excellent technique which makes posting somewhat quicker by saving the visit to the “HTML Code Generator”. For example, a blogger who mostly publishes puzzles can certainly make use of this idea. I can only see two possible drawbacks:
1) Skipping the PGN validation step might be time consuming later (if problems are found);
2) Various customizations (colors, etc.) will be more difficult to apply this way.
In the end, it’s a matter of choice, and users should do it the way they’re more comfortable with.

The bottom line is that handling the CV section doesn’t cause extra troubles and isn’t more difficult than handling the rest of our content. All of the tricks that we normally use to automate our blogging experience can be applied to make our lifes easier.

Thanks for sharing

 
author bstp
authorUrl https://www.blogger.com/profile/01106953160882820403
adminClass blog-admin pid-73880119
data:comment.favicon 
bstp said...

Your most welcome !

I forgot to mention that being able to post multiple PGN games at the same time is very cool, as it speeds up the process while having less applets to load.

I also forgot to mention the little trick to hide the top bar, but that will stay between us... ;-)

If I find anything else that might help, I'll be back.

Kindest regards,

B

 
author c4d4e4f4
authorUrl https://www.blogger.com/profile/00636685817778706851
adminClass blog-admin pid-1821793421
data:comment.favicon 
c4d4e4f4 said...

hi nikolai..
how do i post a puzzle on the CVD and inserting annotations simultaneously? thx .

 
author Nikolai Pilafov
authorUrl https://www.blogger.com/profile/00695284688005658187
adminClass blog-admin pid-8567400
data:comment.favicon 
Nikolai Pilafov said...

Hi c4d4e4f4,
There’re several types of annotations – comments, move suffixes (!, ?, +-, -+, etc.) and NAG. One way of learning about them is to find a quick guide to PGN or some samples. It isn’t that difficult so most people can figure it out without reading the PGN specification (but feel free if you need it).

 
author bstp
authorUrl https://www.blogger.com/profile/01106953160882820403
adminClass blog-admin pid-73880119
data:comment.favicon 
bstp said...

Hello,

I started to build a website in french :

lajoliepartiedujour.blogspot.com

(The cute game of the day.)

It sure needs some tweaking, as it's only an alpha version. But I like what I see. I did not notice it at first, but the tagging system does not work well. If you click on Gambit Dame, i.e.

http://lajoliepartiedujour.blogspot.com/search/label/gambit-dame

you obtain an error message:

java.lang.NullPoint error

Maybe it's because there are many instance of the viewer on the same page, but I don't think so.

If someone can tell me what is the problem, that would be appreciated. If not, I'll try to find a workaround to index the games.

The first idea I am considering is to create permanent posts, like "gambit-dame", which would contain all the queen gambits of the collection.

 
author Nikolai Pilafov
authorUrl https://www.blogger.com/profile/00695284688005658187
adminClass blog-admin pid-8567400
data:comment.favicon 
Nikolai Pilafov said...

Hi bstp,
I don’t see any problem on the index page you gave above (I'm using Windows/IE).
My guess is that the error has to do with the specific platform/browser/JRE version.

Can you try it on another machine?
Then you might try a different browser and/or different JRE (just the usual Java troubleshooting).

The following links can help:
Index by month
Index by Label
Also you can visit Testing LiveConnect object functionality
where you can find out more about your Java installation.

Let us know how it goes

 
author Hugo
authorUrl https://www.blogger.com/profile/14455323084528630069
adminClass blog-admin pid-1101087972
data:comment.favicon 
Hugo said...

Hi Nikolai.

This is something i've been looking to post my games for a while.

But my club's website isn't a blog, but a website from www.weebly.com. so my question is "Can i still post my games in the website using chess viewer? "

Thanks

 
author Nikolai Pilafov
authorUrl https://www.blogger.com/profile/00695284688005658187
adminClass blog-admin pid-8567400
data:comment.favicon 
Nikolai Pilafov said...

No problem at all, Hugo
You can perfectly use the same approach as described here. The only difference is that you have more control when you’re dealing with a Web site. The easiest way would be:

1) Make sure you do the “Step One” first and insert the “deployChessViewer.js” in the header of your page(s) as described in How to publish a chess game on your blog ;
2) Do the “Step Two” exactly as if you’re publishing on a blog;
3) On “Step Three” you should insert the newly generated CV section into the HTML code of your Web page. If you’re using some kind of visual editor you’ll have to figure it out by yourself. Try looking for something like “raw HTML” or similar. As an alternative you can edit your page's HTML with a plain text editor. It all depends on how comfortable you’re with the environment.

Give it a try and give us a link where we can see your results.

 
author Wayne
authorUrl https://www.blogger.com/profile/04937370042178079159
adminClass blog-admin pid-392564163
data:comment.favicon 
Wayne said...

Congratulations are in order for you Nikolai!

The organizers of the 2010 Gibtelecom Chess Festival are using Chessviewer Deluxe to post games games played in their tournament to the internet.You can view your program in action by going to the following website: http://www.gibraltarchesscongress.com/gib2010/downloads/2010gibmast8.html

 
author Nikolai Pilafov
authorUrl https://www.blogger.com/profile/00695284688005658187
adminClass blog-admin pid-8567400
data:comment.favicon 
Nikolai Pilafov said...

Thanks for the tip, Wayne
They are certainly making a good use of CVD. As you pointed out, all the games of 2010 (all the rounds and tournaments) can be found at Downloads and Game Viewers. I also noticed that in View/Download games played at the Gibtelecom Festival (2003-2009) they have all the previous years games since 2003. There are literally few thousands of games altogether.

 
author GM Anshu
authorUrl https://www.blogger.com/profile/02563741558078013866
adminClass blog-admin pid-471390206
data:comment.favicon 
GM Anshu said...

Hi friends. I am new to this blog.
I have doubt should i download the Chess Viewer Deluxe and then i could Web Publish it

 
author Nikolai Pilafov
authorUrl https://www.blogger.com/profile/00695284688005658187
adminClass blog-admin pid-8567400
data:comment.favicon 
Nikolai Pilafov said...

Hi GM Anshu,
For the easiest way to publish follow “How to publish a chess game on your blog” (see the side bar). If you need a blog to do this you can always create one for free here @ blogger.com.
Downloading the JAR is useful for Webmasters who have their own Web sides.

 
author GM Anshu
authorUrl https://www.blogger.com/profile/02563741558078013866
adminClass blog-admin pid-471390206
data:comment.favicon 
GM Anshu said...

Where is the CV Section and where to paste the code of HTML CODE GENERATOR FOR BLOGS

 
author Nikolai Pilafov
authorUrl https://www.blogger.com/profile/00695284688005658187
adminClass blog-admin pid-8567400
data:comment.favicon 
Nikolai Pilafov said...

What you get on the “Step 3/3 - The Result” is the CV section. On that page you will see “Click here for more detailed instructions (optional)” link. Click it for further instructions.
But make sure you’re done with “How to publish a chess game on your blog” instructions first. When you’ve tried it, please, give us a link to your blog where we can see the result.

 
author Alberto
authorUrl https://www.blogger.com/profile/11587825100655166766
adminClass blog-admin pid-934900589
data:comment.favicon 
Alberto said...

For the first time in some years of chess blogging a found a decent, easy to perform chess viewer! Many thanks for the tip, this really made my day.

Again, thanks from Brazil.

 
author Kuldhir
authorUrl https://www.blogger.com/profile/18186282541542191115
adminClass blog-admin pid-1911804033
data:comment.favicon 
Kuldhir said...

Wonderful application.. ihave been looking this for long.. i am posting few basic openings here on my blog: http://anandwcc2010.blogspot.com/2010/06/few-openings.html

Only problem i am facing is that when i re-edit my post to include more games in same post, and once i switch between 'edit html' and 'compose' mode, some kind of
tags get included my html code and it shows error : Your HTML cannot be accepted: Tag is broken: BR

Help would be appreciated.

And once again thanks for such a nice applet.

 
author Nikolai Pilafov
authorUrl https://www.blogger.com/profile/00695284688005658187
adminClass blog-admin pid-8567400
data:comment.favicon 
Nikolai Pilafov said...

Welcome aboard, Kuldhir
I’m glad you found what you’ve been looking for.
Switching the post editor between “Compose” and “Edit HTML” is known to create side effects and the problem is seen in many other situations (beyond chess publishing). The core issue has to do with the “Convert line breaks” setting as I explained in “Editing the CV section”

To learn more about this matter follow the sidebar link “Separate Your Paragraphs”. Also you can make use of the newer post editor, called “Blogger in Draft”, which is more flexible and allows every post to have its own “line breaks” setting.

Let us know what works best for you.

 
author RUSTICBULL
authorUrl https://www.blogger.com/profile/10228036698486961940
adminClass blog-admin pid-1831538229
data:comment.favicon 
RUSTICBULL said...

sir nikolai,

i've been using this tool in my blog for years already (sample: http://chesswindows.blogspot.com/2010/10/good-show.html)

great tool indeed!!

however, all i could post are complete games - meaning starting from move 1 up to the end

i've been wishing to use this tool for puzzles, or to start from a certain position. how could i possibly do that?

thanks a lot and more power!! your tool is a valuable help!!

 
author Nikolai Pilafov
authorUrl https://www.blogger.com/profile/00695284688005658187
adminClass blog-admin pid-8567400
data:comment.favicon 
Nikolai Pilafov said...

Hi RUSTICBULL,
Posting puzzles is as simple as posting complete games. Pick any puzzle on my blog and take a look at the page’s HTML source. To do that you need to go to View/Source in your browser. Scroll few pages down and you will find the CV section containing the PGN for that puzzle. After that you should be able to do it yourself. If you have any questions don’t hesitate to ask.

Regards
Nick

 
author RUSTICBULL
authorUrl https://www.blogger.com/profile/10228036698486961940
adminClass blog-admin pid-1831538229
data:comment.favicon 
RUSTICBULL said...

Yesssssssssssssss!! I finally made it!! Thanks a lot for your wonderful tool!! More power!!

please see my sample http://chesswindows.blogspot.com/2010/10/kiddie-wesley-tactics.html

 
author webdevseoanddesignblog
authorUrl https://www.blogger.com/profile/00309010316202471114
adminClass blog-admin pid-1027645465
data:comment.favicon 
webdevseoanddesignblog said...

Brilliant idea Nikolai *CHEERS* I was just expecting a little more creativity.

 
author Nikolai Pilafov
authorUrl https://www.blogger.com/profile/00695284688005658187
adminClass blog-admin pid-8567400
data:comment.favicon 
Nikolai Pilafov said...

WebDevSeoAndDesignBlog,
I can’t imagine what you’ve been looking for but I hope it is chess related. Even so, you still won’t be able to find marble chessboards or 3D pieces on this site. On the other hand, if you care about the most comprehensive PGN support implemented in a Web based chess viewer, then you’ve come to the right place.

 
author Wayne
authorUrl https://www.blogger.com/profile/04937370042178079159
adminClass blog-admin pid-392564163
data:comment.favicon 
Wayne said...

Nikolai, I was wondering if you would have any idea why Chessviewer Deluxe games I post to my blog seem to work with every browser except Firefox. When I try to view a game I have posted to my blog using Firefox, the game and Chessviewer Deluxe appears for a few seconds in my blog entry, however, Chessviewer Deluxe disappears and I am left with a blank space where Chessviewer Deluxe should appear. Has anyone else mentioned this problem to you? Thanks for helping me when you have time,
Sincerely,
Wayne

 
author Nikolai Pilafov
authorUrl https://www.blogger.com/profile/00695284688005658187
adminClass blog-admin pid-8567400
data:comment.favicon 
Nikolai Pilafov said...

Hi Wayne,
In fact, most of my visitors use FF and I found that few hundreds of them used FF 4. You didn’t say if you could see CVD games on my blog. I can assure you that there’s no difference between publishing on my blog as compared to publishing on yours (or any other). I haven’t modified anything for a long time now so let me know and then we can take it to the next level.

If your PC works fine when visiting my blog, then there must be something in yours blog’s settings and/or layout. It’s possible that a widget might not be fully compatible with FF. You can always temporary disable, compare the output and then re-enabled them.

 
author Wayne
authorUrl https://www.blogger.com/profile/04937370042178079159
adminClass blog-admin pid-392564163
data:comment.favicon 
Wayne said...

Hi Nikola,
thank you for answering my inquiry so quickly. Yes I can see the puzzles and games you have posted here using Chessviewer Deluxe when I use Firefox.However for me to see the games I had to reload the page first.After doing that I could see them.This was not the case to see the puzzles. Thank you for suggesting that it might be a widget, my browser settings or the page layout of my blog that may be causing this problem. I will do as you suggest and if the problem still exists I will post another message to you here.Have a great Friday and a great Weekend,
sincerely,
Wayne

 
author edaz
authorUrl https://www.blogger.com/profile/03920544714290927266
adminClass blog-admin pid-1896787022
data:comment.favicon 
edaz said...

Hi there

I recently changed my blogger template design and now the chessviewer will not appear in my blog.
I didn't alter the code which is in my posts,I was just wondering if anyone knows why this problem occured?

 
author Nikolai Pilafov
authorUrl https://www.blogger.com/profile/00695284688005658187
adminClass blog-admin pid-8567400
data:comment.favicon 
Nikolai Pilafov said...

Hi edaz,
I just checked out your page at Opening tricks and tips! and it works very well in FF and IE browsers. Did you revert back the layout/template to what you used before?

I noticed that the main content column isn’t wide enough which causes some clipping. Have you tried blogger’s newest templates? (see “The Blogger Template Designer” in the sidebar)

Also, please, read my other suggestions above because the widgets you use might be affecting the result.

Let me know how it goes

 
author JLaz
authorUrl https://www.blogger.com/profile/02045917544421751851
adminClass blog-admin pid-861018826
data:comment.favicon 
JLaz said...

Hi Nikolai,
First I want to commend you for the fantastic improvements you have made with the Game Viewer. I have included it in our local chess club website to display some of our tournament games, which leads me to the following question: How can I pass a parameter to the applet param using perhaps JavaScript so that the viewer can change the collections of games in the dropdown. Your input would be very much appreciated, thanks.

 
author Nikolai Pilafov
authorUrl https://www.blogger.com/profile/00695284688005658187
adminClass blog-admin pid-8567400
data:comment.favicon 
Nikolai Pilafov said...

Hi JLaz,
I'm sorry I missed your comment but you probably figured out the answer by now. The game collection is controlled by the content of the PGN. Every game in the PGN will have an entry in the dropdown. I doubt you're trying to load games dynamically but even that's possible if you invoke the "makeChessApplet" again in a similar way as in first place. Please, be more specific about what you're trying to achieve.

 
author Jughandle10
authorUrl https://www.blogger.com/profile/12458336057319601893
adminClass blog-admin pid-452979637
data:comment.favicon 
Jughandle10 said...

nikolai, i posted on my blog, but it seems that while on the sample viewer the game is fine, on mozilla on my actual blog firefox crashes.

is this a firefox specific issue?

thanks!

(mentalmidgetry.blogspot.com)

 
author Nikolai Pilafov
authorUrl https://www.blogger.com/profile/00695284688005658187
adminClass blog-admin pid-8567400
data:comment.favicon 
Nikolai Pilafov said...

Hi Jughandle10 (???)
The system is fully compatible with FF and many other browsers. I will repeat my advice from above. Try to simplify your blog by temporary removing all widgets. It’s possible that a widget might not be fully compatible with FF. You can later re-enable them one by one until you find the culprit. Also, I couldn’t find any instance of CVD on your pages. Please, provide a working link.

 
author Ajinkya Patwardhan
authorUrl https://www.blogger.com/profile/16041999736360222539
adminClass blog-admin pid-1316568499
data:comment.favicon 
Ajinkya Patwardhan said...

Thanks for giving such a nice application. It is working perfectly.
Can we connect it with the chess engine so that while live games it can be used to annotation.
thanks.

 
author Deji Adegbite
authorUrl https://www.blogger.com/profile/14137425543525193619
adminClass blog-admin pid-2120949741
data:comment.favicon 
Deji Adegbite said...

Hi, thank you so much for giving us chessviewer. I use it to publish games on my <a href="http://sagemodechess.blogspot.com>Sage Mode Chess blog</a>. However, could please help me look at this pgn and tell me what's wrong with it. I've been trying to publish the game on my blog but it has not been working.
Thanks. See the PGN below:

[Event "Casual"]
[Site "unknown"]
[Date "????.??.??"]
[Round "?"]
[White "Sorungbe Ademola"]
[Black "Fritz 10"]
[Result "1-0"]

1.e4 e5 2.Nf3 Nc6 3.Nc3 Nf6 4.d4 exd4 5.Nxd4 Bb4 6.Bb5 Nxe4 7.O-O Nxc3 8.Re1+ Kf8 9.bxc3 Bxc3 10.Nxc6 bxc6 11.Bxc6 Rb8 12.Ba3+ Kg8 13.Re7 Bf6 14.Rxf7 Kxf7 15.Bd5+ Kg6 16.Qd3+ Kh6 17.Qh3+ Kg6 18.Bc1 Bg5 19.f4 Rf8 20.Qd3+ Rf5 21.g4 d6 22.fxg5 h5 23.h3 Qe8 24.Bd2 Qe5 25.Rf1 Qxd5 26.gxf5+ Qxf5 27.Rxf5 1–0

 
author Nikolai Pilafov
authorUrl https://www.blogger.com/profile/00695284688005658187
adminClass blog-admin pid-8567400
data:comment.favicon 
Nikolai Pilafov said...

Hi Deji
Congratulations on your blog Sage Mode Chess . I'm happy I could help and I also have an answer to your question.

The PGN specification defines ASCII as its alphabet. Because of that, we have to be very careful with other characters which aren't allowed. In addition, there's one more problem in your PGN sample -- the result in the result tag doesn't match the one at the game end. Yes, it looks like it does but if you try searching for "1-0" on the page you will see that they are different.

The fix is very easy - just copy/paste the PGN text in the "PGN data" box and re-type over the final result "1-0" (make sure you use "minus"). Hit "Next" and enjoy the game.

BTW, I find it very amusing when I see respectable chess software which would load similar (or worse) games with no errors or warnings. Go figure !

 
author Deji Adegbite
authorUrl https://www.blogger.com/profile/14137425543525193619
adminClass blog-admin pid-2120949741
data:comment.favicon 
Deji Adegbite said...

Thanks Nikolai, you're the best. I've made the necessary corrections and updated my blog.

Be cool.

 
author SW Florida Chess Club
authorUrl https://www.blogger.com/profile/08729676202004433797
adminClass blog-admin pid-209140310
data:comment.favicon 
SW Florida Chess Club said...

Hello Nikolai,
Thanks for sharing the viewer. I want to use it on my Club's website http://www.swfloridachessclub.com but I'm getting an error message: "The value of the property "make ChessApplt" is null or undefined, not a Function object. Can you help me with this?