brieart初期導入ガイド

Size: px

Start display at page:

Download "brieart初期導入ガイド"

さなえあかさか
5 years ago
Views:

2 目次. brieart とは? brieart とは? 注意事項制限事項など. brieart 導入の流れ 6. brieart の管理画面にログイン 7. 登録情報 8 登録情報の確認変更 8 5. ご契約情報 9 ご契約情報の確認変更 9 6. 設定一覧 0 ドメイン (FQDN) の設定 0 7. 変換設定変換設定画面の説明プレビュー確認変換設定保存変換タグの埋め込み Copyright (C) 0 ING System Co., Ltd. All Rights Reserved.

もうスマートフォンサイトをつくるために操作が複雑で高価な CMS などのツールを使う必要はありません brieart( ブリエアート )

3 . brieart とは? brieart とは既存の PC サイトを特別な知識や高額なツールなどがなくても誰でも手軽にスマートフォンサイトへ変換できる WEB サービスですもうスマートフォンサイトをつくるために操作が複雑で高価な CMS などのツールを使う必要はありません brieart( ブリエアート ) を使えば面倒なツールのインストール作業などは必要なくブラウザさえあれば PC サイトのパーツをマウスでドラッグ & ドロップお好みのレイアウトに並べていくだけで誰でも手軽にまるで絵を描くようにスマートフォンサイトができあがります Copyright (C) 0 ING System Co., Ltd. All Rights Reserved.

4 . brieart とは? 注意事項制限事項など brieart 管理画面では操作や設定おいて下記のような制限があります多重ログインの禁止ログインが行えるのはアカウントユーザーとなります同じユーザーが別々のブラウザーから同時に操作する事は出来ませんアカウントロックアカウントによるログインはユーザーのみとなりますその為ログアウトの手順を踏まずにブラウザーやタブを閉じたりした場合新たにログインを行ってもログイン出来ない場合がございます ( アカウントロックの解除はアカウントロック解除画面から行えます ) brieart 変換設定画面では変換設定や変換動作において下記のような制限があります Javascript 等のスクリプト動作変換設定時にはスクリプトは削除した状態で設定を行います Javascript 等のスクリプト制御による表示の変更切り替え等動的ページ構成スクリプトによって表示の変更 ( レイアウト含む ) 切り替え等を行っているサイトではレイアウトが崩れたり表示内容が意図した内容にならなくなる場合があります Flash や動画等の OBJECT タグ EMBED タグ VIDEO タグ IFRAM による外部コンテンツの表示変換設定画面でのドラッグ & ドロップ対応要素をご参照くださいブラウザのプラグイン機能ブラウザ固有の機能を利用した表示を行うコンテンツ FORM 入力 (GET/POST) によるページ移動変換設定時は疑似的に FORM 送信を行うため完全なデータとならない可能性があります変換設定時は FORM 入力による移動先ページでのプレビューはできません COOKIE 等を使用してセッションを保持するコンテンツ変換設定時にはドメインやパスを指定した COOKIE の場合 COOKIE が有効になりません Copyright (C) 0 ING System Co., Ltd. All Rights Reserved.

5 . brieart とは? 注意事項制限事項などご注意くださいご注意ください brieart 管理画面変換設定画面は HTML5 CSS がご利用出来るブラウザー専用となっておりますその為非対応ブラウザーでの操作やログインが行えない場合がございます対応ブラウザーは Chrome / Firefox / Safari ( 各最新バージョン ) となっております brieartで発行されるjavascriptタグを挿入したページであってもそのページに対する変換設定が行われていない場合は PCサイトがそのまま表示されます変換設定を行ったPCページに大幅な構成の変更がある場合には brieartでの変換設定を再確認再設定してください INPUTタグなどのFORM 入力要素の変換において個人情報機密情報などセキュリティリスクの伴う変換は動作の保障外とさせていただきます Javascript 等のスクリプト制御によって表示内容の変更切り替え等動的にページ構成が変わるPCページではレイアウトが崩れたり変換結果が変換設定時とは異なる場合がありますドラッグ & ドロップ対応要素 <form> <select> (single/multi) <input> ( 全タイプ ) <a> <textarea> <img> Copyright (C) 0 ING System Co., Ltd. All Rights Reserved. 全テキスト 5 5

