スリ飯屋Malankaのフリーエンジニアな日々

IT実務未経験から約1年、東京でフリーランスのRuby on Railsエンジニアに転職。約2年半、大阪中崎町でスリランカカレーの間借りしてました。フリーランスエンジニアになるためのノウハウ、スリランカの事を発信していきます。

【ActiveAdmin】フォームのタイトル(パネル)部分を色付けする

【ActiveAdmin】フォームのタイトル(パネル)部分を色付けする




今すぐ登録したい方へ


このブログから登録の多いエージェントは下記の3つです★

(リンクをクリックすると公式サイトに飛びます)

【ダントツの1位】フォスターフリーランス【案件保有数5000件以上。業界20年の超老舗】

【僅差で2位】エミリーエンジニア【4人に1人が初めてのフリーランス】

【惜しくも3位】Midworks(ミッドワークス) 【リモート案件が超豊富。正社員並みの保障アリ】




こんにちは、mah(@RailsRubyMah6h)です。


このブログでは、

僕がIT未経験から約1年でフリーランスエンジニアになるまでの過程、

ノウハウなどを書いていきます。


今回は、


  • 【ActiveAdmin】フォームのタイトル(パネル)部分を色付けする


について書いていきます。




【ActiveAdmin】フォームのタイトル(パネル)部分を色付けする



下記のように、

フォームに項目名だけ載っていても味気ないので、

色付きのタイトルというかパネルっぽいものを付けたい。


f:id:mah666hhh:20201107111002p:plain




結論


panel do〜endブロックを使います。


panel do〜endブロックの中に、

f.inputを入れてあげればOKです。


form do |f|
  panel '次月プラン' do
    f.input :name
    f.input :id
  end
end


するとこんな感じになります。

f:id:mah666hhh:20201107111535p:plain


nameのラベルは、

I18nで翻訳が当たっているので、

「プラン名称」になっています。

(I18nのキーが見つからないと、attributeがそのままラベルとして表示されます。nameの場合はNameのような感じ)


もし、

ラベルをカスタマイズしたいときは、

labelオプションを使います。


f.input :name, label: 'ラベルのカスタマイズ'




また、

panel do〜endブロックはネストできます。


例えば、

下記のようにしてみます。


form do |f|
  panel '【次月分】' do
    panel '次月プラン' do
      f.input :name
      f.input :id
    end
  end
end


するとこうなります。


f:id:mah666hhh:20201107111223p:plain




フォームにまとまりが出来ていい感じになりました。




以上です。


activeadmin.info




最後に


下記の表に、

フリーランスエンジニア向けの人気エージェントをまとめてみました。


エージェント選びで悩んでいる方は是非参考にしてみてくださいね★





あわせて読みたい


www.malanka.tech


www.malanka.tech


www.malanka.tech


www.malanka.tech




最後までお読み頂きありがとうございました★

もしよかったらTwiiterのフォローもお願いします★