メニュースキップ

전체보기
전체보기

메뉴보기 search
マニュアル
THEVOS WebMail
         
배경이미지

マニュアル

お知らせ

✔ Viewer
CSS

CSS オブジェクトフィットプロパティ

by TheVOS posted Dec 04, 2019
?

Shortcut

Prev前へ 書き込み

Next次へ 書き込み

Larger Font Smaller Font 上へ 下へ Go comment 印刷 添付
?

Shortcut

Prev前へ 書き込み

Next次へ 書き込み

Larger Font Smaller Font 上へ 下へ Go comment 印刷 添付
Extra Form
原文出所 https://www.w3schools.com/css/css3_object-fit.asp

object-fit 속성은 IMG, VIDEO 태그의 크기를 컨테이너에 맞게 자정하는데 사용됩니다.


브라우저 지원

테이블의 숫자는 완전히 속성을 지원하는 최초의 브라우저 버전을 지정합니다.

Propertyicon-chrome1.png icon-edge.png icon-firefox1.png icon-safari1.png icon-opera1.png
object-fit31.016.036.07.119.0
특징설명
기본 값object-fit : 개별적 속성
상속안됨
애니메이션안됨
적용-
버전CSS3

정의(Definition)

  • object-fit 속성은 <img>, <video> 태그의 크기를 정의합니다.

문법(Syntax)

object-fit: fill | contain | cover | scale-down | none

속성(Property)

속성값설명
fill컨텐츠 사이즈 크기에 맞게 설정합니다.
contain컨텐츠의 가로 값을 기준으로 맞게 설정합니다.
cover컨텐츠 화면 사이즈에 맞게 설정합니다.
scale-down컨텐츠 크기 보다 작게 설정합니다.


Original

FILL

CONTAIN

COVER

NONE

SCALE-DOWN




object-fit: fill;
object-fit: contain;
object-fit: cover;
object-fit: none;
object-fit: scale-down;


Facebook [ja]コメント 

