Magento2 独自スタイルシートの読み込み
をテンプレートにして作成
[
トップ
] [
新規
|
一覧
|
検索
|
最終更新
|
ヘルプ
]
開始行:
[[Magentoめも]]
Magento2ではスタイルシートは[[LESS:http://less-ja.studiom...
LESSが分かれば断然その記述で書くことが効率的なのはわかり...
まずは[[Magento2 themeの作成]]でテーマを作成しておきます。
*CSSファイル設定 [#x4111248]
以下のパスに default_head_blocks.xml を設置します。~
app/design/frontend/Yassujp/blank/Magento_Theme/layout/
default_head_blocks.xml
<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instan...
<head>
<css src="css/custom.css"/>
</head>
</page>
*CSSの記述 [#l4432f8b]
以下のパスに custom.css を設置します。~
app/design/frontend/Yassujp/blank/web/css/
custom.css
body {
color: pink;
}
*静的ファイルのデプロイ [#zb87c5f9]
以下のコマンドで静的ファイルをデプロイします。
php bin/magento setup:static-content:deploy
デプロイ先は以下になります。~
pub/static/frontend/Yassujp/blank/en_US/css/custom.css
更新されない場合は削除してしまって再度コマンドを叩きまし...
# rm -fr pub/static/frontend/Yassujp/
*キャッシュファイルのクリア [#jb87b952]
SYSTEM - Cache Management からキャッシュをクリアします。
これで公開画面の文字がピンク色になっていればOKです。
終了行:
[[Magentoめも]]
Magento2ではスタイルシートは[[LESS:http://less-ja.studiom...
LESSが分かれば断然その記述で書くことが効率的なのはわかり...
まずは[[Magento2 themeの作成]]でテーマを作成しておきます。
*CSSファイル設定 [#x4111248]
以下のパスに default_head_blocks.xml を設置します。~
app/design/frontend/Yassujp/blank/Magento_Theme/layout/
default_head_blocks.xml
<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instan...
<head>
<css src="css/custom.css"/>
</head>
</page>
*CSSの記述 [#l4432f8b]
以下のパスに custom.css を設置します。~
app/design/frontend/Yassujp/blank/web/css/
custom.css
body {
color: pink;
}
*静的ファイルのデプロイ [#zb87c5f9]
以下のコマンドで静的ファイルをデプロイします。
php bin/magento setup:static-content:deploy
デプロイ先は以下になります。~
pub/static/frontend/Yassujp/blank/en_US/css/custom.css
更新されない場合は削除してしまって再度コマンドを叩きまし...
# rm -fr pub/static/frontend/Yassujp/
*キャッシュファイルのクリア [#jb87b952]
SYSTEM - Cache Management からキャッシュをクリアします。
これで公開画面の文字がピンク色になっていればOKです。
ページ名: