フォーラムへの返信
-
投稿
-
よくある質問を参照してください。
https://digipress.info/manual/f-a-q/#_Unauthorized誘導先URLにショートコードを指定するとはどういうことでしょうか。
ボタンのURLはアンカーテキストの href 値ですのでショートコードなどは根本的に指定できません。パララックスコンテンツ内でショートコードを利用する場合は「説明文」または「オリジナルパララックスコンテンツ」用テキスト欄で指定してください。
https://digipress.info/manual/each-theme-manual/functions-macchiato/#i-42
https://digipress.info/manual/each-theme-manual/functions-macchiato/#i-50ESCENAではPCとモバイルテーマでヘッダー画像を分けることはできません。
設定内容は共通です。個別のカスタマイズ要件については以下を参考にご自身にて設定を行ってください。
または、弊社に具体的な作業を依頼される場合は有償サポートをご検討ください。
サーバー側の問題です。
過去トピックを参照してください。もしくは、promoboxの styleパラメータでインラインでCSSを指定するなどしてください。
[promobox column=2 plx="enter right" style="text-align:left;"] : [/promobox]プロモーションボックスショートコードのレイアウトはアイコン(または画像)の配置によって決定されます。
https://digipress.info/manual/shortcode-list/13/#i-6これを変更する場合はプロモーションボックスショートコードの [ promobox ] のclassパラメータに al-c, al-r, al-l から目的のセレクタを指定してください。
https://digipress.info/manual/shortcode-list/13/#promobo
https://digipress.info/manual/html-decoration/2/#i-7これはJetpackプラグインのPhotonの操作によるものであり、これはテーマ側で対処できるような問題ではありません。
画像自体の解像度の問題です。テーマは関係ありません。
Retinaのような高精細ディスプレイでは、実際に表示するサイズの2倍の解像度が必要です。例えば 幅:500ピクセル、縦400ピクセルのサイズで画像を表示する場合、高精細ディスプレイを考慮すれば実際の画像はその倍の 1000(幅) x 800(高) ピクセルの画像を用意する必要があります。
※1000x800pxの画像を500x400pxで表示する。厳密には、mod_pagespeedによって軽量化されたはずのJavascriptが正常に動作できるよう最適化されておらず、エラーが発生してJavascriptが機能していないためです。
JavaScript関連の処理はまだ完璧とはいえず、最適化するとブラウザでエラーが出たりうまく動作しなかったりする場合もあるようです。そういう問題が出た場合は、JavaScriptの最適化を止めたり、一部のディレクトリに対してのみmod_pagespeedを適用しないようにするなどするといいでしょう。
オンラインドキュメントに掲載しています。
ブラウザの幅いっぱいにパララックスエフェクトを伴って表示される仕様となっており、スクロールによって画像が見切れないよう、ヘッダーエリアに表示される画像のサイズは画像のサイズ(縦、横)を元にして常に動的に計算されます。
このため、表示される端末ごと(ブラウザの表示サイズ)によってどこまでが可視エリアとして表示されるかは異なるため、「最適なサイズ」というものはありませんが、幅いっぱいに表示されることと高精細ディスプレイを考慮した場合、最低でも1500ピクセル幅の画像が望ましいといえます。
あまり大きすぎるアイキャッチ画像となると読み込み時間にも影響するため、解像度とファイルサイズのバランスを考慮する必要があります。
また、アイキャッチ画像は以下のようなプラグインでアップロードと同時に自動的に軽量化することをおすすめします。なお、アイキャッチが表示されるヘッダーエリアのサイズは、最低高が 350ピクセル、高さ自体は ビューポートに対して 56% の高さ(height:56vh) が規定です。
アイキャッチ画像のパララックス(視差)効果を伴わなくても良い場合は、以下をオリジナルCSS設定に付きすることで表示幅を100%固定とすることができます。
.ct-hd .plx_bg { background-size:100% auto!important; background-position:0!important; }
