Threejs inside cms

Hello, i want to make a threejs blog site, and i am looking for a good cms. I was working with wordpress, but as i searched, it seems that there is no good intergration. Do you have any other ideas?

What do you mean by ā€œintegrationā€, embedding?

To embed three.js into Wordpress, you must first host your gameā€™s html, css, and javascript onto a hosting site. For example, say you host it with Heroku - Free Hosting.

Then you have to set your permissions to disable URL rewrite, as that will disable WebGL.

I hope Iā€™ve been helpful!

  • TheCodeCrafer

.

I want to make a cms site but to use the three js graphics for the aesthetic part and functionality, I started searching it. And I found that there are problems with WordPress, as I understood, I have to make separate html, and call it from WordPress.What I want is to have a three js page and have post or images or whatever inside three js. so if I upload a new post, to be inside three js. To apparently php based. I asked if there is any other cms, that is better.

That would be impossible with a cms, as those are built using their own foundations of html. Nothing really fits your specifications except for a custom built website.

As I said, you can utilize Wordpress to post that, if you host it on heroku, then you can code in your blogā€¦

Please be more specific, I do not understand what you are trying to say.

Ok, I re-read your paragraph, and I understand now. You should use heroku and you will have to hardcode your posts. If you want to create your own CMS, have at it. Use Heroku and you can reference that anywhere.

For example, I have some cubes floating on space, and when you press them the post appears with an animation and maybe inderaction. But I want to have also an interface, so someone can upload posts, video or etc, easy and not having writing custom code every time.

There is definitely no such thing, however, that sounds like an amazing idea for a CMS, so you could create a repository on Github, and Iā€™m sure I would, and many otherā€™s would like to aid you in producing this for you.

I dont even know how to start, i mean is better a php based or file based cms. I was thinking that if a find a somehow ā€˜ā€˜primitiveā€™ā€™ cms, it gonna be easier to do it.

Iā€™m going to have to disagree with previous replies here, since you definitely can use three.js within Wordpress, without resorting to iframes or hosting on Heroku.

Add these two script tags

<script src="http://cdnjs.cloudflare.com/ajax/libs/three.js/84/three.min.js"></script>
<script>

	var camera, scene, renderer;
	var geometry, material, mesh;

	function init() {

		camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 10 );
		camera.position.z = 3;

		scene = new THREE.Scene();
		scene.background = new THREE.Color( 0xffffff );

		geometry = new THREE.SphereGeometry( 1 );
		material = new THREE.MeshBasicMaterial( { color: 0x000000, wireframe: true } );

		mesh = new THREE.Mesh( geometry, material );
		scene.add( mesh );

		renderer = new THREE.WebGLRenderer( { antialias: true } );
		renderer.setSize( window.innerWidth, window.innerHeight );
		document.body.appendChild( renderer.domElement );				
				
	}

	function animate( time ) {

		mesh.rotation.x = time * 0.0005;
		mesh.rotation.y = time * 0.001;

		renderer.render( scene, camera );
		requestAnimationFrame( animate );

       }

	init();
	requestAnimationFrame( animate );

</script>

anywhere between the body tags on any page (on any CMS) and you should get some three.js content displayed, as long as itā€™s not being overrridden or hidden by other elements.

How to do this in wordpress specifically is not a three.js issue, so youā€™ll have to look elsewhere for that.
But if you are having trouble, Iā€™d suggest first adding a simpler script, something like

<script>
  alert( 'It's working!' );
</script>

to you page, and then go from there.

1 Like

The problem i think is not displaying content, but rather with threejs with the wordpress, i mean, is it possible here the sphere be a post (maybe also dragging over or something), and when i make an other post, an other sphere comes, with the same attributes? and all this from a user friendly interface , and not writing code again and again.

Yes, I would say thatā€™s possible. However itā€™s going to be a pretty complex app, and trying to do it within Wordpress is only going to make things more complicated.

I would suggest that you start with smaller goals - for example, if itā€™s your first time using Wordpress, make some simple sites. Once you are familiar with it you can judge whether your idea is feasible or whether you will have to choose a different system.

Personally, having used Wordpress a bit in the past I think itā€™s pretty good at what it does (create blogs) and very overly complicated if you want to do anything else. So I would suggest you try using a simpler system (perhaps a static site generator like Jekyll if you donā€™t need a database).

I was thinking for a simpler cms, such indiexhibit, or something. I have used wp to make sites, and i was thinking of this project, and how is plausible. I dont care if it is wp or something else. I prefer something more 'ā€˜primitiveā€™ because it will be easier to merge them. As i searched i saw the file based cms, witch they dont need databases. I was asking for opinions, because i also saw the incompatibility posts for threejs with wp.

@looeee I understand that you can host three.js without heroku, but he was
going afterā€¦ You know what, never mind, I still donā€™t understand the
question xD There are difficulties with WebGL and Wordpress, as shown by
attempting to host Unity WebGL on Wordpress, but thatā€™s a different
problem. The solution I proposed was the most preserved, and long lasting
solution that would allow extremely complex multi-file WebGL scenes to work.

But I understand that you disagree, and I probably have no idea what Iā€™m
talking about, since Iā€™ve never tried using three.js with Wordpress
beforeā€¦

  • TheCodeCrafter
1 Like

I would think you should just build one yourself with some help from the
community. I can help you tie in some stuff.

you mean make a cms completely from start of merge threejs and a cms.?

Yeah, that would be a good course of action, if your really want this to
happen. Thereā€™s nothing else like it.

I will start it, am making now a basic cms, and then put the three js library. Of course I donā€™t know how it will end up, but I think it will always want a customization code.I will post the repository here, for help and ideas.

hello, i made a simple cms, for now it has some problems with the db connection and the mysqli connection in Article.php. Here is the repo:

Ok! I will contribute to that repo here and there, when I have the time!