Atachment
添付 '6539'
Facebook Twitter Google Pinterest
上へ 下へ Go comment 印刷 添付
Select Editor
?
  • Q: [EC-CUBE 4系] 管理機能一覧 2020.11.12
    A:
    https://thevos.jp/Manual/113305

    ○：標準搭載機能。要件によって個別のカスタマイズが必要な可能性があります。
    PLG：プラグインにて対応可能です。


    分類♯機能説明3系4系
    A：認証機能1パスワード認証管理者登録したユーザでのID/パスワードによるログイン。○○
    2管理者登録複数の管理者の登録が行えます。○○
    B：TOPページ1受注状況現在の商品の受注の状態をTOPページに表示します。○○
    2売上状況現在の売上げ、会員数をTOPページに表示します。○○
    3売上状況グラフ売上状況を週間・月間・年間のグラフで確認できます。×○
    4ショップ状況現在の在庫状況や会員数をTOPページに表示します。○○
    5EC-CUBEのお知らせEC-CUBEのバージョンUPやイベント情報等お知らせを表示します。○○
    6おすすめプラグインオーナーズストアからおすすめするプラグインを表示します。×○
    C：商品管理1商品検索/一覧商品の検索、一覧表示が行えます。○○
    2商品登録/編集機能商品名、価格、コメント、SHOP専用備考欄などの商品基本データの登録が行えます。○○
    3商品画像登録商品画像のアップロード、登録が行えます。○○
    4在庫情報登録在庫数の登録が行えます。○○
    5商品情報CSV出力商品データのCSV出力が行えます。○○
    6商品一括変更機能商品一覧画面で、公開・非公開・廃止・完全に削除　の4つの変更を一括で行えます。×○
    7規格登録商品の規格の登録が行えます。○○
    8カテゴリ登録/編集機能商品の表示スタイル選択、階層の登録/編集が行えます。○○
    9カテゴリコンテンツ登録カテゴリページに説明文や画像などのコンテンツを追加することができます。PLG×
    10タグ登録/編集商品情報に付与できるタグを登録/編集することができます。×〇
    11カテゴリ情報CSV出力カテゴリ情報のCSV出力が行えます。○○
    12商品情報CSV登録商品データをCSVで一括登録できます。○○
    13カテゴリ情報CSV登録カテゴリ情報のCSV登録が行えます。○○
    14販売制限一度の注文で同時に購入可能な商品数の制限が行えます。○○
    15関連商品手動登録/編集商品を購入した人に推奨する関連商品の手動登録が行えます。PLGPLG
    16商品レビュー管理商品のレビュー管理が行えます。PLGPLG
    17複数カテゴリ商品を複数カテゴリに登録して管理する事ができます。○○
    18商品キーワード検索項目登録商品のキーワードの項目を登録できます。○○
    19メーカー管理機能商品ごとにメーカーとメーカーURLを登録することができます。お客向けには商品詳細画面でメーカーとメーカーURLが表示されます。PLGPLG
    20リスティング広告 入稿用CSV作成機能リスティング広告の入稿用CSVファイルを（商品ごとの広告テキスト/キーワードの生成）出力します。PLG×
    D：受注管理1受注情報検索/一覧受注情報の検索、一覧表示が行えます。○○
    2受注情報CSV出力受注内容のCSV出力が行えます。○○
    3配送情報CSV出力配送情報のCSV出力が行えます。○○
    4新規受注情報入力電話やFAXで発生した受注情報の登録が行えます。○○
    5出荷CVS登録出荷日時や問い合わせ番号（出荷伝票番号）をCSVで登録することができます。×○
    6受注情報編集受注情報の編集が行えます。○○
    7対応状況一括変更受注の対応状況を一括で変更できます。×○
    8出荷メール一括送信機能出荷メールを一括で送信することができます。×○
    9問い合わせ番号（出荷伝票番号）入力機能問い合わせ番号（出荷伝票番号）を受注一覧画面、及び、詳細画面から入力することができます。×○
    10対応状況設定未処理、商品手配中、配送中などのステータスの設定が受注詳細画面から行えます。○○
    11各種メール送信注文されたお客様に任意のタイミングで「商品発送済みメール」などのメールを受注詳細画面から送信できます。○○
    12納品書PDF出力納品書のPDF出力が行えます。一括出力することも可能です。PLG○
    13ショップ用メモ登録機能ショップ運営者が確認する用のメモを登録することができます。○○
    14配達用メモ登録機能出荷作業者や、配送業者に対するメモを登録することができます。×○
    E：会員情報1顧客情報検索/一覧顧客情報の検索、一覧表示が行えます。○○
    2顧客情報CSV出力顧客情報のCSV出力が行えます。○○
    3顧客情報登録/編集顧客情報の登録/編集が行えます。○○
    4会員登録仮登録完了メール再送会員登録仮登録完了メールを再送できます。○○
    F：コンテンツ管理1新着情報管理フロントTOPページなどに表示する新着情報の登録/編集が行えます。○○
    2オススメ管理フロントTOPページなどに表示するオススメ商品の登録が行えます。
    （最大8個まで）    		PLGPLG
    3ファイル管理ファイルのアップロード、ダウンロードが行えます。○○
    4SEO管理ページ毎にメタタグにキーワードを埋め込む事ができます。○○
    5レイアウト編集TOPページ、商品一覧ページ、商品詳細ページのレイアウトを変更する事ができます。○○
    6モバイル専用レイアウト設定レスポンシブウェブデザインの他、モバイル専用のレイアウトを追加することができます。×○
    7ブロック編集TOPページのレイアウト編集にて、表示させるブロックを登録する事ができます。○○
    8ヘッダー･フッター編集全ページで共通で使用するヘッダー・フッターの編集をする事ができます。○○
    9HTMLコードエディタコードエディタ上で、HTMLやTwigファイルの修正が行えます。また、Twigの構文エラーがある場合は検知し、通知してくれます。×○
    10キャッシュ管理Twigキャッシュを削除できます。（FTPなどでTwigファイルをアップロードして入れ替えた場合に利用する機能です）○○
    11CSS管理CSSを追加・編集することができます。×○
    12JavaScript管理JavaScriptを追加・編集することができます。×○
    13favicon設定ファイル管理から、faviconの変更を行うことができます。×○
    G：店舗設定（旧基本情報設定）1基本設定(旧ショップマスター)サイト運営に必要な会社情報の設定、編集が行えます。○○
    2特定商取引に関する法律特定商取引に関する法律に定める要件等の記入、編集が行えます。○○
    3会員規約設定会員登録時に確認する規約の記入、編集が行えます。○○
    4支払い方法/手数料設定支払い方法、及び支払い方法ごとの手数料の設定が行えます。○○
    5支払い方法利用条件設定購入金額の上限下限の設定が行え、支払い方法の利用制限が行えます。○○
    6配送料無料条件設定購入金額合計等から配送料が無料になる条件の設定が行えます。○○
    7配送業者/配送料/配送時間設定配送業者、及び配送業者ごとの配送料、配送時間の設定が行えます。○○
    8税率設定消費税の端数を何桁で切り捨てるか、四捨五入/切捨てのどちらで計算するかを設定が行えます。○○
    9商品別税率設定商品別に税率を設定できます（軽減税率に対応）。○○
    10メール設定機能EC-CUBEからお客様に送信するメール文章を編集できます。PLG○
    11マルチパートメール設定テキストメールとHTMLメールを設定することができます。×○
    12CSV出力項目設定CSVで出力する際に記載される内容を設定できます。○○
    13ポイント設定◎ポイント付与率の設定
    商品全体に対するポイントの付与率の設定が行えます。
    ◎商品ごとポイント付与率設定
    一括付与率ではなく、個別に変更したい場合、商品ごとに付与率の変更が行えます。    		PLG○
    14サイト管理設定機能を利用するかどうか設定できます。○○
    H：システム情報設定（設定）1システム情報サーバ、OS、DB、PHP等システム設定の情報を確認できます。○○
    2メンバー管理管理画面にログインできるメンバーの管理をします。○○
    3権限管理メンバーグループごとでアクセスできるページを設定できます。○○
    4セキュリティー管理管理画面にアクセスできるIPの制限や管理画面のURLの変更サイトのSSL制限の設定ができます。○○
    5ログ表示EC-CUBEから出力されたログを表示します。○○
    6マスターデータ管理各種マスターデータを編集できます。○○
    7カスタムCSV出力機能SQLを作成し、CSVファイルをダウンロードすることができます。PLG×
    I：オーナーズストア（設定）1プラグイン一覧購入・インストールしたプラグインの一覧を表示します。○○
    2プラグイン検索・インストールオーナーズストアで販売しているプラグインを管理画面から検索し、
    無料プラグインはそのままインストールすることができます。
    （有料プラグインはオーナーズストアで購入する必要があります。）    		×○
    3ダウンロードプラグインインストールオーナーズストアからダウンロードしたプラグインをアップロードしてインストールすることができます。○○
    4プラグインハンドラ設定インストールしたプラグインの設定を行うことができます。×○
    5テンプレート設定あらかじめ用意された専用テンプレートをワンボタンで適用できます。○○
    J：その他1アップデート対応EC-CUBEのマイナーバージョンアップ時にコア機能のアップデートとDBのマイグレーションが可能。○○
    K：ポイント1ポイント購入に応じて会員へポイントを付与し、次回購入時に利用できる機能。PLG○
    L：売上げ集計1期間別集計任意の期間の売上集計結果をグラフと一覧で表示できます。PLGPLG
    2商品別集計商品別の売上集計結果をグラフと一覧で表示できます。
    3年代別集計購入者の年代別の売上集計結果をグラフと一覧で表示できます。
    4職業別集計購入者の職業別の売上集計結果をグラフと一覧で表示できます。
    5会員別集計購入者の会員別の売上集計結果をグラフと一覧で表示できます。
    M：メルマガ配信1メルマガ配信検索/配信予約メルマガ配信先のしぼり込み検索、配信予約設定が行えます。PLGPLG
    N：クーポン1クーポン管理機能商品・カテゴリーに対して、一定額・一定率での割引を適用するクーポンを発行できます。PLGPLG

    Facebook [ja]コメント 

  • Q: [EC-CUBE 4系] フロント機能一覧 2020.11.12
    A:
    https://thevos.jp/Manual/113304

    ○：標準搭載機能。要件によって個別のカスタマイズが必要な可能性があります。
    PLG：プラグインにて対応可能です。

    分類♯機能説明3系4系
    A：商品紹介1商品一覧ページ登録商品をカテゴリごとに一覧表示します。○○
    2商品サムネイル表示一覧ページで商品がサムネイル表示されます。○○
    3一覧並び替え機能商品を価格順、新着順で並び替えをする事ができます。○○
    4商品詳細ページ説明文表示、商品画像表示、カゴへボタン表示。○○
    5商品タグおすすめ、残り僅かなどのステータスを表示（手動）させることができます。○○
    6在庫終了ステータス在庫が切れた場合には、自動的に在庫切れを表示します。○○
    7ユーザレビュー商品詳細ページ商品レビューを登録、表示できるようにします。PLGPLG
    8商品お気に入り登録会員登録しログインしている状態で、商品をお気に入りに登録することができます。○○
    B：商品注文1ショッピングカート機能複数商品選択などを行う、基本的なショッピングカート機能です。○○
    2非会員購入機能非会員のユーザでも購入できる機能です。○○
    3別のお届け先入力機能会員登録しているユーザーの場合、１ユーザが複数のお届け先を保持することができます。○○
    4配送時間指定管理者画面で登録した配送時間の指定を行えます。○○
    5お支払い方法選択管理者画面で登録した支払い方法の選択を行えます。○○
    6購入前見積表示送料、手数料を自動計算した後、注文内容の確認ページを表示します。○○
    7注文処理注文登録と同時にThanksメールを自動送信し、管理者にも注文受付メールを送信します。○○
    8ポイント購入機能商品購入で蓄積したポイントを利用して商品を購入することができます。PLG○
    9商品一覧からカートに追加商品一覧画面から直接カートに商品を追加し購入することができます。×○
    10カートの永続化機能ログイン期限切れやログアウト後でもカート情報を保持し、次回ログイン時にカート情報を復活させる機能。また、カート情報は異なるデバイスでログインしても復活します。×○
    C：お客様ページ（MYページ）1会員登録機能会員登録を行うことができます。○○
    2ログイン機能ユーザログイン画面を提供します。○○
    3会員情報編集機能会員情報の登録、変更が出来ます。○○
    4注文履歴一覧表示過去の注文を一覧表示します。○○
    5注文詳細確認機能現在の注文内容を表示します。○○
    6別のお届け先編集機能複数の配送先の登録・編集・削除が出来るようにします。○○
    7お気に入り商品一覧お気に入りに登録した商品を一覧表示します。○○
    8退会退会手続きを行えるようにします。○○
    D：その他1パスワードリセット機能ユーザがパスワードを忘れた際に会員登録時に入力したメールアドレスへメールを送信し、メールが認証されると、再発行したパスワードがメールアドレスへ送信される。○○
    2パスワード再設定ユーザがパスワードを忘れた際にパスワードを再設定することができる機能。パスワードリセット機能に代わり、よりセキュリティの高い機能を採用。×○
    3オススメ商品表示トップページのオススメ枠に設定したオススメ商品を表示します。PLGPLG
    4新着情報表示新着情報の表示を行えます。○○
    5商品カテゴリ検索商品カテゴリをもとに検索できます。○○
    6商品キーワード検索キーワード検索（ブランド名、商品名の一部など）で検索できます。○○
    7お問い合わせフォーム問い合わせフォームから管理者宛てに問い合わせをメールすることができます。○○

    Facebook [ja]コメント 

  • Q: [EC-CUBE 2系] EC-CUBE 2系でポート番号付で管理画面を動かす 2020.01.02
    A:
    https://thevos.jp/Manual/60240

    Apacheの処理分散させるために、ロードバランサーを介してラウンドロビンを掛けた複数台で同じEC-CUBEを動かす必要が出てきました。
    Apacheを動作させるフロントエンドをコピーした複数台でPHP処理を分担、MySQLはローカル接続されているバックエンドの専用サーバーで運用という形です。

    EC-CUBEはそもそもPHPセッションをDB保存しているので、DBをバックエンドのサーバーで共通化しておけば複数台でのPHPセッションの共有化を配慮する必要はなく、複数台運用への切り替えは簡単です。

    ただし、管理画面からアップロードした画像等はApacheを動かしているサーバーに物理的に保存されるため、ラウンドロビンが掛かった状態ではどのサーバーにファイル保存されるか分からなくバラバラになってしまうため、どれか1台固定のサーバーを正としてそこへ保存し、rsync等で各サーバーへコピーしなくてはなりません。

    サブドメインではっきり分けれれば良いのですが、ドメイン追加をできない場合は1443などの独自のポート番号でポートフォワードで振り分けて管理画面を動かすサーバーを固定したいところ。

    ただし、普通にポート番号付きでアクセスしてしまうと、管理画面でログインした直後にリダイレクトエラーが出ます。
    これは/data/config/config.php で設定している HTTP_URL や HTTPS_URL と異なるURLへジャンプすることを防ぐセキュリティ対策の影響です。
    では、そもそもHTTP_URL に:1443付きで定義したらどうかとなりますが、そうすると今後はポート番号無しでアクセスしているカート画面などでリダイレクトエラーが出ます。訪問者画面も管理画面も同じEC-CUBEだと設定も共通なので。

    そこで、ポート番号付きでアクセスしたときだけこのURLを書き換えてしまうと良いです。
    具体的には /data/config/config.php をこんな風に書きます。常時SSLのご時勢ですからHTTP_URLは振り分けなくても良いかな？

    define('HTTP_URL', 'http://www.exsample.co.jp/');
