openFrameworks web site
Python Mako JavaScript CSS Shell Nginx Other
Latest commit 6637486 Feb 23, 2017 @arturoc arturoc committed on GitHub Merge pull request #587 from HalfdanJ/patch-1
Old android studio tip that got lost in a PR
Failed to load latest commit information.
_dbtools changed a ton of files to make docs/ into ducmentation/. changed the … Dec 22, 2011
content Old android studio tip that got lost in a PR Feb 22, 2017
documentation.ko/math move korean docs to their own folder, were breaking english docs Sep 8, 2016
documentation removed manual hyphenation Jan 21, 2017
files of_inverted for threadedImageLoader example Mar 22, 2016
learning Update How_to_load_and_display_an_image.markdown Jan 22, 2017
messages tutorial korean page does not exist yet Jul 26, 2016
plugins tutorials plugin: dependency on contributing to docs snipet Mar 17, 2016
themes/openframeworks fix docs generation on empty subtitles Sep 8, 2016
tutorials fix mistype May 8, 2016
utils stats: fix start and end dates Mar 8, 2016
.gitattributes trying to keep line endings as lf Sep 14, 2013
.gitignore gitignore Jan 21, 2016 scripts Jan 21, 2016
book_hook.php missing hooks Jan 21, 2016 fix build script for non bash Mar 17, 2016 port to nikola Jan 21, 2016 fix build server script Jan 23, 2016
commit_hook.php build scripts Jan 14, 2015 0.9.8 Nov 22, 2016 import_release: import linux gcc5 & 6 Dec 12, 2016 fix docs generation on empty subtitles Sep 8, 2016 port to nikola Jan 21, 2016 add link Feb 24, 2016 오타 수정 (zhsrc -> .zshrc) Apr 15, 2016 Changed link to how to contribute to documentation Apr 27, 2016 fix korean link. Mar 2, 2016
release_hook.php fix scripts Jan 21, 2016 fix docs generation on empty subtitles Sep 8, 2016 add module docs intro template + clang scripts Nov 4, 2015

openFrameworks site

This repository stores the content and code that generates the openFrameworks website.

for other language, please read below.


To contribute fixes to the webpage or documentation you can usually just fork this repository and send contributions directly from github.

Most of the content is in the content folder in markdown folder.

The tutorials folder is structured with a first level of folders that represent the category and then a inside them markdown files with the extension .markdown and a folder for each of them with the same name as the text file that contains images or any other resource. The final html for each tutorial gets generated at the same level as it's resources so the links have to be relative and without any folder like:


The documentation folder contains the OF API reference and are also in markdown format. This docs are generated from the code but the description field in every class, function or var can be edited directly in the markdown files.

Setting up the site to build locally

This site is built using nikola. There's some scripts in the root folder to make it easier to install and use.

  1. First, if installing on Mac OS-X, make sure the Xcode command lines tools have been installed:

    xcode-select --install

    and then install the following packages (If you do not have brew installed you can grab it from

    brew install python3
    sudo easy_install pip
    brew linkapps python3
  2. From the ofSite source directory, run ./ which installs nikola and all the needed dependencies. (This has only been tested on linux and OS-X).

  3. Finally add the following to your .basrc, .bash_profile or .zshrc file: export XML_CATALOG_FILES="/usr/local/etc/xml/catalog"

There are two scripts included in the ofSite root to help work with the docs:

./ : Runs nikola and builds the site every time any file is modified.

If, on osx, you receive this error: FileNotFoundError: [Errno 2] No such file or directory: 'asciidoctor', you need to install asciidoctor as explained here, and then run the script again.

./ : Starts a local web server that serves the site and opens it in the browser.

If you plan to do a big modifications like contribute a translation the easiest is to leave the 2 last scripts running and just edit the content files and the site will automatically get refreshed.

Documentation-style markdown

The documentation portion of the site is written in Markdown, a wiki-style syntax. See details on Daringfireball.

The easiest way to check the syntax is having a look at the many pages already on the site, but here are some useful tips:

To insert code snippets use four tildes followed by curly braces with ".cpp" inside, and ending with four tildes:

for(int i = 0; i < 16; i++) {
    ofLog() << i;

Images are added using normal markdown format:

![Image Title](filename.png "alt text")

For a more complete description of how to contribute documentation, please see the Contributing to the Documentation tutorial.