タグ付けされた質問 「css」

MagentoのコンテキストでのCSSに関する質問


3
Magento 2:style-m.cssとstyle-l.css
Magento2ではどのようにstyle-m.cssしてstyle-l.cssファイルが生成されますか? 理論的にstyle-m.cssは、モバイルデバイスstyle-l.cssへのロードを高速化するよりも、コードが少なく、モバイルデバイス専用のスタイルを持つべきです。 コードの一部をの一部にstyle-m.cssするstyle-l.cssか、または一部にする必要がある場合、より少ないファイルでどのように定義しますか? 次のリンクとソースコードは、それを理解するのに役立ちませんでした。 リソース: http://devdocs.magento.com/guides/v2.0/frontend-dev-guide/css-topics/css-preprocess.html Magento2:cssファイルを変更するためのベストプラクティス http://inchoo.net/magento-2/css-preprocessing-in-magento-2/
10 magento2  layout  css 

6
Magento 2-どこでも!importantを使用せずにCSSをオーバーライドする
現在、クライアントのためにMagento 2サイトに取り組んでいます。私のクライアントのブランドがboofarあり、拡張/上書きしようとしているテーマがfoobar私が使用して親テーマとして設定したと仮定しますfrontend/Foobarthemes/boofar/theme.xml <theme xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Config/etc/theme.xsd"> <title>Boofar</title> <parent>Foobarthemes/foobar1</parent> <media> <preview_image>media/preview.jpg</preview_image> </media> 次にfrontend/Foobarthemes/boofar/web/css/source/_theme.less、オーバーライドするCSSコードを記述しました。これもで試しました_extend.less。 .magicmenu { .home { display: none !important; } .nav-desktop .level0 .level-top > span { font-size: 12px; font-weight: normal; text-transformation: none; } } 私は!importantここで働くために何でも使うことを強いられます。上記のコードでは、フォントやテキストは機能しません。 Magento 2のフロントエンドワークフローを正しく理解していませんか?

2
Magento 1.9:カスタムCSSファイルをヘッドに追加
MagentoにカスタムCSSファイルを追加して、サイト全体で使用する必要があります。これをlocal.xmlファイルに追加する必要があることはわかっていますが、追加したスタイルシートが読み込まれていません。 助けることができる誰か? これが、local.xmlファイルに追加したものです。 <?xml version="1.0"> <layout> <default> <reference name="head"> <action method="addCss”><type>skin_css</type><file>css/javcustom.css</file></action> </reference> </default> </layout> ここには多くのトピックがあることは知っていますが、すべて試しましたが、うまく機能しません...
10 magento-1.9  css 

3
Magento 2での空白のテーマスタイルの上書き
Magento 2の空白のテーマから継承する場合、カスタムテーマのナビゲーションスタイルをどのようにオーバーライドしますか? フォルダーにtheme.cssファイルがありますが、app/design/frontend/<Vendor>/<theme>/web/cssMagento 2ではLESSが使用されていることを認識しています。theme.cssスタイルシート内のスタイルは簡単に上書きできますが、を使い続ける必要はありません!important。 また、私はBootstrap 3を使用していますが、空のテーマのスタイルが、Bootstrapで一致するスタイルの指示を上書きすると想定しています。これに取り組む最善の方法は何ですか?
10 magento2  overrides  css  less 