if ($_SERVER['SERVER_PORT'] == '1443') {
  define('HTTPS_URL', 'https://www.exsample.co.jp:1443/');
} else {
  define('HTTPS_URL', 'https://www.exsample.co.jp/');
}

    Facebook [ja]コメント 

  • Q: [EC-CUBE 2系] EC-CUBE 2系で注文を受けた商品の規格を後で削除すると、管理画面で受注内容を編集できなくなる 2020.01.02
    A:
    https://thevos.jp/Manual/60239

    注文された規格を削除して、dtb_products_classテーブルから該当する規格データが無くなると、受注内容のたとえば発送先住所などを編集しようとしても数量の上限チェックに引っかかりエラーが出て受注内容の変更ができなくなってしまいます。

    ※ この現象は、規格のチェックBOXを外して更新 → チェックBOXを再度立てて更新 でも発生します。見た目は同じ規格が存在しているように見えますが、内部のproduct_class_idが変わってしまうのが原因です

    product_class_idも引用してこれていないので画面処理もうまくいきません。
    対応策として、もし規格データが削除されていた場合は在庫数チェックを行わないようにする事で受注内容の編集をできるようにしてみます。

    まずdtb_products_classから規格データが無くなっていてもproduct_class_idやproduct_idを引用できるように商品詳細dtb_order_detailの方から参照するようにします
    SC_Helper_Purchase.php の
    function getOrderDetail のSQL文を書き換えます

    -            T3.product_id,
-            T3.product_class_id as product_class_id,
+            T2.product_id,
+            T2.product_class_id as product_class_id,

    LC_Page_Admin_Order_Edit.php の
    function lfCheckError に処理をスルーさせるIF文を追加

                // 在庫数のチェック
            $arrProduct = $objProduct->getDetailAndProductsClass($arrValues['product_class_id'][$i]);

+            // 規格が削除されていたら在庫数チェックしない
+            if ($arrProduct['product_class_id'] == '') {
+                continue;
+            }

    商品種類 product_type_id も引用してこれていなくて、画面にはエラー表示されませんが必須チェックに引っかかり先に進めなくなるのでこれもスルーさせます。
    LC_Page_Admin_Order_Edit.php の
    function lfInitParam を修正

            // 受注詳細情報
-        $objFormParam->addParam('商品種別ID', 'product_type_id', INT_LEN, 'n', array('EXIST_CHECK', 'MAX_LENGTH_CHECK', 'NUM_CHECK'), '0');
+        $objFormParam->addParam('商品種別ID', 'product_type_id', INT_LEN, 'n', array('MAX_LENGTH_CHECK', 'NUM_CHECK'), '0');

    視覚的にも、規格が削除されていて在庫数が連動しない商品だと分かったほうが良いので、数量欄のあるTDの背景色を赤色で表示してみます。
    /data/Smarty/templates/admin/order/edit.tpl を修正

    -                    <td class="center">
-                        <!--{assign var=key value="quantity"}-->
+                    <td class="center"<!--{if $arrForm.product_type_id.value[$product_index] == ''}--> style="background-color:#fdd"<!--{/if}-->>
+                        <!--{assign var=key value="quantity"}-->

    そもそも関連データが存在している規格データを容易にdeleteしてしまう実装ってどうなの？っていう話なんですが。

    Facebook [ja]コメント 

  • Q: [EC-CUBE 2系] EC-CUBE 2系でShift_JISに存在しない文字が含まれた受注データがあると、その受注内容が受注CSVからまるごと欠落する 2020.01.02
    A:
    https://thevos.jp/Manual/60238

    受注データの備考などにお客様が入力した文章にShift_JISで表現できない文字や記号がまざっていると、受注CSVをダウンロードしたときにその受注データがそっくり欠落してしまいます。

    これはCSVデータをShift_JISに変換するときのiconvのパラメータがデフォルトの「不正な文字があったらデータを捨てる」指定になっているからです。
    受注データが抜け落ちてしまっては、発見が遅れて実務上のトラブルになりかねないので、変換できない文字があっても近似文字に置き換えて出力するTRANSLIT指定をつけた方が良いと思います。

    SC_Helper_CSV.php の
    function fopen_for_output_csv のiconv指定を変更

    -        stream_filter_append($fp, 'convert.iconv.utf-8/cp932');
