#爆速!!!画像投稿機能のプレースホルダー設定方法
rails でのwebアプリケーション開発で、画像投稿機能を実装した際に、画像がある場合とない場合の設定方法を今回は使えるととっても便利な「Helper」というものを使って実装していきます。
###前提
テーブル作成→新規投稿機能が実装済み
また、画像投稿機能を実装済み(carrie waveを中の人は使用しています)
【今回の記事について】
テーブル名:posts
画像を保存するカラム名:image
##STEP1
まずは適当に画像を投稿していない場合に表示させたい画像をダウンロードし、
「app/assets/images」 の中に入れましょう。
*この作業を忘れてエラーになることが多々見受けられるので要注意。
今回は画像名を「placeholder.png」として保存しています。
初心者などの方は、画像を左クリック→「Rename」→「placeholder.png」などと変更しましょう。
##STEP2
次にヘルパーを開いて記述していきます。
場所は「app/helpers」の中にあります。
今回は「posts_helper.rb」を編集していきます。
*viewファイルで使用するコントローラーに準じたものを利用してください。
def set_image(post)
if post.image.present?
post.image_url
else
"placeholder.png"
end
end
postを引数として、
もし、imageカラムに値があれば、その画像を。
なければ、STEP1で保存した画像
を返します。
##STEP3
実際に使ってみましょう。
一覧表示バージョンと詳細表示バージョンの例を今回は記載しようと思います。
def index
@posts= Post.all
end
def show
@post = Post.find(params[:id])
end
<% @posts.each do |t| %>
:
: 省略
:
<%= image_tag set_image(t) %>
:
: 省略
:
<% end %>
:
: 省略
:
<%= image_tag set_image(@post) %>
:
: 省略
:
このように imageカラムを持つレコードを引数にセットするのがポイントです。
##番外編
ユーザーのプロフィール画像機能をつけた人も同様にできるのでやってみてください。