概要
お知らせ管理の詳細1・詳細2にはHTMLタグを使用して、
複数枚の画像を表示させることや文字サイズの調整を実施することが可能です。
ただし記述したHTMLに誤りがある場合やアプリのHTMLに干渉してしまった場合に、アプリの表示が正常にされない場合がございますので、
こちらの記事では決まったフォーマットでの記載方法をご紹介いたします。
注意事項がございますので以下をご確認いただいた上で設定をお願いいたします。
注意事項
・ご利用の際は、お知らせ登録後にアプリ上での表示確認をお願いいたします。正常に表示がなされない場合は一度HTMLを削除いただき表示確認をいただくようお願いします。
・大量の画像を1つのお知らせで表示するように設定し、プッシュ配信などで一斉にそのお知らせが閲覧された場合、外部サーバーのトラフィックが一気に上昇する可能性がございます。
画像の挿入方法
以下の記述を挿入していただき、画像のURLのみを変更していただきますようにお願いいたします。
<img src="画像のURL" style="width: 100%; height: auto; margin-bottom: 10px;">
画像をタップした際にサイトやSNSの投稿に遷移をさせる場合は、以下のように記述をお願いいたします。
起動するページのURLと画像のURL以外は変更しないようにお願いいたします。
<a href="起動するページのURL">
<img src="画像のURL" style="width: 100%; height: auto; margin-bottom: 10px;"></a>
■CROSS POINT管理画面での設定イメージ
■アプリでの表示
※CROSS POINTのロゴ部分をタップすると、設定したURLに遷移いたします。
テキストカラー、サイズの変更方法
それぞれ以下のように記述を実施していただく事により、入力していただいたテキスト情報のカラー、サイズを変更できます。
いずれも赤字の部分のみ変更をお願いいたします。
<span style="font-weight: bold; color: green; font-size: 20px;">太字、カラー、テキストサイズの全てを変更</span>
<span style="color: green; font-size: 20px;">カラー、テキストサイズを変更</span>
<span style="font-weight: bold; font-size: 20px;">太字、テキストサイズを変更</span>
<span style="font-weight: bold; color: green;">太字、カラーを変更</span>になります。
<span style="font-weight: bold;">太字に変更</span>
<span style="color: green;">カラーのみを変更</span>
<span style="font-size: 20px;">テキストサイズのみを変更</span>
■CROSS POINT管理画面での設定イメージ
■アプリでの表示
補足
font-weight → 文字の太さを設定しています。「bold」とすることで太字での表示となります。
color → 文字の色を設定しています。「red」「blue」「green」などのように英語で色の名称を記載します。
font-size → 文字の大きさを設定しています。デフォルトは12pxのため、それ以外のサイズにされたい場合に数値を指定します。
以下のように記述していただくと、特定の箇所のみカラー、サイズ変更が可能です。
今週一週間<span style="color: red;">ポイント2倍キャンペーン</span>を実施いたします。