I am making a webpage, and I am using WebGL for animation and making characters in blender. I want to know how to make those characters hyperlink so that when I click on any character it takes me to another webpage.

  • 2
    $\begingroup$ I'm voting to close this question as off-topic because it's a WebGL question, not a Blender question. If you intend this to be a Blender question, please edit it to be more clear. $\endgroup$ – Matt May 27 '16 at 14:04

First (if you haven't already), download the Blend4Web SDK and be sure to install it correctly. The SDK is different from the standalone add-on, so make sure you get the SDK (which includes the full-featured add-on, and also a lot more).

Set your render engine to Blend4Web.

Setting the render engine to Blend4Web

Enable Blend4Web's Logic Editor and create a new node tree by clicking the [+] button.

Enabling Blend4Web's Logic Editor and creating a node tree

In Blender's Node Editor, set the node tree type to Blend4Web logic, and select your node tree.

Selecting/specifying your node tree

Make a node setup like this to instruct it to redirect to another URL when an object is clicked:

Blend4Web Logic Editor node setup for a URL redirect

This node setup specifies that IF Suzanne (the monkey) is clicked, the redirect will happen, ELSE go back to listening for a click. That's why the "Miss" output routes back into the "Previous" input in a loop.

You can click the Fast Preview button on the right of the 3D Viewport's menu to preview it in your browser.

Once you're happy with the results, choose File > Export > Blend4Web (.html) to generate the standalone HTML file with all the 3D and interactivity data bundled into it.

Here's an example .blend (requires that the Blend4Web SDK be installed):

And here's an example HTML file generated from the .blend to demonstrate the functionality (requires that WebGL be enabled in your browser).

  • 1
    $\begingroup$ Good, I'm glad! Please accept the answer if it sufficiently addressed your question. Have fun with Blend4Web/WebGL, and good luck with your project. $\endgroup$ – Mentalist Jun 4 '16 at 13:18

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.