6 . brieart 導入の流れ brieart の管理画面にログイン登録情報変更ご契約情報メールアドレスパスワードユーザー情報プランオプション変更ドメイン追加クレジットカード変更設定一覧ドメイン (FQDN) 設定変換設定変換設定画面でスマートフォンサイト作成プレビュー確認変換設定保存変換タグをウェブサイトに埋め込み Copyright (C) 0 ING System Co., Ltd. All Rights Reserved. 6 6

7 . brieart の管理画面にログインログイン画面から brieart 管理画面にログインします. 設定. 編集. 埋め込みログイン ID ご登録時に登録された ID をご利用ください ID は登録時にメールにて発送されますパスワードご登録時にメールにて発送されたものをご利用くださいログイン後に変更することも可能です 5 5 ログイン ID の保存ログインパスワードを忘れてしまったログイン ID を保存します次回ログイン時のログイン ID 入力が省けますログイン ID パスワードを入力後に選択してくださいご登録アドレスへ新しいパスワードを再発行いたします 6 6 アカウントがロックされてしまった brieart では原則としてアカウントにつきログインとなっております既にログインされている方が別途いる場合正規にログアウトせず管理画面より離脱された場合にご利用ください Copyright (C) 0 ING System Co., Ltd. All Rights Reserved. 7

8 . 登録情報登録情報の確認変更を行います. 設定. 編集. 埋め込みメールアドレス変更ご登録されているメールアドレスを変更される際にご利用くださいメールアドレスの書式が間違っている場合はエラーとなりますその際は再度ご確認のうえ変更を行ってくださいパスワード変更ご登録されているパスワードを変更される際にご利用くださいパスワードには以下の制限があります 6 文字以内半角英数字ユーザー情報ご登録されているユーザー情報を変更される際にご利用ください印のある項目は入力必須項目ですので未記入の場合はエラーとなります Copyright (C) 0 ING System Co., Ltd. All Rights Reserved. 8

9 5. ご契約情報ご契約情報の確認変更を行います. 設定. 編集. 埋め込みご契約情報ドメイン現在ご契約されているドメインのプランとオプションになりますまたプラン及びオプションの変更も可能です削除されるとドメインで設定されている情報は全て削除されますのでご注意くださいドメインについて契約ドメイン追加で増やす事が可能ですプランオプションの変更は変更が行われた時点で当月の課金対象となりますのでご注意ください契約ドメイン追加変換対象となるドメインを追加することが出来ます追加時にプランとオプションを選択できますドメインの追加は追加が行われえた時点で当月の課金対象となりますのでご注意くださいご契約情報クレジットカードご登録されているクレジットカード情報を変更できます Copyright (C) 0 ING System Co., Ltd. All Rights Reserved. 9

10 6. 設定一覧ドメイン (FQDN) の設定を行います. 設定. 編集. 埋め込みドメイン (FQDN) に利用したいドメインを入力します変更ボタンで内容を確定させます変換設定画面へ移動ボタンを選択してスマートフォン作成画面へ移動しますドメイン (FQDN) サイト名 / コメント利用したいドメイン名を入力してください入力は FQDN となりますので http(s):// を除いた部分を入力してください例 : の場合 brie.ingsystem.co.jp 必要に応じてサイト名やコメントをつける事が出来ます例 : 公式サイトブログ等入力は必須ではないので空でも大丈夫です変更ドメイン名やサイト名等を入力された内容を確定させますドメイン名に日本語や記号などが含まれている場合はエラーメッセージが表示されます変換設定画面へ移動スマートフォン作成画面へ移動します Copyright (C) 0 ING System Co., Ltd. All Rights Reserved. 0

