callahancodes

<p>Three Importer allows users to insert custom ThreeJS scenes which can be implemented via Block editor, shortcode, or custom script injection. This allows people with little-to-no coding experience to well-seasoned developers to create beautiful, 3D scenes with full control over the settings.</p>
<p><strong>Block Support</strong><br />
Three Importer has full support with the official WordPress Block Editor. Simply type and select “/Three Importer” in your page editor and you’ll see the 3D render notice for the public view.</p>
<p><strong>Shortcode Support</strong><br />
Three Importer allows the exact same functionality from blocks within the <code>[ti3d_scene]</code> shortcode. Developers can also use the <code>[ti3d_sceneinject]</code> shortcode to call project-specific libraries from THREE and use them within custom scripts.</p>
<h3>Shortcode Parameters</h3>
<h4>Geometry Settings</h4>
<ul>
<li><code>geometry</code> : Type of 3D shape (default: box).</li>
<li><code>geometry_color</code> : Hex color code (default: #000000).</li>
<li><code>geometry_material</code> : Three.js material type (default: basic).</li>
<li><code>geometry_size</code> : Scaling factor (default: 1).</li>
<li><code>geometry_xrotation</code> / <code>yrotation</code> / <code>zrotation</code> : Initial rotation.</li>
<li><code>geometry_instancing</code> : Enable instanced rendering (default: false).</li>
<li><code>geometry_instancingnum</code> : Total instances (default: 50).</li>
<li><code>geometry_instancingspacing</code> : Gap between instances (default: 1).</li>
<li><code>gltf_url</code> : URL for external GLTF/GLB models.</li>
</ul>
<h4>Lighting Settings</h4>
<ul>
<li><code>light</code> : Light source type (default: ambient).</li>
<li><code>light_color</code> : Color of the light (default: #ffffff).</li>
<li><code>light_intensity</code> : Brightness (default: 1).</li>
<li><code>light_xpos</code> / <code>ypos</code> / <code>zpos</code> : Light coordinates (default: 0).</li>
<li><code>light_helper</code> : Toggle visual position guide (default: false).</li>
</ul>
<h4>Camera Settings</h4>
<ul>
<li><code>camera_xpos</code> / <code>ypos</code> / <code>zpos</code> : Camera coordinates.</li>
<li><code>camera_xtarget</code> / <code>ytarget</code> / <code>ztarget</code> : Camera look-at target.</li>
<li><code>camera_followmouse</code> : Enable mouse-tracking (default: false).</li>
</ul>
<h4>Particles & Scene</h4>
<ul>
<li><code>scene_background</code> : Background color or transparency (default: none).</li>
<li><code>particle_amount</code> : Total particles (default: 1000).</li>
<li><code>particle_size</code> : Size of particles (default: 1).</li>
<li><code>particle_speed</code> : Movement speed (default: 5).</li>
<li><code>particle_direction</code> : Flow direction (default: right).</li>
<li><code>particle_color</code> : Particle hex color (default: #000000).</li>
<li><code>particle_stretch</code> : Motion stretch factor (default: 5).</li>
</ul>
<h4>Grid & Text</h4>
<ul>
<li><code>cubegrid_stretch</code> : Grid stretch amount (default: 120).</li>
<li><code>cubegrid_spacing</code> : Distance between grid cubes (default: 1).</li>
<li><code>cubegrid_material</code> : Material for the grid (default: phong).</li>
<li><code>cubegrid_color</code> : Grid hex color (default: #ffffff).</li>
<li><code>trid_text</code> : String of text to render in 3D (default: TI).</li>
<li><code>trid_color</code> : Color of 3D text (default: #ffffff).</li>
<li><code>trid_size</code> : Depth/Size of 3D text (default: 1).</li>
</ul>
<h3>[ti3d_sceneinject] Available Modules</h3>
<ul>
<li><strong>Controls:</strong> orbitcontrols, flycontrols, firstpersoncontrols, pointerlockcontrols, trackballcontrols</li>
<li><strong>Loaders:</strong> gltfloader, objloader, fbxloader, textureloader, cubetextureloader, dracoloader, rgbeloader</li>
<li><strong>Post-Processing:</strong> effectcomposer, renderpass, unrealbloompass, shaderpass, ssaopass</li>
<li><strong>Shaders:</strong> fxaashader, copyshader, luminosityshader, sobeloperatorshader</li>
<li><strong>Geometry:</strong> boxlinegeometry, convexgeometry, parametricgeometry, teapotgeometry</li>
<li><strong>Helpers:</strong> gridhelper, axeshelper, camerahelper, directionallighthelper</li>
<li><strong>Misc:</strong> animationmixer, gui</li>
</ul>


Three Importer

A powerful ThreeJS WordPress plugin for creating 3D scenes via blocks, shortcodes, or custom script injection.

wprj

<p>3D scene viewer allows you to create a 3D scene from 3D model files. You can replace a product image with an interactive 3D scene on the product page, or just display a 3D model in a post or page. 3D scene viewer gives you total control on allowed camera movements and endless lighting conditions possibilities.</p>
<p><a href="https://lalabe.io/3d-wp/" rel="nofollow ugc">View plugin demo</a>.</p>
<h4>Supported file types</h4>
<ul>
<li><code>glTF</code> v2: <code>.gltf</code>/<code>.glb</code>.</li>
<li><code>FBX</code> ASCII version 7.0 and newer, or binary version 6400 and newer.</li>
<li><code>STL</code>.</li>
<li><code>OBJ</code> with support for material file (<code>.mtl</code>).</li>
</ul>
<h4>Scene customization</h4>
<p>You can add as many models as you want into a single scene and each model can be scaled and positioned individually into the scene to fit your goals.</p>
<p>Animated models are supported (<code>.glb</code>, <code>.gltf</code> and<code>.fbx</code>).</p>
<h4>Infinite light possibilities</h4>
<p>You can add as many light sources to simulate any desired lighting condition for your scene.</p>
<h4>Camera</h4>
<p>Camera position and movement are configurable. You can restrict the viewer from moving the camera beyond certain angles, restrict the zooming capability, place the camera wherever you want an point it at any point of the scene.</p>


3D Scene Viewer

Display a 3D model or an entire scene made of multiple 3D models onto your site.

Three Importer vs 3D Scene Viewer