質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.51%
Django

DjangoはPythonで書かれた、オープンソースウェブアプリケーションのフレームワークです。複雑なデータベースを扱うウェブサイトを開発する際に必要な労力を減らす為にデザインされました。

Python 3.x

Python 3はPythonプログラミング言語の最新バージョンであり、2008年12月3日にリリースされました。

Q&A

解決済

1回答

2810閲覧

Python Djangoの django ckeditorの画像ファイルの扱いについて

yuki1010

総合スコア43

Django

DjangoはPythonで書かれた、オープンソースウェブアプリケーションのフレームワークです。複雑なデータベースを扱うウェブサイトを開発する際に必要な労力を減らす為にデザインされました。

Python 3.x

Python 3はPythonプログラミング言語の最新バージョンであり、2008年12月3日にリリースされました。

0グッド

0クリップ

投稿2016/09/27 18:43

編集2016/09/27 18:46

Djangoのプラグインdjango-ckeditorを使っているのですが画像ファイルの扱いについて幾つか悩んでいるので解決出来る方がいれば教えてください!!

・デフォルトではアップロードされたファイルは'uploads/日付'になってしまうのですが、'uploads/ユーザー名/日付'にしたいです。

・デフォルトでは画像のサイズを元のままにアップロードされるのですが、アップロードサイズの上限を設定したいです。
(例)例えば2000px 1000pxをアップロードしたら、幅を1000pxに下げてアップロードしたいです。(比率は変えずに)
このサイトのUploading Dropped and Pasted Imagesのエディターのようにしたいです。
英語が苦手で行き詰まっております。。。

・更に出来ればエディターをレスポンシブ対応もさせたいです。

自分がやった手順としては
pip install django-ckeditor でインストールをして

【settings.py】

python

1# アプリを追加 2INSTALLED_APPS = [ 3 'ckeditor', 4] 5# メディアファイルの設定 6BASE_DIR = os.path.dirname(os.path.abspath(__file__)) 7MEDIA_URL = '/media/' 8MEDIA_ROOT = os.path.join(os.path.dirname(BASE_DIR, "media") 9CKEDITOR_UPLOAD_PATH = "uploads/" 10# エディターのレイアウトの設定 11CKEDITOR_CONFIGS = { 12 'default': { 13 'toolbar': 'full', 14 'height': 300, 15 'width': 300, 16 }, 17}

をしました。
どなたか解決策を教えて下さい。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

・デフォルトではアップロードされたファイルは'uploads/日付'になってしまうのですが、'uploads/ユーザー名/日付'にしたいです。
→settings.pyに以下を記述するといかがでしょう。
CKEDITOR_RESTRICT_BY_USER = True

・デフォルトでは画像のサイズを元のままにアップロードされるのですが、アップロードサイズの上限を設定したいです。
→少し調べてみましたが、パッと見たところアップロードサイズの上限を設定するような仕組みは、django-ckeditor側では提供されていないように感じました。
張っていただいたサイトにて2000pxほどの画像を試しにアップしたところ、実際には1600pxに縮小はされているのですが、それが枠内に正しく表示されるのはcssにて

css

1img { 2 max-width: 100%; 3 height: auto; 4}

という指定によるものです。
頑張ればリサイズをすることもできますが、それはdjango-ckeditorの機能そのものに手を加えることになりますので、少々不安が残ります。

画像がアップロードされた際、単純にエディタ内の幅に収まるようにしたい、ということでしたら
以下のようにsettings.pyを修正することで可能です。
'contentsCss'は、エディタ内でのcss指定になります。

python

1CKEDITOR_CONFIGS = { 2 'default': { 3 'toolbar': 'full', 4 'height': 300, 5 'width': 960, 6 7 # たしました 8 'contentsCss': 'img { max-width: 100%; height: auto !important;}', 9 }, 10}

・更に出来ればエディターをレスポンシブ対応もさせたいです。
→settings.pyにて、以下のように修正してみてください。
変わったのは「width」と「height」です。

python

1CKEDITOR_CONFIGS = { 2 'default': { 3 'toolbar': 'full', 4 'height': "500px", 5 'width': "100%", 6 7 # たしました 8 'contentsCss': 'img { max-width: 100%; height: auto !important;}', 9 }, 10}

投稿2016/09/29 10:16

toritoritorina

総合スコア972

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

yuki1010

2016/09/29 10:19

toritoritorina様いつもご返答してくださって本当にありがとうございます。大変助かります。!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.51%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問