PCとスマホで表示内容を変えたい

Weeblyでスマホで表示する内容とPCで表示する内容を変えたい。

アクセスしている端末の幅で表示を変えたい時は「HIDE」という無料アプリを追加して使用すれば可能です。

アプリの追加はページを編集している「ビルド」画面の左に並んだのツールの一番下にインストール済みのアプリが表示されている。
​（インストールしているアプリがなければ何も表示していない）

「＋」ボタンをクリックすることでアプリ管理ページに画面が切り替わります。

下記がアプリ管理ページです。
様々なアプリを探して追加できます。無料のものと有料があります。
有料は購入型とサブスクリプションがあります。
今回は、検索窓に「HIDE」と入れてアプリを追加します。

「HIDE」で検索すると関連した機能のアプリが一覧表示されますが、下記のアプリを追加します。
Freeと表示されているので、無料アプリです。

アプリツールに「HIDE」が追加されました。

PCとスマホで表示を分けたい内容を入れるブロックを作ります。

「HIDE」のボタンをドラッグしてページの挿入したい位置に配置します。

すでに配置している文章や画像もドラッグして「HIDE」のブロックの中に入れられます。

「HIDE」のブロックの中を表示させるデバイスの幅を4種類のサイズで表示・非表示を選択できます。

1. 「目」のマークをクリック
2. 4種類のサイズそれぞれのサイズで Show or Hide が選択できます。
   

※4種類のサイズはテーマごとに設定されているフレキシブルデザインのサイズによりますが、おおよそスマホ用はExtra Smallでの表示と考えていれば良いでしょう。

PC表示用の内容を入れた「HIDE」ブロックを一つ完成させて、「HIDE」ブロック全体を複製してスマホ用の表示ブロックを設定します。

ブロックの複製は、他のツールと同じでブロックの左上角にマウスを移動しして「＋」マークが表示されたらクリックすると複製をどこに追加するか選べます。
​下に追加する場合は「このページ」を選べば、現在のブロックのすぐ下に追加されます。

PCだけ表示、スマホだけ表示

PCだけ表示させたい時は、4種類のサイズでExtra SmallだけHideに設定すれば、スマホでは表示されません。SmallでHideにしていないと画面の大きなスマホでは表示してしまうかもしれません。それぞれのテーマでサイズ設定が違うので、作ってみて試して確認しながら作る必要があります。

PCでは表で表示したいが、スマホでは表は見づらい場合など

PCとスマホで見え方を変えたい時に「HIDE」は便利なツールですが、編集ページではPC用のブロックとスマホ用のブロックと2つ、タブレット用を作れば3つ表示されている状態で作成していくことになります。
ブラウザーをもう一つ開いて公開サイトを見ながら確認して制作するのが良いでしょう。