+        stream_filter_append($fp, 'convert.iconv.utf-8/cp932//TRANSLIT');

    Facebook [ja]コメント 

  • Q: [EC-CUBE 2系] EC-CUBE 2系で商品情報をCSVで更新するとき関連商品情報が削除される 2020.01.02
    A:
    https://thevos.jp/Manual/60237

    CSVアップロードして商品データを更新する事ができるのですが、そのCSVに「関連商品」の列が無いと、CSVをアップロードしたときにその商品に今まで登録されていた関連商品の内容が全て削除されてしまいます。

    これは、CSVアップロード処理が「関連商品」に関する列がCSVに存在している事を前提に処理しているからで、関連商品がCSV列名に存在しているかどうかチェックして、列が無かったら関連商品の処理を行わないようにすることで回避できます。

    LC_Page_Admin_Products_UploadCSV.php の
    function lfRegistReccomendProducts の冒頭に以下のコードを挿入

            $cnt = 0;
        for ($i = 1; $i <= RECOMMEND_PRODUCT_MAX; $i++) {
            $keyname = 'recommend_product_id' . $i;
            $comment_key = 'recommend_comment' . $i;
            if (array_key_exists($keyname, $arrList) == true) $cnt++;
            if (array_key_exists($comment_key, $arrList) == true) $cnt++;
        }
        if ($cnt == 0) return;

    ※ 自分でコミュニティへ参加してパッチを作成するマンパワーが無いのでその予定はありません

    Facebook [ja]コメント 

  • Q: [EC-CUBE 2系] EC-CUBE 2系で商品を沢山購入すると住所情報が欠落する 2020.01.02
    A:
    https://thevos.jp/Manual/60236

    以外と有名な問題なのですが、カートに沢山の商品を入れて注文すると、受注メールは送信されてエラーも出ないのに「送料がゼロ円になる」とか「管理画面に受注データが表示されない」という障害が起きます。

    これは、セッション情報を保存するDBテーブルが text型で取られているため、65,535バイト(MySQLの場合)以上のセッション情報を保存しようとすると後ろの方のデータが欠落するためです。

    CREATE TABLE dtb_session (
    sess_id text NOT NULL,
    sess_data text,
    create_date timestamp NOT NULL DEFAULT CURRENT_TIMESTAMP,
    update_date timestamp NOT NULL,
    PRIMARY KEY (sess_id(255))
);

    このセッションデータには、カートに入れた商品の情報＋購入者情報＋配送先情報が入るため、欠落するときは真っ先に配送先の情報が欠落してしまい、結果として都道府県が分からなくなるので送料が計算できずにゼロ円になってしまいます。また、受注データとJOINする配送先データが生成されないので一覧に受注データが表示されないという症状に繋がります。

    対策としては、text → logtext に型を変更するだけで65Kバイト→4Gバイトまで保持できるようになるので情報欠落は無くなります。sessionデータはdtb_order_tempテーブルにも持っているのでそちらも修正が必要です。

    alter table dtb_session modify sess_data longtext;
alter table dtb_order_temp modify session longtext;

    ※ かなり以前から報告されている障害ですがバージョン2.13.5でも対策されていないので公式に対応する予定は無いようです
    ※ 自分でコミュニティへ参加してパッチを作成するマンパワーが無いのでその予定はありません

    Facebook [ja]コメント 

  • Q: [EC-CUBE 2系] EC-CUBE 2系の「もっと見る」を簡潔に 2020.01.02
    A:
    https://thevos.jp/Manual/60235

    今更ながら、EC-CUBE 2系のスマホ版のデザイン変更で苦労しました。

    EC-CUBEに組み込まれている「もっと見る」ボタンですが、Ajaxで次ページのjsonデータを取得してきて画像、商品名、価格等のspanやimgタグの中身を1個ずつコピーしている。。。（3系でも同じなのかな？？）

    これでは、つぶしが気かないったらありゃしないので、デザイン変更しても動作するJavaScriptに書き換えてみました。jsonではなく2ページ目のHTMLをそのままGETしてきて商品一覧部分のタグをそのまま現在の一覧の下に差し込むだけ。

    ・総HIT数が<span id=”productscount”>XXX</span>に書かれていること。
    ・もっと見るボタンにid=”btn_more_product”が付いていること。
    ・商品リストの個別商品が class=”list_area” に入っていて、各商品ブロックが<form>で囲まれていること。
    （<form>で囲まれていないなら、2ヶ所の .closest(‘form’) は不要）

    の3点だけ守られていれば、デザイン変更しても大丈夫です。

    <script>
    var pageNo = 2;
    var url = "<!--{$smarty.const.P_DETAIL_URLPATH}-->";
    var imagePath = "<!--{$smarty.const.IMAGE_SAVE_URLPATH|sfTrimURL}-->/";
    var statusImagePath = "<!--{$TPL_URLPATH}-->";
	
    function getProducts(limit) {
        $.mobile.showPageLoadingMsg();
        var i = limit;
        //送信データを準備
        var postData = {};
        $('#form1').find(':input').each(function(){
            postData[$(this).attr('name')] = $(this).val();
        });
        postData["mode"] = "html";
        postData["pageno"] = pageNo;

        // デザイン変更に左右されない「もっと見る」処理に書き換えました。
        $.ajax({
            type: "POST",
            data: postData,
            url: "<!--{$smarty.const.ROOT_URLPATH}-->products/list.php",
            cache: false,
            dataType: "html",
            error: function(XMLHttpRequest, textStatus, errorThrown){
                alert(textStatus);
                $.mobile.hidePageLoadingMsg();
            },
            success: function(result){
                $('.list_area:last').closest('form').after($(result).find('.list_area').closest('form').clone(true));
                pageNo++;

                //すべての商品を表示したか判定
                if (parseInt($("#productscount").text()) <= $(".list_area").length) {
                    $("#btn_more_product").hide();
                }
                $.mobile.hidePageLoadingMsg();
            }
        });
    }
