Users of simplemachines based forums can integrate the pgn4web chessboard just by adding bbcode tags to their posts, like this:
[pgn] ... PGN data ... [/pgn]
The following procedure is has been tested with simplemachines version 2.0.x (see comment below the article for simplemachines version 1.1.x).
The forum administrator should install and enable the Custom BBCodes Manager module, or similar module to allow for the creation of custom BBCodes.
From the Custom BBCodes Manager module admin page the forum administrator should then create the custom bbcode for the [pgn]{content}[/pgn]
tag; please refer to the module documentation for guidelines how to set the different options.
The reccomended value for the HTML used for the tag
is the following (for some unknown reason it works better when entered as a single line with no newlines):
<script type='text/javascript'> "use strict"; var pgn4webPath = "/pgn4web"; var pgn4webTextareaIdNum; if (pgn4webTextareaIdNum === undefined) { pgn4webTextareaIdNum = 1; } var pgn4webTextareaId = "pgn4web_" + pgn4webTextareaIdNum++; document.write("<textarea id='" + pgn4webTextareaId +"' style='display: none;'>"); </script>{content}</textarea> <script type='text/javascript'> "use strict"; document.getElementById(pgn4webTextareaId).value = document.getElementById(pgn4webTextareaId).value.replace(/<.*?>/g, ' '); var height = 268; var multiGamesRegexp = /\s*\[\s*\w+\s*"[^"]*"\s*\]\s*[^\s\[\]]+[\s\S]*\[\s*\w+\s*"[^"]*"\s*\]\s*/m; if (multiGamesRegexp.test(document.getElementById(pgn4webTextareaId).value)) { height += 34; } document.write("<iframe src='" + pgn4webPath + "/board.html?am=l&d=3000&ss=26&ps=d&pf=d&lcs=WdSO&dcs=LHCg&bbcs=LHCg&hm=b&hcs=lF6v&bd=c&cbcs=UJuI&ctcs=BoVy&hd=j&md=f&tm=13&fhcs=$$$$&fhs=14&fmcs=$$$$&fccs=v71$&hmcs=M___&fms=14&fcs=m&cd=i&bcs=WdSO&fp=13&hl=t&fh=b&fw=p&pi=" + pgn4webTextareaId + "' frameborder=0 width=100% height=" + height + " scrolling='no' marginheight='0' marginwidth='0'>your web browser and/or your host do not support iframes as required to display the chessboard</iframe>"); </script>
Please remember to set the variable pgn4webPath
above to the path of the pgn4web folder on your site.
Please note these settings apply a predefined set of colors and options to match the default simplemachines template; if you need to change any of the colors and options (the parameters after board.html in the code above) you can refer to the board widget instructions wiki page or ask for support.
The instructions above require pgn4web 1.91 or later and requires that simplemachines and pgn4web are on the same domain.
In case you need to install simplemachines and pgn4web on different domains, please use the following alternative value for the HTML used for the tag
. Please note that this alternative solution limits the size of the PGN data to approximately 2000 characters:
Alternative HTML used for the tag
:
<script type="text/javascript"> "use strict"; var pgn4webURL = "http://pgn4web.casaschi.net"; if (!document.getElementById("pgn4webEncoderScript")) { document.write('<script id="pgn4webEncoderScript" type="text/javascript" src="' + pgn4webURL + '/pgn-encoder.js"><!--' + 'script-->'); } </script> <script type='text/javascript'> "use strict"; var pgn4webTextareaIdNum; if (pgn4webTextareaIdNum === undefined) { pgn4webTextareaIdNum = 1; } var pgn4webTextareaId = "pgn4web_" + pgn4webTextareaIdNum++; document.write("<textarea id='" + pgn4webTextareaId +"' style='display: none;'>"); </script>{content}</textarea> <script type='text/javascript'> "use strict"; var pgnText = document.getElementById(pgn4webTextareaId).value.replace(/<.*?>/g, ' '); var height = 268; var multiGamesRegexp = /\s*\[\s*\w+\s*"[^"]*"\s*\]\s*[^\s\[\]]+[\s\S]*\[\s*\w+\s*"[^"]*"\s*\]\s*/m; if (multiGamesRegexp.test(pgnText)) { height += 34; } document.write("<iframe src='" + pgn4webURL + "/board.html?am=l&d=3000&ss=26&ps=d&pf=d&lcs=WdSO&dcs=LHCg&bbcs=LHCg&hm=b&hcs=lF6v&bd=c&cbcs=UJuI&ctcs=BoVy&hd=j&md=f&tm=13&fhcs=$$$$&fhs=14&fmcs=$$$$&fccs=v71$&hmcs=M___&fms=14&fcs=m&cd=i&bcs=WdSO&fp=13&hl=t&fh=b&fw=p&pe=" + EncodePGN(pgnText) + "' frameborder=0 width=100% height=" + height + " scrolling='no' marginheight='0' marginwidth='0'>your web browser and/or your host do not support iframes as required to display the chessboard</iframe>"); </script>
Please remember to set the variable pgn4webURL
above to the URL of the pgn4web server you plan to use.
For a better appearence of the post editor, you might want to upload the image below as button for the pgn tag:
<
and >
characters; please make sure your PGN data does not contain <
and >
characters. With minor modifications to the integration guidelines described above other bbcode tags can be created for specialized applications, for instance taking advantage of the board widget puzzle support.
Wiki: BoardWidget_instructions
Wiki: BoardWidget_puzzle
Wiki: Contribute
Wiki: Index
Wiki: UserContributedMaterial
Wiki: User_Notes_Web_Platforms
Wiki: User_Notes_mybb
View and moderate all "wiki Discussion" comments posted by this user
Mark all as spam, and block user from posting to "Wiki"
Originally posted by: pa...@casaschi.net
how to stop the games from autoplaying
Some forum administrators prefer the chessboard to load without automatically starting autoplaying the games. In order to achieve that, simply replace in the bbcode definition am=l with am=n
Last edit: Anonymous 2016-07-02
View and moderate all "wiki Discussion" comments posted by this user
Mark all as spam, and block user from posting to "Wiki"
Originally posted by: pa...@casaschi.net
the puzzle tag
The pgn tag can be easily modified into a tag optimized for puzzles, hiding the move text until the user clicks on the prompt in order to show the puzzle solution. In order to achieve that, simply replace in the bbcode definition am=l with am=n, hd=j with hd=v and md=f with md=p.
View and moderate all "wiki Discussion" comments posted by this user
Mark all as spam, and block user from posting to "Wiki"
Originally posted by: pa...@casaschi.net
simplemachines version 1.1.x support
The method above works with simplemachines version 2.0 and above because the
Custom BBCode Manager
module only support those platforms.For use with simplemachines version 1.1.x this alternative module for creating custom bbcodes can be used. This module only supports the older versions of simplemachines; for use with later versions of simplemachines, please see this support thread.
Last edit: Anonymous 2017-07-26