【やりたいこと】作成したページに画像を挿入したい！

みなさん、画像挿入に困ったことありますか。

ワードプレス、無料ブログサービスでは、簡単に画像を挿入することができます。

しかし、Osclassではそう簡単にはいきません。

ということで、本記事では、Osclassでの画像挿入について記載します。

【10分でできる】サーバーに直接アップロード

※ダウンロード時間は10分の中に含まれていません。

1.使用したもの

・ロリポップレンタルサーバー　スタンダードプラン

ロリポップ！レンタルサーバー

ホームページ運営なら、ずっと使えるレンタルサーバー「ロリポップ！」簡単、多機能、充実サポート、高速性能で、初心者から商用サイトまで安心してご利用いただけます。WordPress、EC-CUBEもたったの60秒で設置可能。まずは無料お試し10日間。

lolipop.jp

・Osclass

https://osclass.org/

osclass.org

・テーマ　OsclassWizards

https://market.osclass.org/themes/general/osclasswizards-free-responsive-theme_238

market.osclass.org

2.手順

①画像挿入の問題確認

Osclassのページ作成画面に移動します。

画像アイコンをクリックします。

Sourse(URL)が必要だと分かります。

②サーバーに画像をアップロード

ロリポップのユーザー専用ページを開き、ロリポップ！FTPをクリックします。

Osclassがアップロードされているフォルダに移動します。

oc-adminを開きます。

imagesを開きます。

アップロードアイコンをクリックします。

挿入する画像を選択します。

アップロードするをクリックします。

アップロードした画像をクリックします。

アップロードした画像のURLをコピーします。

③画像挿入

①で確認したSourseの項目に先ほどコピーしたURLをペーストします。

そのままだと、フルサイズで挿入されてしまうので、縦幅を300に調整しましょう。

画像を挿入することができました。

変更を保存をクリックします。

④確認

実際のページで確認した結果、

無事に画像が表示されました。

3.追記

マイナーのCMSをいじると、自然と知識がついていいね。

【最後に】Showroomとマッハ新書の紹介

ShowroomでUnity配信をしています。リアルタイムの勉強の様子を見てみたい方におすすめです!(^^)!

SHOWROOM

SHOWROOM provides live performance broadcasts by idols and celebrities in virtual stadiums.

www.showroom-live.com

以下は、私のUnity学習体験記となっております。

「他人の勉強方法が知りたい」という方におすすめのマッハ新書です!(^^)!

※無料版あり Unity学習100日記念本（0～30日編） - hide21のお店 - BOOTH

Unityの学習をはじめて、 100日が経過しましたので、 これまでのUnity学習の経験をまとめてみました！ これからUnityをはじめる人、Unityの勉強が続かなかった人に向けて、書きました。 無料版もありますので、気軽にどうぞ!(^^)!

hk-ryukyu.booth.pm

※無料版あり Unity学習100日記念本（30～60日編） - hide21のお店 - BOOTH

Unityの学習をはじめて、 100日が経過しましたので、 これまでのUnity学習の経験をまとめてみました！ 今回は、Unity学習30～60日編です！ Unityのスクリプトを読んでみたい人に向けて、書きました。 無料版もありますので、気軽にどうぞ!(^^)!

hk-ryukyu.booth.pm

※無料版あり Unity学習100日記念本（60~100編） - hide21のお店 - BOOTH

Unityの学習をはじめて、 100日が経過しましたので、 これまでのUnity学習の経験をまとめてみました！ 今回は、Unity学習60~100日編です！ 主に、Unityでのアウトプット法について書きました 無料版もありますので、気軽にどうぞ!(^^)!

hk-ryukyu.booth.pm

※無料版あり Unity学習100日記念本（Progate編） - hide21のお店 - BOOTH

Unityの学習をはじめて、 100日が経過しましたので、 これまでのUnity学習の経験をまとめてみました！ 今回は、Unity学習Progate編です！ これから、Progateをはじめる人に向けて、書きました。 無料版もありますので、気軽にどうぞ!(^^)!

hk-ryukyu.booth.pm