How to Generate HTML Pages with PGN Variations
You should read this text from within the LT-PGN-EDITOR
Quickstart
Click on the pieces on the pgn board in the left frame to make some valid moves. Copy the pgn movetext from the textbox
near the board to the input field in the top frame and click the button "Generate HTML". After this a HTML page with
clickable pgn moves should appear in the frame at bottom right. Test it by clicking the moves. After that reload the
LT-PGN-EDITOR by clicking the "Reload" or "Back" button of your browser, in order to continue to read this text.
Example: 1.e4 e5 2.d4 exd4 3.Qxd4
Add a Variation
Input the pgn text of the main line into the input field and generate the HTML page. Click in the generated HTML page on the
move where the new variation starts and after this generate the pgn text of the variation by clicking on the board. Copy the
pgn text of the variation to the input field where you want to insert it and surround it with parentheses () or brackets [].
If the variation starts with a black move, copy also the previous white move (with move number) and replace the move by
"...". If the next move after a variation is a black move, then it must start with move number + "...". After that click the button "Generate HTML" and test the result.
Example: 1.e4 e5 2.d4 exd4 (2. ... d6 3.d5) 3.Qxd4
Multiple Variations
To generate multiple variations, simply input a variation into another variation, behind another variation or into or behind the main
line.
Example: 1.e4 e5 2.d4 exd4 (2. ... d6 3.d5 (3.dxe5 dxe5 4.Qxd8+ Kxd8) 3. ... f5 4.exf5 Bxf5 ) 3.Qxd4 (2. ... Nf6 3.dxe5 Nxe4 4.Qd4 d5 5.exd6 Nxd6)
Note: If a "variation" doesn't consist of a single move (but only comment), then no other variation can be included
in this variation (see example below).
Example:1.e4 e5 (Not bad!(Not possible!)) 2.d4 exd4 (2. ... d6 3.d5) 3.Qxd4
Don't use a semicolon to separate variations (this example will not work correctly):
1.e4 e5 2.d4 exd4 [2. ... d6 3.d5 (3.dxe5 dxe5 4.Qxd8+ Kxd8) 3. ... f5 4.exf5 Bxf5 ; 2. ... Nf6 3.dxe5 Nxe4 4.Qd4 d5 5.exd6 Nxd6] 3.Qxd4
Use this syntax instead (every variation in its own braces):
1.e4 e5 2.d4 exd4 [2. ... d6 3.d5 (3.dxe5 dxe5 4.Qxd8+ Kxd8) 3. ... f5 4.exf5 Bxf5 ][ 2. ... Nf6 3.dxe5 Nxe4 4.Qd4 d5 5.exd6 Nxd6] 3.Qxd4
Adding Comment
You can write any comment at the start of a variation, at the end of a variation or after a black move. If you want to write
comment after a white move you must write move number + "..." before the next black move or you must include the comment
into {}. You may only use numbers within your comment, when there is a letter in front of it (for instance "e4") or when
it is in braces (for instance "{game 4}"). You may add any marks directly behind the moves
(for instance "!", "?!", "+-", "#").
Example: Game 4 started with 1.e4 e5 followed by 2.d4 {the same opening as game 3} exd4!? (after 2. ... d6 3.d5 is not bad for white) 3.Qxd4!! is very aggressive 3. ... Nc6 4.Qd1 and black will soon be mated
Using SAN and FEN
If you want to use a certain SAN or FEN, then input the SAN or FEN value into the input field in the left frame and click the
button "Apply" before you generate any pgn text by clicking on the bord and before you generate the HTML page.
Example: Load the file black_king_walk.html for a FEN example.
When you have clicked the link then you must reset the FEN string in the left frame
(delete the FEN and click Apply) before you try the other examples.
Adding Diagrams
You can include (static) chess diagrams into the generated HTML page. This is useful if you want the page to be printed
or if you want to create a non-JavaScript webpage. To display a chess diagram at a certain position in the main line or
in a variation, write the halfmove number at this position and surround it with parentheses () or brackets []. When you
want to show the pawn structure then add .0 (pawns only) to the halfmove number.
Use this especially together with the "no script" checkbox checked. In order to rotate the chess diagrams, click in the
left frame on the checkbox "rotate board" before you click the "Generate HTML" button.
Example: (0) 1.e4 e5 2.d4 exd4<Cd4R><Ad1d4G> (4)(2. ... d6 3.d5 (3.dxe5 dxe5 4.Qxd8+ Kxd8<Ac1g5R><Af7f6G> (8)) 3. ... f5 4.exf5 Bxf5 (8.0)) 3.Qxd4 (5)(2. ... Nf6 3.dxe5 Nxe4 4.Qd4 d5 5.exd6 Nxd6 (10))
Finalizing
Click with the right mouse on the generated HTML page, choose "View page source" and save the source as a html file.
You can further edit this file like any other html file. Alternatively you can generate the HTML "as text" and copy it from the textarea to an empty file in an editor.
The following applies only to HTML pages, which have been generated with the "no script"
checkbox unchecked. In the final version of the file you should change the
line
//else setTimeout('OpenGame()',400);
into
else setTimeout('OpenGame()',400);
so that the game will automatically be loaded when the page is loaded. If you don't allow the viewer of the page to
change moves by clicking on the board (you could do this by the JavaScript command "AllowRecording(true)"), then you can
also remove the line
<a href='javascript:OpenGame()'><b>RELOAD GAME</b></a><br>
in the HTML file. In your final HTML page you will see, that all the commented game text is put into the function
ApplyPgnMoveText("...");
If the commented game text contains much more comment than valid moves, then it makes sense to remove the comment from the
string which is given to the function (however all valid moves in the string must remain unchanged!). In this way the
game loads a bit faster (and is also a bit faster parsed), which can make a difference if the client uses a slow computer
or a webbrowser with a slow JavaScript engine.
Hints, Suggestions, Bug Reports
If something doesn't work as it should or you have any suggestions for further versions of the LT-PGN-VIEWER, then you could write
me an email. However, if something doesn't work as it should, then this doesn't
mean automatically, that the bug is in the LT-PGN-VIEWER. Especially, if you copy and paste the text from any annotated game
in the input field and click the "Generate HTML" button, there is a probability (which grows with the move count and comment
length), that there is an error in the game text, so that the generated HTML page behaves "strange". To find the
reason in such a case, here are some hints what you could do: Generate the HTML page only for a limited number of moves and
check in this way out, at which position the error occurs. Put all your comment in braces; if the error still occurs, remove
all comment and try again. The most common error will probably be caused by comment which is not included in braces {} and
which contains numbers (so the script is assuming this is a move number) or any possible valid moves within the comment.
If you found an error, which you think is a bug in the LT-PGN-VIEWER, I would be glad when you would send me a minimal
example which reproduces the error together with your bug report.