1
特定のブロックJS(およびCSS)を追加する方法-_正しい_方法?
だから私は文字通り何時間もグーグルで読んだり、電気ショック療法を勉強したりしましたが、誰も(アランストームさえも)これを私に綴った人はいません。インターネット全体がMagento 2の特定のページにJSまたはCSSを追加することに関心があるようですが、私が探しているのは、JS / CSSを特定のブロックに追加することです。 だから、ここに一言で私の質問があります: 特定のブロックにJS(およびCSS)を追加する最良の方法は何ですか。ブロックがページ(*)に存在する場合、JS / CSSがロードされ、ブロックがそこにない場合、CSS / JSはありません。 ? *つまり、layout.xmlを介してページ/テンプレートに、モジュールのカスタムページに、ブロック/ページのtoHtmlメソッドを介して、または最も重要なこととして、カテゴリのWYSIWYGに埋め込まれたブロックを設定できます。 /製品の説明/ CMSブロック/ CMSページ。 私はアランの素晴らしい記事の ALOTを読みました(この人に再び賞賛します!)、これに関する他の記事の連は言うまでもありませんが、誰もが特定のページに追加したいと思うような気がします。ブロックが使用されます。 私はさまざまなテクニックに精通しているように感じますが、ここで何か不足している可能性があるので、コミュニティからのコンセンサス、およびおそらくすべてのフロントエンドからフルスタックの開発者までの看板を少し探してください。私と同じような質問と選択肢を考えます。 以前は、Magento 1では、ブロックコンストラクターを調べ、レイアウトを取得し、ヘッド参照を取得して、そこでaddJs / addCssを呼び出すか、可能であれば、layout.xmlのメソッドを使用していました。これは、JSがブロックコンストラクターのリソースリストに「追加」されたことを意味します(テーマレベルがヘッドブロックを出力する前に)。しかし、これは今では不可能のようです。 私はJS / CSSを追加する方法について読みました(これは単純な「方法は?」ではありません。これはより簡潔な「正しい/ mag2の方法は何ですか???」)、これらに精通しています。テクニック: /view/[area]/layout/[default/page_id].xmlテクニック、<head></head>ルート要素を使用 モジュールにHeadブロックを追加し、head.additionalに追加し、ブロックが読み込まれているかどうかに関する何らかのロジックを追加する \ Asset \ GroupedCollectionオブジェクトと\ Asset \ Repositoryオブジェクトを使用して、ページ/テンプレートのcustructorから挿入します(ただし、これはブロックとorkしていないようです)。 RequireJSを使用してrequireJS構成をモジュールに適用する 何か逃したことがありますか? 正しい方法は、RequireJSライブラリと、x-magento-init属性を使用するかrequire("my_module", function(){ ... })、インラインスクリプトに構文を持つスクリプトだけを使用することだと考えています。しかし、これは私には不器用に思えますか?私はスクリプトをロードするためにスクリプトをセットアップする必要があり、少なくとも私のJSのいくつかをインライン化することを余儀なくされていますが、これを私のphtmlにポップすることによって、「ここが私のブロックです。 ただし、PHPを介してこれを実行できるようにしたいのですが、JSをカプセル化し、(理想的には)フロントエンドチームがこれを好きなように書けるようにするバックエンド/スタックプログラマーとして理想的です。要するに、ロードの処理に注意してください(バックエンド開発からフロントエンド開発までは「phtmlをここに置き、必要に応じてテーマでオーバーライドします。同様に、jsファイル、その依存ライブラリ、およびブロックのCSSをここに置きます」)。 これは、__construct資産システムに依存性を注入する方法を示唆しています。ただし、これを機能させることはできません。これは、ここのAlan Stormsのクイック記事で確認されているようです:Magento Quickies:Magento 2:プログラムによるフロントエンドアセットファイルの追加 「したがって、フロントエンドアセットを一緒に運ぶブロックを作成することについての考えは窓の外にあります」に注意してください。...つまらない:( お読みいただき、ご検討いただき、ありがとうございます。ご返信をお待ちしております。 PS>明らかに、これはStackExchangeなので、私が達成しようとしていること(特定のリソースの読み込みをブロックする)の最良のコースとして回答をマークしますが、すべての回答を投稿の下部に参照としてリストするように努力しますディスカッションに追加するか、解決策を提案します!

2
Magento 2-カスタムテンプレートファイルを<head>に追加するにはどうすればよいですか?
magento 1.xでは、以下のコードのようなヘルパーを使用してcssファイルをヘッドに追加できます。 &lt;reference name="head"&gt; &lt;action method="addCss"&gt;&lt;stylesheet helper="module/helperclass/helperfunction"/&gt;&lt;/action&gt; &lt;/reference&gt; Magento 2ではできません。 そこで、このコード&lt;link rel="stylesheet" type="text/css" media="all" href="&lt;?php echo $_helper-&gt;getCSSFile()?&gt;"&gt;を「after.body.start」コンテナに追加しました。 カスタムテンプレートファイルをに追加するにはどうすればよい&lt;head&gt;ですか?
9 magento2  layout  css 

3
Magento 1.9.1.0-WysiwygエディターでPDFファイルタイプをアップロードし、PDFアイコンを表示
ユーザーがで.PDFファイルタイプをアップロードできるカスタムモジュールを作成しましたCMS &gt; Pages。使用されるコードは以下のとおりです。 app / etc / modules &lt;?xml version="1.0"?&gt; &lt;config&gt; &lt;modules&gt; &lt;Pdf_WysiwygFiles&gt; &lt;active&gt;true&lt;/active&gt; &lt;codePool&gt;local&lt;/codePool&gt; &lt;/Pdf_WysiwygFiles&gt; &lt;/modules&gt; &lt;/config&gt; app / code / local / Pdf / WysiwygFiles / etc / config.xml &lt;?xml version="1.0" encoding="UTF-8"?&gt; &lt;config&gt; &lt;modules&gt; &lt;Pdf_WysiwygFiles&gt; &lt;version&gt;1.0.0&lt;/version&gt; &lt;/Pdf_WysiwygFiles&gt; &lt;/modules&gt; &lt;adminhtml&gt; &lt;cms&gt; &lt;browser&gt; &lt;extensions&gt; &lt;allowed&gt; &lt;jpg&gt;1&lt;/jpg&gt; &lt;jpeg&gt;1&lt;/jpeg&gt; &lt;png&gt;1&lt;/png&gt; &lt;gif&gt;1&lt;/gif&gt; &lt;pdf&gt;1&lt;/pdf&gt; …
9 magento-1.9  cms  css  pdf  wysiwyg 


4
ブロックのモジュールlayout.xmlを使用してCSSおよびJSを<head>に追加する
あらすじ グループ化された製品ビューと単純な製品ビューにブロックを追加したいと思います。このブロックには、ホバー状態の便利なツールチップがいくつかあります。私は、1つのjqueryプラグインと1つのcssスタイルシートを持つ小さなライブラリを使用しています。 これらの2つのリソースを、これらのページのみのmagentoのに含めたいと思います。 ノート カスタムテーマを実行しています。 キャッシュは無効です。そして 私のファイルは/jsディレクトリ内にあります。 これまで… それでもlayout.xml、モジュールで使用する方法の1つであることがわかっていました。最初はこれが機能しなかったのでconfig.xml、レイアウト要件についてMagentoに通知するために内部に追加の設定が必要だと思いました-これも機能しませんでした。 動作しませんでした私が何を意味するか私の資産がロードされなかった、です。 下記の添付ソースを見つけてください。 app / code / local / Vendor / Rating / etc / layout.xml &lt;?xml version="1.0"?&gt; &lt;layout&gt; &lt;default&gt; &lt;reference name="head"&gt; &lt;action method="addJs"&gt; &lt;script&gt;vendor/qtip/jquery.qtip.min.js&lt;/script&gt; &lt;/action&gt; &lt;action method="addCss"&gt; &lt;stylesheet&gt;vendor/qtip/jquery.qtip.min.css&lt;/stylesheet&gt; &lt;/action&gt; &lt;/reference&gt; &lt;/default&gt; &lt;/layout&gt; app / code / local / Vendor / Rating …

4
MIMEタイプが一致しないため、Magento2 CSSがブロックされました(X-Content-Type-Options:nosniff)
xamppを使用するWindows 10でMagento 2を使用しています。 私はmagento2をインストールしましたが、完全に実行されていました。その後、移行ツールを使用してmagento1からデータを移行します。 「(CSSパス)」からのリソースでエラーが発生しました。MIMEタイプの不一致(X-Content-Type-Options:nosniff)が原因でブロックされました。 キャッシュとインデックスを更新して、静的コンテンツを何度もデプロイしようとしました。URLの書き換えはすでにオンになっています。 誰か私を助けてくれますか? ありがとう
9 magento2  css 

3
データURIとCSSファイルのマージに関する問題
Mage_Core_Model_Design_Package(beforeMergeCss)のRegExが期待どおりに機能しないため、Magento CSSファイルのマージはホスト名を私のdata-urisに見せかけています。ホスト名を相対画像パスの前に付加する必要がありますが、データURIの前には付加しません。 $cssUrl = '/url\\(\\s*(?!data:)([^\\)\\s]+)\\s*\\)?/'; $contents = preg_replace_callback($cssUrl, array($this, '_cssMergerUrlCallback'), $contents); CSSコード: background: #fafafa url("data:image/svg+xml;base64, PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSI2cHgiIGhlaWdodD0iM3B4IiB2aWV3Qm94PSIwIDAgNiAzIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA2IDMiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxwb2x5Z29uIHBvaW50cz0iNS45OTIsMCAyLjk5MiwzIC0wLjAwOCwwICIvPjwvc3ZnPg==") no-repeat; マージ後の結果: background: #fafafa url("http://shop12.dev/skin/frontend/shop/default/styles/data:image/svg+xml;base64")PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSI2cHgiIGhlaWdodD0iM3B4IiB2aWV3Qm94PSIwIDAgNiAzIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA2IDMiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxwb2x5Z29uIHBvaW50cz0iNS45OTIsMCAyLjk5MiwzIC0wLjAwOCwwICIvPjwvc3ZnPg==") no-repeat; これを回避するには?使用したRegExのシンタックスを修正する方法を見つけることができませんでした。(GIFを使用することは私にとって実際の解決策ではありません)
9 magento-1.8  css  bug  regex 

1
Magento2 CSS IEハッキング
Magento2で、特にIE 8の場合、CSSを追加したい &lt;css src="css/ie-8.css" /&gt; ネイティブソースコードのどこにも見つかりません。
8 magento2  css 

1
スクロールドロップダウンリストに第3レベルのカテゴリを追加する方法
サブカテゴリの長いドロップダウンリストがあり、第3レベルのサブカテゴリも含まれています。私はcssトリックリファレンスを使用して追加しました:https : //css-tricks.com/long-dropdowns-solution/ これで、第3レベルのカテゴリを表示できなくなりました...サブカテゴリのサイドを表示する必要があります。適切なガイドラインを教えてください
8 magento-1.9  php  css  phtml 

3
email-inline.cssでトランザクションメールをスタイルする方法
Magento 1.9.1を使用しています。Magentoトランザクションメールをカスタマイズしたいのですが。これを行うために、ベースパッケージからカスタマイズしたパッケージに(このパス:\ skin \ frontend \ mypackage \ default \ cssに)複製email-inline.cssしemail-non-inline.cssました。 必要な変更を加え、更新されたCSSをアップロードしましたが、システムはカスタムCSSを認識していないかのように、以前と同じデザインでメールが届きます。 私は何をしなければなりませんか?

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.