</script>

    Facebook [ja]コメント 

  • Q: [EC-CUBE 2系] EC-CUBEをインストールする 2019.12.10
    A:
    https://thevos.jp/Manual/59097

    EC-CUBEを利用することになりそうなので、ひとまずEC-CUBEをレンタルサーバーにインストールしてみました。その手順備忘録です。

    EC-CUBEインストール手順

    1. EC-CUBEをダウンロードする
    2. EC-CUBEのファイルを配置する
    3. データベースを作る
    4. EC-CUBEをインストールする

    EC-CUBEをダウンロードする

    EC-CUBE公式サイトからファイルをダウンロードします。
    2019年12月時点で最新バージョンは、2.13.5です。なのでダウンロードしたファイルは eccube-2.13.5.zipでした。
    screencapture-ec-cube-net.jpg
    ダウンロードするには、EC-CUBEメンバーである必要があります。登録は無料なので迷わず登録しました。

    補足ですが、バージョンによっては不具合修正ファイルがあることもあるようなので、その場合はその不具合修正ファイルもダウンロードしておきます。（今回はありませんでした。）

    EC-CUBEのファイルを配置する

    ダウンロードしたファイルは圧縮ファイルなのでとりあえず解凍します。
    そして、サーバーに配置する前に少し準備します。

    解凍すると以下のフォルダが存在すると思います。
    /data
    /docs
    /html
    /test
    /tests
    必要になのは「data」「html」の2つだけです。
    （不具合修正ファイルがある場合は上書きしてください。）

    これから構築するサイトのURLを「http://ドメイン/html」ではなく「http://ドメイン/」としたいので、「data」フォルダを丸ごと「html」フォルダ直下に移動します。
    その移動に伴い、html/define.phpを修正します。

    （修正前）

    1
    define("HTML2DATA_DIR", "/../data/");

    （修正後）

    1
    define("HTML2DATA_DIR", "/data/");

    次に「html」フォルダ直下にある.htaccessを削除します。

    ↓↓↓↓↓　重要　↓↓↓↓↓
    このままでは、dataフォルダにWEbからアクセスできてしまうため、とっても危険です。    例えばlogファイルが丸見えになってしまうので、管理画面のログインIDやサーバーのパスや何のプラグイン使ってるかーなど、いろいろとデータが取れてしまうのです。（他にもいろいろ問題アリ。）
    そこで、dataフォルダ直下に以下を記述した.htaccessを配置します。

    1
    2
    order allow, deny
    deny from all

    ほんとは、dataフォルダはhtmlフォルダ内じゃなくて、ルートディレクトリ外に配置できる方が理想です。
    今回はどうしてもそれが出来ない環境の場合を例にしています。
    ↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑

    ここまで出来たら、サーバーに配置します。
    配置する場所はサーバーによって異なりますが、たいていはApacheのドキュメントルート直下に「html」フォルダ内のフォルダ、ファイル全てを配置します。

    データベースを作る

    EC-CUBEはデータベースを必要とするのでデータベースを事前に準備します。
    PostgreSQLかMySQLを使用することができます。私はphpMyAdminを使ってMySQLを作成しました。
    後で必要になるので、データベース名、MySQLユーザー名、MySQLパスワード、ホスト名をメモしておきます。

    EC-CUBEをインストールする

    「http://ドメイン/」にアクセスします。以下の画面が表示されたら「次へ進む」ボタンを押します。
    eccube-ins-02

    チェック結果が表示されます。成功していれば「次に進む」ボタンを押します。
    eccube-ins-03

    必要なファイルのコピーが開始されます。これも成功していれば「次に進む」ボタンを押します。
    eccube-ins-04

    ECサイトの設定をします。
    純国産のCMSというだけあって説明が丁寧です。さすがです。必要事項を入力して次へ進みましょう。
    eccube-ins-05

    データベースの設定です。
    事前に準備したデータベースの情報を入力します。DBの種類を間違えないようにしましょう。
    入力できたら「次へ進む」ボタンを押します。
    eccube-ins-07

    データベースの初期化です。
    eccube-ins-08
    eccube-ins-09

    デバッグのために情報提供を依頼されます。無難に「はい（推奨）」にしました。「いいえ」にしたらどうなるかは、試してないのでわかりません。
    eccube-ins-10

    インストール完了です。管理画面ログインにすすみます。
    eccube-ins-11

    ここで画面上部に警告が出ます。install/index.phpを削除しろと言っています。おとなしく従いましょう。
    eccube-ins-12

    ファイルを削除するとログイン画面から警告が消えるので、改めて管理画面にログインします。
    eccube-ins-13

    これにて終了です。

    Facebook [ja]コメント 

  • Q: [CSS] CSS オブジェクトフィットプロパティ 2019.12.04
    A:
    https://thevos.jp/Manual/58029

    object-fit 속성은 IMG, VIDEO 태그의 크기를 컨테이너에 맞게 자정하는데 사용됩니다.


    브라우저 지원

    테이블의 숫자는 완전히 속성을 지원하는 최초의 브라우저 버전을 지정합니다.

    Propertyicon-chrome1.png icon-edge.png icon-firefox1.png icon-safari1.png icon-opera1.png
    object-fit31.016.036.07.119.0
    특징설명
    기본 값object-fit : 개별적 속성
    상속안됨
    애니메이션안됨
    적용-
    버전CSS3

    정의(Definition)

    • object-fit 속성은 <img>, <video> 태그의 크기를 정의합니다.

    문법(Syntax)

    object-fit: fill | contain | cover | scale-down | none

    속성(Property)

    속성값설명
    fill컨텐츠 사이즈 크기에 맞게 설정합니다.
    contain컨텐츠의 가로 값을 기준으로 맞게 설정합니다.
    cover컨텐츠 화면 사이즈에 맞게 설정합니다.
    scale-down컨텐츠 크기 보다 작게 설정합니다.


    Original

    FILL

    CONTAIN

    COVER

    NONE

    SCALE-DOWN




    object-fit: fill;
