スマートフォンの画面上で、メニューをもっとコンパクトに設置したいといったご要望に対応する「メニュー機能」を追加いたしました。
メニュー機能を使用することで、任意の場所に設置したメニューボタンをタップすると、メニューを画面に表示するという見せ方を行うことが出来ます。
■設定方法
１．左側の挿入メニューの「テキスト・画像」の中から、「メニュー」を選択し、スマホレイアウト画面上で設置したい場所にドラッグ＆ドロップします。
○設置したい場所にドラッグ＆ドロップ
○設置した状態
編集メニューの「メニューボタン＞ラベル」でメニューボタン内の文字列を変更できます。設置位置は、「余白」か「CSS入力」で調整してください
２．メニューボタンを設置しましたら、「閉じる」ボタンの上にメニューコンテンツを作成します。
例えば、ボックスのボタンを複数並べたい場合、挿入メニューよりセルをドラッグ＆ドロップをし、編集メニューで見た目を調整します。
○セルを設置します
編集メニューの「背景＞角を丸く」にチェックを入れると簡単にボタン風のデザインを作成する事ができます
３．PCビュー画面から、メニューのリンクをスマホレイアウト画面に設置したセル内にドラッグ＆ドロップしてください。
○メニューのリンクをドラック＆ドロップします
ドラッグした要素が画像だった場合、編集メニューの「画像＞alt属性をテキストとして表示」をチェックするとテキストで表示できます。（※PCページの画像にaltが設定されている場合のみに限る）
４．メニューの見た目を調整します
○編集メニューの「アイコン」を利用すると簡単にボタン風のデザインを作成することができます
５．デザインが完成したら、プレビュー画面で確認します。スマートフォンでQRコードを読み取って、実機で確認することをおすすめします。
○iPhone5で確認したプレビュー画面
shutto公式サイトQR
■shutto公式サイト http://shutto.com/
■プレビュー画面 http://shutto.com/view/rXEHHTN
shutto公式スマホページ及びプレビュー画面にて、上記でご紹介したメニューをご覧いただけます。
以上、簡単なメニューボタンの設置方法をご紹介しましたが、メニューの内容は、メニュー以外のコンテンツと同様に自由に作成ができますので、色々とお試しを頂けると幸いです。
これからもshuttoを宜しくお願いいたします。
