【やりたいこと】WordPressで自作の3Dモデルを表示させたい!
3Dモデルの作成は、だれでもできる世の中になってきましたね。
BlenderやFusion360など、3Dモデル作成ソフトが無料で使用できるため、パソコンさえあれば、簡単に作成できるようになってきました。
では、自作3Dモデルを作れるようになった、次にやることはなんでしょうか。
決まってるでしょう!
みんなに見てもらいましょう!(^^)!
ということで、
今回は、3Dモデルを自分のWordPressのサイト(ブログ)に表示させる方法です(^^)/
※今回の記事では、3Dモデルの色を反映させることはできませんでした。
【10分でできる!】自作3Dモデルの表示
※ダウンロード時間は10分の中に含まれていません。
0.概要
「canvasio3D Light」というプラグインを使用し、fusion360で作成した3Dモデル(obj)を表示します。
1.使用したもの
・ロリポップレンタルサーバー スタンダードプラン

・WordPress 4.9.8
※WordPressはロリポップユーザー専用ページからインストールしました。
・テーマ Hueman

・canvasio3D Light

2.手順
①プラグインcanvasio3D Lightのインストール
プラグインの新規追加をクリックします。
canvasio3D Lightを検索し、インストールします。
インストール後、有効化にします。
②3Dモデルの追加
メディアの新規追加をクリックします。
3Dモデル(obj)を追加します。
③3Dモデルの表示
固定ページをクリックし、ビジュアルエディターを表示させます。
3Dアイコンをクリックします。すると、上記の画像のように、記述されます。
「objPath=”゙…”」の「…」の部分を選択した状態にし、メディアを追加をクリックします。
②でダウンロードした3Dモデルのデータを選択し、固定ページに挿入をクリックします。
上記の画像のように、表示されていれば成功です。
では、プレビューをクリックし、実際に3Dモデルが表示されているか確認してみましょう。
3Dモデルは、表示されているものの、3Dモデルの色と背景が同じ色になっていて、見づらくなっています。
3Dモデルの色を変更してみましょう。
④3Dモデルの色を変更
「objColor=”…”」の「…」の部分を上記の画像のように、変更します。
では、もう一度プレビューをクリックし、実際に3Dモデルの色が変更されているか確認しましょう。
3.追記
3Dモデルのマテリアルも反映されていれば、文句なしなのだが。
【最後に】Showroomとマッハ新書の紹介
ShowroomでUnity配信をしています。リアルタイムの勉強の様子を見てみたい方におすすめです!(^^)!

以下は、私のUnity学習体験記となっております。
「他人の勉強方法が知りたい」という方におすすめのマッハ新書です!(^^)!
コメント