object-fit: contain;
object-fit: cover;
object-fit: none;
object-fit: scale-down;


    Facebook [ja]コメント 

  • Q: [CSS] Css 텍스트 외곽선 처리하기, Stroke 2019.11.28
    A:
    https://thevos.jp/Manual/57951

    CSSを使用してテキストに輪郭、ストローク効果を与える方法を見てみます。

    輪郭はテキストを強調する効果的な方法です。CSSを使用して簡単に使用することができますが、最も簡単な方法は次のように-webkit-text-strokeを使用する方法です。

    -webkit-text-stroke: 1px #000


    ただし、この方法は非常に便利ですが、標準的な方法ではなく、ウェブキットおよびモジラ系のブラウザでのみ適用されます。使用する場合は、次のようにCSSに適用してください。

     

    .text-stroke {
      -webkit-text-stroke: 1px #000;
    }

     

    これでテキストに輪郭が鮮明に表示されます。

    それでは、別の方法を見てみましょう。

     

    # -webkit-text-stroke クロスブラウジング方法
    以下のような方法を使用すると、テキストの影響を利用して、同様の効果を得ることができます。以下のコードをご覧ください。  

    .text-stroke {
        color: #f00;
        text-shadow:
        -1px -1px 0 #000,
        1px -1px 0 #000,
        -1px 1px 0 #000,
        1px 1px 0 #000;  
    }


    この方法は、text-shadowが適用されるほとんどのブラウザで実装されます。非常に効果的な方法です。
     

    # 実際の輪郭が適用された例を見る
    もしも、以下のようなHTMLに上記のCSSを適用して輪郭を直接実装してみましょう。

    <span class="text-stroke">THEVOS</span>


    上記のコードの実行結果は以下のようになります。

    THEVOS

    Facebook [ja]コメント 

  • Q: [EC-CUBE 4.x] EC-CUBE 4를 설치했을 때 설정 한 데이터베이스 암호는 어디에 저장되는 것입니까? 2019.11.14
    A:
    https://thevos.jp/Manual/57707

    설치 한 디렉토리에 .env라는 파일이 있습니다.

    거기에 DATABASE_URL라는 항목이 있습니다.


    「 DATABASE_URL = mysql://사용자 이름:암호@호스트 이름/데이터베이스 이름 」 형식으로 저장되어 있습니다.

    Facebook [ja]コメント 

  • Q: [EC-CUBE 2系] EC-CUBE2.13カスタマイズ：新しいページを追加する 2019.11.11
    A:
    https://thevos.jp/Manual/57686

    EC-CUBEで新しいページを追加する方法として、管理画面で追加して、そのページのURLを任意に変更する手順をメモ。

    管理画面からページを追加する

    管理画面でデザイン管理＞PC＞ページ詳細設定を開き、必要事項を入力して登録するボタンを押下。
    ※スマホ、モバイルもそれぞれ同様です。
    EC-CUBE-add-page-01

    これにより以下の追加が行われます。
    1）/html/user_data/sample.phpが生成される。
    ※sample.phpは登録した任意のファイル名
    ※処理はこのファイルに記述していきます
    2）/data/Smarty/templates/(テンプレート名)/user_data/sample.tplが生成される。
    ※管理画面から入力した内容が入ります。
    3）dtb_pagelayoutテーブルにこのページ情報が1レコード追加される。

    作成されたページのこの時点では以下のパスで確認できます。
    http://www.example.com/html/user_data/sample.php
    このままではイケテないので以下になるように変更していきたいと思います。
    http://www.example.com/html/sample/

    追加したページのURLを変更する

    phpファイルを移動する

    まず生成されたphpファイルを以下に移動します。フォルダを新規作成してファイル名も変更します。
    /html/sample/index.php

    DBを書き換える

    dtb_pagelayoutテーブルのurlフィールドをsample/index.phpに変更する。
    これで、URLの変更ができました。

    ちなみに、dtb_pagelayoutテーブルの中身ですが、おそらくこんな感じ。
    device_type_id・・・「10」はPC用のページという意味
    page_id・・・同じdevice_type_idで重複しないID
    page_name・・・ページ名（管理画面で表示している名前）
    url・・・ページのURL
    filename・・・tplファイルの保管場所
    edit_flg・・・削除可能フラグ

    注：インストールされた環境によってパスは異なります。一般的なパスで紹介しています。

    2014.09.08 追記
    追加したページのURLを変更した場合は、ページを更新するときに管理画面のデザイン管理＞PC＞ページ詳細設定から編集できなくなります。
    編集してしまうとdtb_pagelayoutテーブルのurlフィールドがデフォルトに戻ってしまうからです。
    更新はテンプレートを直接しなくてはなりません。
    んー、イマイチ？URLを変更しても管理画面から更新できる方法ないかなー？

    Facebook [ja]コメント 

  • Q: [EC-CUBE 3系] 관리 화면의 사이드 메뉴에 항목 추가하는 방법 2019.11.11
    A:
    https://thevos.jp/Manual/57680

    EC-CUBE3에서는 관리 화면의 사이드 메뉴에 쉽게 메뉴를 추가 할 수 있습니다.

    관리 화면에 메뉴 추가

    외형 수정이므로 템플릿 (twig)를 편집 ...라고 생각했는데, 수정할 필요가있는 것은 ServiceProvider입니다.
    실제로 ServiceProvider에서하지 않아도 좋다고 생각 합니다만,로드 된 적당한 ServiceProvider 다음의 설명합니다.

            $ app [ 'config'] = $ app-> share ($ app-> extend ( 'config', function ($ config) {
            $ nav = array (
                'id'=> 'admin_new_menu'
                'name'=> '새 메뉴'
                'url'=> 'admin_new_menu'
                'has_child'=> 'false'
                'icon'=> 'cb-chart'
                'child'=> array (
                    array (
                        'id'=> 'xx_submenu1'
                        'url'=> 'xx_submenu1'
                        'name'=> '하위 메뉴 1'
                    ),
                ),
            );

            $ config [ 'nav'] [] = $ nav;

            return $ config;
        }));

    이렇게 app.config.nav 메뉴 배열을 추가하여 메뉴를 늘릴 수 있습니다.
    반대로 필요없는 항목이 배열로부터 삭제 해 주면 제거 할 수 있습니다.

    EC-CUBE3를 이용하시는 분은 꼭보세요.

    Facebook [ja]コメント 

  • Q: [EC-CUBE 2.x] EC-CUBE에서 모든 페이지에서 로그인 체크하기 2019.11.11
    A:
    https://thevos.jp/Manual/57675

    EC-CUBE는 Ver 2.12.6 환경입니다.


    지정 방법

    EC-CUBE는 로그인 판정 결과를 tpl_login라는 변수로 설정하고 일부 페이지가 기본적으로 존재합니다.

    예를 들어, 아래와 같이 소스를 grep하면 tpl_login에 값을 설정하는 부분을 찾을 수 있습니다.

    1
    2
    3
    4
    5
    6
    7
    $ grep -rn "\$this\->tpl_login =" *
    data/class/pages/products/LC_Page_Products_Detail.php:240:            $this->tpl_login = true;
    data/class/pages/frontparts/bloc/LC_Page_FrontParts_Bloc_Login.php:43:        $this->tpl_login = false;
    data/class/pages/frontparts/bloc/LC_Page_FrontParts_Bloc_Login.php:72:            $this->tpl_login = true;
    data/class/pages/shopping/LC_Page_Shopping_Payment.php:95:            $this->tpl_login = '1';
    data/class/pages/shopping/LC_Page_Shopping_Confirm.php:129:            $this->tpl_login = '1';
    data/class/pages/cart/LC_Page_Cart.php:200:            $this->tpl_login = true;

    위의 이름에서 짐작이 붙는 것처럼, 상품 상세 페이지 로그인 블록, 장바구니 페이지, ... 등 특정 페이지를 표시 할 때 사용되는 클래스인데,이 페이지에서는 변수 tpl_login에 설정된 로그인 있는지 (true) 아닌지 (false) 결과에 따라 다음과 같이 템플릿의 표시를 분리 할 수 ​​있습니다.

    1
    2
    3
    4
    5
    <!--{if $tpl_login}-->
    ログイン中です。
    <!--{else}-->
    ログインしていません。
    <!--{/if}-->

    그런데, 이것을 특정 페이지에 한정하지 않고 어떤 페이지에서도 사용할 수 있도록하자.

    페이지 볼 때마다 호출되는 LC_Page라는 기본 클래스 LC_Page (data/class/pages/LC_Page.php)가 있습니다. 그 확장 클래스인 LC_Page_Ex (data/class_extends/page_extends/LC_Page_Ex.php)에 다음과 같은 코드를 추가합니다.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    public function init()
    {  
        parent::init();
        // ログイン判定
        $objCustomer = new SC_Customer_Ex();
        if ($objCustomer->isLoginSuccess() === true) {
            $this->tpl_login = true;
        }  
    } 

    이제 어떤 페이지에서나 tpl_login에 로그인 판정 결과가 저장 되도록 되었습니다.

    마찬가지로 LC_Page_Ex에 어떤 처리든 추가하면 전체 페이지 공통으로 정보를 설정하는 것이 가능합니다.  

    알아두면 유용한 곳이 많을 듯합니다.

    Facebook [ja]コメント 

  • Q: [EC-CUBE 2系] イベントセット販売プラグインマニュアル 2019.11.07
    A:
    https://thevos.jp/Manual/57605

    イベントセット販売プラグインマニュアル | THEVOS

    作成日：2019年 10月 29日 火曜日

    24時間／365日技術サポート: あなたが直面している問題を教えてください。

    イベントセット販売プラグインをお買い上げいただきありがとうございます。このユーザーマニュアルの範囲を超えてのご質問があれば、オンライン無料相談にお問い合わせください。無料相談

    プラグインのインストール

    管理者としてログインして、管理者メニューから「オーナーズストア」メニューのサブメニューの上部にある「プラグイン管理」メニューをクリックして、プラグインの登録を行います。

    1-1. メニュー選択画面：オーナーズストア>プラグイン管理
    • プラグイン登録
      1. ファイルの選択ボタンをクリックします。
      2. 登録するファイル（EventSetSale.tar.gz）を選択し、開くをクリックします。
      3. インストールのボタンをクリックして、待って、インストールを待ちます。
      4. 下の1-2画面の①の赤長方形のボックスのように表示されたら、通常のインストールがされました。
        1-2.インストール完了画面：通常のインストールが完了した画面
      5. プラグインの基本的な設定をするために②プラグインの設定をクリックして設定画面を開いて、各値を入力して設定します。
      6. インストールされてプラグインを動作させるために1-2画面の③有効チェックボックスをクリックしてチェック 表示をします。

    プラグイン設定

    プラグイン管理でインストールが完了したら、プラグインの基本設定をするために②「プラグイン設定」をクリックして設定画面を開きます。

    2-1.プラグイン設定メニュー選択画面


    イベントセット販売機能の詳細な設定をします。

    2-1.プラグイン設定画面

      画像サイズ設定

      1. 画像サイズ設定：1つのイベントブロックのサイズを設定します。
        ※サイズを入力時に必ずpx、または％を正確に入力する必要があります。
        横：ページに表示される水平方向のサイズを入力します。
        縦：ページに表示される高さのサイズを入力します。
      2. 表示順序：各イベントの表示順序を設定します。
        • 設定順：イベントセット販売機能管理画面で登録済み一覧に並べた順に、各イベントを表示します。
        • ランダム順：登録済み一覧に配置させた順序を無視して、プラグイン内部でランダムに各イベントを表示します。
        • 表示個数：登録した各イベントを表示するページに表示するイベントの数を設定します。
          表示する数の数字のみを入力します。
          ※ 0を入力した場合、すべて表示します。

    イベントセット販売機能管理

    イベントセット販売機能では、各イベントセットの登録・編集・削除を管理します。

    イベントセットを登録または管理のために「商品管理」メニューから「イベントセット機能管理」メニューを選択します。

    3-1.イベントセット機能管理メニュー選択画面

      イベントセット機能管理画面説明

      3-2.イベントセット機能管理画面
      1. ①マニュアルボタン：ユーザーマニュアルを見ることができます。
        3-3. マニュアル画面

      2. イベントセット名：各イベントを区別するためのタイトルを入力します。

      3. イベントバナー用画像（背景画像）：各イベントバナー用の背景画像を登録します。
        • ② ファイルを選択ボタン：クリックして自分のPCで登録するイベントバナー用の背景画像を探して選択します。
        • ③ アップロードボタン：選択されたイベントバナー用の背景画像をサーバーにアップロードして登録します。
        • ④ 画像の取り消しボタン：登録されたイベントバナーの背景画像を削除します。

      4. イベントタイトル：各イベントごとのイベントの大きな文字で表現するタイトルの文章を入力します。
        3-4. イベントタイトル表示画面

        お客様に表示されるイベント画面には、上の画面の黒い破線ボックスの中のようイベントタイトルが表示されます。プレーンテキストとHTML・CSS・jQuery・Javascriptが使用可能で、デザインを自由にすることができます。

      5. イベントメッセージ：各イベントごとのイベントの条件、案内などを簡単に入力します。
        3-5. イベントメッセージ表示画面

        お客様に表示されるイベント画面には、上の画面の黒い破線ボックス眼科ように表示されます。プレーンテキストとHTML・CSS・jQuery・Javascriptが使用可能で、デザインを自由にすることができます。

      6. カートに入れるボタン名：各イベントごとのイベントの申請ボタン名を入力します。
        3-6. カートに入れるボタン名表示画面

        お客様に表示されるイベント画面には、上の画面の黒い破線ボックス眼科ように表示されます。ボタンに表示される文章を自由にすることができます。ボタンの色と文字サイズボタンのサイズも自由に変更することができ、この場合は、カスタマイズ編を活用してください。

    イベントセット適用

    イベントセット適用は、블록으로 구성되어 각 페이지의 원하는 장소에 삽입 가능하며 별도의 페이지를 만들기도 가능합니다。

    4-1.イベントセット適用画面

    カスタマイズ

    Facebook [ja]コメント 

  • Q: [EC-CUBE 4系] EC-CUBE4系で管理画面に新規メニュー項目を追加する方法 2019.10.28
    A:
    https://thevos.jp/Manual/48400

    今回は商品管理の一番下に新規メニュー項目を追加することを考えます。
    まずメニューから開けるページが必要ですのでコントローラーを作成し、新しいページを作った後でそのページをメニューに追加してみましょう。今回はeccube_nav.yamlを編集するもっとも簡単な方法をご紹介します。

    管理画面に新規ページを作る方法は下記URLで紹介しています。
    管理画面に２ステップで新規ページを作る方法

    それでは、このページを商品管理のメニューに追加してみます。

    初期状態での管理画面のメニュー一覧はapp/config/eccube/packages/eccube_nav.yamlに配列として記載されています。
    商品のメニュー部分は下記のようになっています。

    parameters:
    eccube_nav:
        product:
            name: admin.product.product_management
            icon: fa-cube
            children:
                product_master:
                    name: admin.product.product_list
                    url: admin_product
                product_edit:
                    name: admin.product.product_registration
                    url: admin_product_product_new
                class_name:
                    name: admin.product.class_management
                    url: admin_product_class_name
                class_category:
                    name: admin.product.category_management
                    url: admin_product_category
                product_tag:
                    name: admin.product.tag_management
                    url: admin_product_tag
                product_csv_import:
                    name: admin.product.product_csv_upload
                    url: admin_product_csv_import
                category_csv_import:
                    name: admin.product.category_csv_upload
                    url: admin_product_category_csv_import
                #商品管理に新規メニュー追加

    category_csv_importの下に次のように追記することでメニューを追加することができます。

    product_new_menu:
    name: 新メニュー
    url: admin_new_menu

    new_menuはメニューにつけるID名で、このメニューをアクティブにしたい時にtwigから指定します。
    nameは表示する名称
    urlはコントローラーのRouteで指定したURLの名前です。

    動作検証

    これで管理画面にアクセスするとカテゴリCSV登録の下に新規メニューが追加されました。twigでメニューの位置を指定しているのでアクティブ表示になっています。

    メニュー追加

    eccube_nav.yamlを編集するとバージョンアップの際に上書きされてしまう可能性があります。
    大きなカスタマイズをするとバージョンアップできない可能性も高いですが、バージョンアップをご検討の方はEccubeNav(NavCompilerPass)の仕組みを利用するか、app/config/eccube/packages/prodなどに複製して用いると良いかもしれません。

    Facebook [ja]コメント 

  • Q: [EC-CUBE 2.x] EC CUBEで商品ごとに支払い方法を簡単に分ける 2019.10.28
    A:
    https://thevos.jp/Manual/48360
    EC CUBEで支払い方法を分けるのに大きなカスタマイズが必要だと思っていましたが、
    以下の設定で簡単に振り分けが出来ましたのでご紹介します。

    まずEC CUBE管理画面にログインし、システムデータ＞マスターデータに進みます。
    マスターデータから「mtb_product_type」を選択します。

    ffd01.JPG
    デフォルトでは1と2が設定されていますので、追加のデータにIDと値を記載します。

    ffd02.JPG

    追加できたら基本情報＞支払い方法に進み任意の設定を追加します。ffd03.JPG

    その後配送方法設定に進み、それぞれの取扱商品種別＆取扱支払方法を設定した配送方法を作ります。
    同じ名称は設定できないようなので「ゆうパック」「郵パック」のようにしました。

    ffd04.JPG
    ffd05.JPG

    もし別々の商品を同じカゴにいれた場合は別々に決済をしてもらう形になります。
    カスタマイズなしでここまでできるのは便利だな～とおもいました！

    Facebook [ja]コメント 

  • Q: [EC-CUBE 2系] 2.13系 ソフトウェア要件 2019.10.11
    A:
    https://thevos.jp/Manual/42088
    分類 ソフトウェア 動作確認済み
    WEBサーバ IIS 7.0～
    Apache 2.0.x～ 2.2.x～
    言語 PHP 5.2～
    データベース PostgreSQL 8.1.4～ 9.x～
    MySQL 5.0.x～

    必須PHPライブラリ

    • pgsql / mysql
    • gd
    • freetype2
    • mbstring
    • zlib
    • ctype
    • spl (PHP 5.3.0 未満の場合)
    • session

    推奨PHPライブラリ

    • JSON(PHP5.2以降でオーナーズストアを使用する場合は必須)
    • xml(プラグイン機能を使用する場合は必須)
    • OpenSSL
    • cURL
    • hash
    • mhash (PHP 5.3.0 未満の場合)
    • mcrypt
    • zip

    Facebook [ja]コメント 

  • Q: [EC-CUBE 2系] ECCUBE 2.13のインストール方法をスクリーンショット付きでわかりやすく徹底解説！ 2019.10.10
    A:
    https://thevos.jp/Manual/41703

    EC-CUBE v2.13 インストール에 대한 이미지 검색결과


    「EC-CUBE」とは、ECサイトに必要なカート機能や決済機能がパッケージ化されている、無料のツールです。ECサイトを運営したことがある人なら、きっと知っている人も多いはず。あとはWebサーバーさえあれば、わりと簡単にECサイトを立ち上げることができます。これからECサイトをはじめる方向けに、EC-CUBE バージョン2.13のインストール方法を、各画面のスクリーンショット付きでわかりやすく解説します。

    まずはダウンロード

    EC-CUBEサイトから、ZIPファイルをダウンロードしましょう。（この記事では、バージョンは2.13.2です。）

    なお、ダウンロードには会員登録が必要です。

    ECCUBEダウンロード

    つづいてメンバー登録

    ECCUBE 新規メンバー登録

    「eccube-2.13.2.zip」がダウンロードできたら、解凍してみましょう。
    すると、下記のようにいろいろなファイルが入っているはずです。
    このうち「data」と「html」の2つだけを、Webサーバーにアップロードしましょう。

    ECCUBE解凍フォルダ

    アップロード

    アップロードする前に、FTPソフトの設定でアップロード時のパーミッションを指定しておくことをおすすめします。
    ファイルは「644」、ディレクトリは「755」で設定しておきましょう。

    なお、data はセキュリティの面で、一般のユーザーから見えない階層にアップしたほうが良いです。

    私の場合はこんな感じ↓

    /root/data（＝一般のユーザーは見れない領域）
    /root/www/html（＝www配下は一般のユーザでも見れる領域）

    define.phpを編集

    私の場合は data と html が同階層でなくなったので、html 内の define.php を変更する必要があります。
    （data と html が同階層であれば、変更する必要はありませんので、このステップは飛ばして構いません）

    html ディレクトリから見た、dataディレクトリの相対パスを指定しましょう。

    [php]
    /** HTMLディレクトリからのDATAディレクトリの相対パス */
    define(‘HTML2DATA_DIR’, ‘../../data/’);
    [/php]

    データーベースを作成

    ECCUBEのインストール時にはデータベースの情報を求められますので、あらかじめ用意しておきましょう。

    ここでは私が利用しているさくらサーバーでのやり方をご紹介します。

    コントロールパネルにログイン。

    左ナビから「データベースの設定」を選択。

    データーベースの設定を選択

    「データベースの新規作成」を選択。

    データベースの新規作成を選択

     

    データーベースの情報を設定します。
    MySQLのバージョンは「5.5」、
    データベース名は、自由に命名してください。
    文字コードは「UTF-8」にします。

     

    データーベースの情報を入力

    これでデータベースが作成されました！

    ECCUBEのインストール画面

    先ほどアップした「html」ディレクトリにアクセスしてみましょう。

    パーミッションとdefine.phpのパスが正しく設定されていれば、次の画面が現れるはずです。

    ECCUBE インストール

    ECCUBE - インストール02

    ひとまず必須項目を入力していきます。
    これらの項目はインストール後でも管理画面から変更できます。

    ECCUBE - インストール04

    先ほど作成したデータベースの情報を入力していきます。
    さくらのコントロールパネルのデータベース一覧画面を参照してコピペしましょう。

    ECCUBE - インストール05

    つづいて、データベースの初期化を行います。（ちょっとドキドキ）

    ECCUBE - インストール06

    データベースの初期化に成功しました。

    ECCUBE - インストール07

    情報提供を送信するかをたずねられますが、これはどちらでも構いません。

    ECCUBE - インストール08

    以上でインストールが完了しました！

    ECCUBE - インストール09

    htmlディレクトリにアクセスすると、デフォルトのストアページが表示されるはずです。

    ECCUBE - 初期サイト

    次回は、管理画面から商品情報を変更してみます。

    Facebook [ja]コメント 

書き込む
Board Pagination Prev 1 2 Next
/ 2

お客様のビジネススタイルの価値を大切にする企業THEVOSです。 THEVOSは、お客様との緊密な外部ITチームです。

株式会社ザボスECO研究所

  • 〒812-0029　福岡市博多区古門戸町10-5-501
  • 日本：080-3984-5969 韓国：070-4809-0019
  • webmaster@thevos.jp

Copyright © 2009/2024 株式会社ザボスECO研究所. All Rights Reserved.

Design by THEVOS
CLOSE