変換設定画面の説明 6 5 PC サイト操作 PC サイトタイトルコンポーネント作成 PC サイト表示に対する各種操作を行うことができます表示している PC サイトのページタイトルを表示しますスマートフォンレイアウトにコンポーネントを追加することができます 7 保存ご契約者様のみスマートフォンレイアウト保存しサイトに変換を適用します 5 終了変換設定を終了します 6 PC サイト表示

11 変換設定画面の説明 6 5 PC サイト操作 PC サイトタイトルコンポーネント作成 PC サイト表示に対する各種操作を行うことができます表示している PC サイトのページタイトルを表示しますスマートフォンレイアウトにコンポーネントを追加することができます 7 保存ご契約者様のみスマートフォンレイアウト保存しサイトに変換を適用します 5 終了変換設定を終了します 6 PC サイト表示ご指定 URL の PC サイトページを表示しますスマートフォンレイアウトスマートフォン用レイアウトの編集表示を行います以降の説明では上記 7 の例を元に同じものを作成するための操作を説明いたします 8 選択要素構造表示 PC サイト表示 / スマートフォンレイアウトで選択中の要素の構造を表示します 9 スマートフォンレイアウト操作スマートフォンレイアウトに対する各種操作を行うことができます Copyright (C) 0 ING System Co., Ltd. All Rights Reserved.

ドロップします不要な要素を選択しますスマートフォンサイト下部にある削除を選択します

20 . 設定. 編集. 埋め込み CSS を OFF にすることにより CSS 要素で見えない状態であったプルダウンメニューなどが全て表示されます複数回クリックをしてプルダウン全体を選択した状態にします複数選択した状態でスマートフォンサイトのここに要素をドロップ ( ここがコンテンツ部分ですタイトルのクリックで開閉します ) へドラッグ & ドロップします Copyright (C) 0 ING System Co., Ltd. All Rights Reserved. 0

24 . 設定. 編集. 埋め込み必要な要素だけ残した状態にします日付部分を選択しますドラッグ & ドロップで最下段にある brieart( ブリエアート ) にドロップします挿入部分が表示されるので上に挿入を選択しますドロップする場所によって挿入の表示が左右だけでなく上下になる場合があります新サービスをプレリリースも同様にドラッグ & ドロップを行います Copyright (C) 0 ING System Co., Ltd. All Rights Reserved.

27 . 設定. 編集. 埋め込み PC サイト側の画像を選択しますこの時の画像はどの画像でも構いませんスマートフォンサイトにある brieart( ブリアエート ) 部分にドラッグ & ドロップしますドロップ時に挿入メニューが表示されますので下に挿入を選択しますスマートフォンサイトのリンク部分に画像が挿入された状態です Copyright (C) 0 ING System Co., Ltd. All Rights Reserved. 7

28 . 設定. 編集. 埋め込み挿入した画像を選択しますスマートフォンサイト下部にある設定を選択します画像 URL 指定部分に表示させたい画像の URLを記入することで表示画像を変更しますここで指定する画像はアクセス制限等が無ければ外部のURLのものであっても表示します適用を選択して変更を行います Copyright (C) 0 ING System Co., Ltd. All Rights Reserved. 8

31 8. 変換タグの埋め込み変換タグをウェブサイトに埋め込みます. 設定. 編集. 埋め込み変換タグを確認しコピーしてくださいウェブサイト内の head タグ内にコピーした変換タグを挿入 ( 記述 ) してください挿入 ( 記述 ) 後のアクセスよりスマートフォンに対してはプレビューで確認した画面が表示されます Copyright (C) 0 ING System Co., Ltd. All Rights Reserved.

brieart変換設定画面マニュアル

brieart変換設定画面マニュアル変換設定画面マニュアル Ver. 1.1 更新日 :2012/11/19 株式会社アイエヌジーシステム Copyright (C) 2012 ING System Co., Ltd. All Rights Reserved. 目次 1. brieartとは? 3 ラベル 26 リスト 29 brieartとは 3 開閉 ( アコーディオン ) 32 注意事項制限事項など 4 ボタン 35 パネル