Wix Studioで探索者まとめサイトを作る方法⑦｜動的ページ作成前編

前までは
トップページの作り方だったけど、
次は動的ページの作り方になる

CMSで作ったデータに沿って、
画像や文字を
紐づけてくれるページだ。

そうそう。
しかも背景画像とかも編集できるから
フォーマットが同じなら、
かなり応用が利く！

あと、俺もコーダーではないから
手順遠回りしているだろうけど
多めに見てくれると幸い。

前回も言ったことになるけど、
プレビューを押したままの場合は
「サイトを編集」を押して、
編集ページに戻って欲しい

そうなんだよな

アニメーション
弄ったりとかしたし
気が向いたら装飾も見てくれ

さて、動的ページを
作っていこう

左上にある
ページボタンをクリックして

そのメニューの下にある
新規ページを追加、をクリック

ひっかけではないから
動的ページで！

「次へ」ボタンは欲しいから、
真ん中のページを選んで

そう、このままでも
相性が良い画像にしていたら
これだけで完成！って出来る

相性が……悪いよな…？

…ってことで
ほとんど消す

「次へ」ボタンが
欲しかった

まず、
レイヤーボタンを
クリックする

セクションって書いてあるのを
そのまま消すから
「…」の部分をクリックして

よし、削除だ

いや、まだ残ってるぞ

クリックして閉じるだろ？

ほら、ある

ということで、
削除しよう

そうそう、
消して欲しい

まず、このサイトの構造だけど、
箱の中に画像とかテキストを入れる
箱スタイルになっている

今、一番上にも見えない…
いや、白色なだけだな。

白色のセクションという箱が
あるんだけど

３×３という９つの箱に
テキストとかを入れる
箱になっている

便利と言えば便利だけど
自由に動かしたいから、
１分割にしよう

ということで、
さっき文字消した部分を
クリックして

良かった、
それをクリックして欲しい

よし、なら1×1を
選択して欲しい

新しいものをつくるときは
まずコンテナに入れると
管理が楽、らしい

から、コンテナを作ろう

まず、新しいパーツを
挿入するから
左上の「＋」をクリックして

OK、そうしたら
コンテナをクリック

そうしたら、
ストレッチボタンを
クリックして

これで大枠は完成

あとは、
コンテナの色を
白にしたい

右上のボタンを
クリックして

それでOK、助かる

それから、
灰色の四角をクリックして

そうだな、白が良い

これで、
大きなコンテナは
作成完了だ。

ちょいちょい崩れて訂正…をしたせいで
正しい値は言えねー状態なんだけど

コンテナの端にマウスを合わせると
高さが調整出来るんで、
お好みで都度調整して

また崩れたら、
都度変える気はするしな