Retina画像対応、動作も安定、jQuery非依存で軽量の「image-map-resizer」
<script src="https://cdnjs.cloudflare.com/ajax/libs/image-map-resizer/1.0.10/js/imageMapResizer.min.js"></script> <script> imageMapResize(); </script>
アーカイブ年: 2021
- EC-CUBE
- 4.0.5
- サーバーOS
- Linux xserver.jp
- DBサーバー
- MySQL 10.5.11-MariaDB-log
- WEBサーバー
- Apache
- PHP
- 7.4.13
ファビコンを変更
<link rel="icon" href="/html/user_data/assets/img/common/favicon.ico">
FTPでダイレクトに置き換え
- EC-CUBE
- 4.0.5
- サーバーOS
- Linux xserver.jp
- DBサーバー
- MySQL 10.5.11-MariaDB-log
- WEBサーバー
- Apache
- PHP
- 7.4.13
コンテンツ管理＞ブロック管理＞ロゴ
logo.twig
<div class="ec-headerTitle">
<div class="ec-headerTitle__title">
<h1>
<a href="{{ url('homepage') }}">
{{ BaseInfo.shop_name }}
</a>
</h1>
</div>
</div>
コンテンツ管理＞CSS管理
/* カスタマイズ用CSS */
.ec-headerTitle .ec-headerTitle__title a {
font-family: "Book Antiqua", Palatino, "Palatino Linotype", "Palatino LT STD", Georgia, serif;
font-size: 32px;
font-style: normal;
font-variant: normal;
font-weight: normal;
color: #1F4E79;
}
.ec-headerTitle .ec-headerTitle__title a span {
font-size: 37.34px;
color: #2E75B6;
}
参考
WordPressのプラグインで評判のいい『シンタックスハイライト』は「Highlighting Code Block」だが、ブロックエディタとか、ビジュアルエディタでの運用のみになっていて、テキストエディタ（HTML）では動作しない。
以下、「Crayon Syntax Highlighter」「Code Prettify」「WP Code Prettify」も同様。
「Syntax Highlighter Evolved」はテキストエディタ（HTML）でも動作する。
ショートコード［code］で括ること。＜code＞ではダメ。
参考
SyntaxHighlighter Evolved – 記事の中でソースコードを綺麗に表示できるWordPressプラグイン
- EC-CUBE
- 4.0.5
- サーバーOS
- Linux xserver.jp
- DBサーバー
- MySQL 10.5.11-MariaDB-log
- WEBサーバー
- Apache
- PHP
- 7.4.13
現象
Chromeのデバッガーで『Access to CSS stylesheet at ‘https://use.fontawesome.com/releases/v5.3.1/css/all.css’ from origin ‘https://xxx.jp’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.』というエラーが出る。
で、当然のことながらアイコンが出ない。
解決
/xxx.jp/public_html/.htaccess
SetEnvIf Origin "^https?://(www\.)?(fontawesome.com)$" ORIGIN=$0
Header set Access-Control-Allow-Origin %{ORIGIN}e env=ORIGIN