STLViewer 1.0 for WordPress

After a lot of work i’ve finished Version 1.0 of my STLViewer plugin for WordPress. You can download it at or update it in your WordPress installation.

What is new?

Almost everything. I’ve rewritten most of the plugin because the first version where mostly made for my usecase. Now everything is nice, shiny and customizable.

Note: if you update, please disable en re-enable the plugin once to get the default settings in place.

Note2: In this version, the point 0,0,0 (xyz) needs to be at the center of the object. 

Note: The floor file needs to be on the same server to avoid cross-site security errors.

What does it do and how does it work?

It displays STL files in a WordPress page with a simple shortcode. Global settings can be made in settings page but for each shortcode these can be overwritte.

It displays the 3d files with WebGL, a technology annlowing your browser to directly use the GPU (graphics card). It works with three.js.

Note: if you plan on upoading high-res STL files keep in mind that the users browser has to download it once every time you open / refresh the page becasue the viewer start immediatly. This could cause a lot of server traffic and make people browsing on mobile networks very unhappy and it my be slow. Yes, it also works on relativly new smartphones like the Nexus 5, Sony Z2 or LG G3.

If you have question, requests or other things you want to tell me: don’t be shy and write me here.

How can i use variables for the position of the lights?

There is a 4-dimensional vector called dimensions. If a vector scares you think of it as a container holding 4 values. You can use it to place the lights according to your object dimension.

  • dimensions.x gives you the length in x-axis of the object. Same for y and z.
  • dimensions.w gives you the radius of the sphere containing the object. No part of the object is out of that radius.

This variable can be used in the settings page or in the shortcode.

Extra features

  • If you don’t specify a file, it will take the postname and add ‘-web.stl’.
  • More to come.

How do i overwrite the global settings fo a special stl file?

Each global setting can be overwritten in the shortcode. The variable name is written on the settings page between the [ ].


[stl file="foobar.stl" stlviewer_floor="foobar.jpg"]

This overrides the global setting for the floor texture file.

[stl file="foobar.stl" stlviewer_fog_color="0xffffff"]

This overrides the global setting for the fog color and sets it to 0xffffff (white).

You can combine as much different variables as you want in the shortcode, the order doesn’t matter.

I don’t know if my browser supports WebGL.

You can insert the shortcode [webgl_test] at any point in WordPress (Article, Page, Widget) and it will display a pass- or fail-message which you can specify in the settings page.

I want to disable the fog!

Currently only possbile by setting the stlviewer_fog_near very high. Below that distance between camera and object (or the rest of the space) no fog is created.

I want to disable a light / add more lights!

  • Disable it by settings the intensity to 0.
  • More lights are currently not supported, sorry. I don’t think this feature will be there soon, maybe if enough people ask for it.

I want to show 2 or more files in one window!

Currently not supported, sorry. I don’t think this feature will be there soon, maybe if enough people ask for it.