エレメンターの見出しウィジェットを使って上の画像のようなデザインを作る方法をご紹介します。
どうやって作るのか?
見出しウィジェットを一文字づつ使ってデザインします。
とても簡単にできるので、デザインの幅を広げたい人は活用してみてくださいね。
では、さっそく作ってみましょう
できるまでの流れ
まずはじめに、新しいワンカラムのセクションを作ります。
↓
その中に「見出し」ウィジェットを入れ、始めの一文字を入力します。
文字の色と背景の色を決め、パディングで大きさを微調整します。
↓
次に、高度な設定の「配置」を選択し、その中のインライン(auto)を選びます。
↓
そして、一文字の見出しウィジェットを複製すると、横に配置されます。
↓
複製した見出しウィジェットの文字、文字色、背景色を変更するとこのようなデザインになります。
↓
あとは同じようにして作り続けるとデザインの完成です。
↓
最後にカラムを選択し、レイアウト→水平方向に整列を選択し、中央を選ぶと真ん中に配置されます。
終わりに
どうでしたか?とても簡単にデザインできたと思います。
少し工夫をするだけで、このようなデザインを作ることができるのが、エレメンターの魅力です。
デザインの幅を少しでも広げたい方の参考になったら幸いです。