目次
次にコンバージョン用のボタンを作ってみましょう。もちろん画像データ等をコンバージョンボタンにするのもOKですが、携帯で見る事を考えるとこのボタン作成で作った方がデータが軽くなり表示速度も上がるのでオススメです。
動画解説
現在準備中
1.ボタンコンテンツを設置して文字を変更する
※クリックすると画像が大きくなります。
下部のメニューバーから【ボタン】メニューをドラック＆ドロップしてモジュールの中に入れます。
※クリックすると画像が大きくなります。
カーソルをボタン内の文字の一番左に合わせてクリック。「delete」ボタンを数回押して中の文字を全て消去します。その後、直接文字を打ち込む事が出来ます。また、メニューバーのURL部分には遷移先のURLを入力する事が出来ます。
編集が完了したら、必ず黄緑色の【決定ボタン】を押して下さい。
編集が完了したら、必ず黄緑色の【決定ボタン】を押して下さい。
2.ボタンコンテンツの背景色とセンター寄せ・文字とボタンの余白を調整する
※クリックすると画像が大きくなります。
ボタンコンテンツのモジュールにカーソルを合わせて、【設定ボタン】をクリックします。
● ボタンの背景色を変更する
※クリックすると画像が大きくなります。
下部メニューのスタイリングをクリックして、背景色の欄をクリックしてカラーを変更します。その右側にはカーソルが乗った時のカラーやボタンにボーダーを付けるなどの設定もありますので好きなようにカスタマイズしてみましょう。
● ボタンの位置をセンターに合わせる
※クリックすると画像が大きくなります。
下部メニューの最左部の整列の選択肢をクリックして、中央に変更します。するとボタンがセンターに移動されましたね。
● ボタンと文字の余白を空ける(Padding)
※クリックすると画像が大きくなります。
下部メニュー最下部のスライドバーを一番右にスライドさせると【垂直の余白(PADDING)】【水平の余白(PADDING)】の二種類の余白変更の項目が出てきます。
これを両方共右に少しスライドさせてボタンの外枠と文字の間隔を少し空けます。これではまだ文字が小さすぎるので次の章で大きくして行きます。
これを両方共右に少しスライドさせてボタンの外枠と文字の間隔を少し空けます。これではまだ文字が小さすぎるので次の章で大きくして行きます。
3.ボタンコンテンツの文字の大きさを変更する
● ボタンと文字の余白を空ける(Padding)
※クリックすると画像が大きくなります。
今までは一般の欄の編集を行ってきましたが、今回は文字部分の変更なので矢印部分の【文字のデザイン構成】をクリックします。すると、右の矢印の部分にフォントサイズという項目が出現しますので左にスライドさせて文字を大きくします。
すると、だいぶ申し込みボタンっぽくなってきましたね。この【文字のデザイン構成】ではフォントの太さなどフォントに関する設定が行えます。
すると、だいぶ申し込みボタンっぽくなってきましたね。この【文字のデザイン構成】ではフォントの太さなどフォントに関する設定が行えます。