How to use an online C++ compiler in my site

I want to create a site (or wikibook or github page) that will have runnable c++ code examples, pretty much like cppreference (that apparently is using coliru in the Run this code button). I'm trying to Google myself through this but each tutorial has too many prerequisites for me follow.

Is there an established best practice or an easy to use toolchain? I thought jekyll + coliru would be the best combination but I don't know where to start.

I know this question is too broad, but I don't even know where to invest time. Any of the following would be a great answer (with decreasing order of preference):

• An existing example that I can modify / tweak
• A tutorial on building such a page
• A description of what tools I should use
• A book that describes such a process

Thanks for your help or suggestions.

PS1 : I wanted to add a "Wandbox" tag but apparently it doesn't exist

PS2 : I know there is klipse but the c++ support is very limited so that wouldn't be an ideal solution

I thought jekyll + coliru would be the best combination but I don't know where to start.

You could consider coliru.js, a JavaScript library for Coliru online compiler.
That way, you add <script>window.onload = coliru.addRunButtons</script> to your page to insert buttons into every C++ code block that will compile and run the code and displays the result below the code block.

<pre>
    <code data-lang="c++">
        int main()
        {
            return 0;
        }
    </code>
</pre>