素敵なサムシングを独断と偏見で一方的に紹介するブログ(´・ω・`)

IT

投稿日: 2018年4月1日
最終更新日:

【仕組みを理解】Djangoのtemplateファイルから静的コンテンツを読み込んでみよう

ペヤング ソースやきそば 120g×18個

created by Rinker
ペヤング
¥2,600 (2024/03/15 19:03:46時点 Amazon調べ-詳細)

とりあえず保存食として買っておけば間違いなし!

レッドブル エナジードリンク 250ml×24本

created by Rinker
Red Bull(レッドブル)
¥4,080 (2024/03/15 19:03:47時点 Amazon調べ-詳細)

翼を授けよう!

モンスターエナジー 355ml×24本 [エナジードリンク]

created by Rinker
モンスター
¥4,748 (2024/03/15 19:03:48時点 Amazon調べ-詳細)

脳を活性化させるにはこれ!

ドラゴンクエスト メタリックモンスターズギャラリー メタルキング

created by Rinker
スクウェア・エニックス(SQUARE ENIX)
¥3,250 (2024/03/15 19:03:48時点 Amazon調べ-詳細)

みんな大好き経験値の塊をデスクに常備しておこう!

Bauhutte ( バウヒュッテ ) 昇降式 L字デスク ブラック BHD-670H-BK

created by Rinker
Bauhutte(バウヒュッテ)
¥13,861 (2024/03/15 15:06:46時点 Amazon調べ-詳細)

メインデスクの横に置くのにぴったりなおしゃれな可動式ラック!

BANDAI SPIRITS ULTIMAGEAR 遊戯王 千年パズル 1/1スケール

created by Rinker
BANDAI SPIRITS(バンダイ スピリッツ)
¥7,180 (2024/03/15 15:06:46時点 Amazon調べ-詳細)

もう一人の僕を呼び覚ませ!!

MOFT X 【新型 ミニマム版】 iPhone対応 スマホスタンド

created by Rinker
MOFT
¥2,880 (2024/03/15 19:06:03時点 Amazon調べ-詳細)

Amazon一番人気のスマホスタンド!カード類も収納出来てかさ張らないのでオススメです!

スポンサーリンク

336×280




Djangoでは静的コンテンツの管理も楽

静的コンテンツとはCSSJavaScriptImageファイル等のファイル群の事を指します。

また、Djangoではそれらをstaticファイルと呼びます。

Djangoでは、staticファイルをtemplateファイルから簡単に読み込むための仕組みがありますが、仕組みを理解していないと少しつまづいてしまうかもしれません。

今回は、staticファイルを読み込んで画面で確認するまでの手順を整理してみましたので、ご紹介致します。

手順

staticディレクトリの作成

まずは、対象のアプリディレクトリ配下以下のコマンド各staticフォルダを作成してください。


Djangoはアプリディレクトリ配下のstaticフォルダに対して静的コンテンツを探しに行きます。

似たような動きとして、templateのHTMLファイルについてもアプリディレクトリ配下のtemplateフォルダに探しに行きますね。

確認

では、今回は以下のディレクトリ構成にしてCSS/JavaScript/Image表示確認をしてみましょう。



すると、以下のように表示されると思います。

staticファイルをtemplateファイルから読み込む際に、押さえるべきポイントは以下です。

ポイント 説明
{% load static %} templateファイル内でこの記述をすること。
そうすることでアプリ内のstaticフォルダ認識するようになります。
{% static ‘{相対パス}’ %} srchrefで指定するパスの部分をstaticディレクトリを基準とした相対パスで指定すること。

終わりに

以上のように、Djangoでは簡単静的コンテンツの管理及び読み込みを実現することが可能になっています。

レイアウトを調整する上で、staticファイルは必要不可欠なファイルになるので、皆さんも是非お試しください。

336×280




336×280




CATEGORIES & TAGS

IT, , , , , , , , , ,

blogenist

Author: blogenist

関連記事

YouTubeも見てね♪

お名前.comサイドバー