うなこ
フォーラムへの返信
-
投稿
-
標準のKatawaraトップページスライドショーを使用しない場合に、ご利用できるウィジェットとなります。
使い方としましては、
【01】例えば固定ページなどにスライドエリアへ表示用のお好きなブロックを設置します。
【02】ウィジェットの「スライドウィジェットエリア」に「VK 固定ページ本文」を設置して、【01】で作成した固定ページを選びます。
【03】カスタマイズからKatawaraトップページスライドショーを開き、表示設定部分を「ウィジェットを表示」に変更すると、標準のスライドショーではなく、「スライドウィジェットエリア」へ設置した固定ページ部分が表示できます。junonさまのおっしゃる通り、なにかが影響しているものだとは思いますが、
実装することが難しい場合もございます、、。現時点での代替え案としましてはGoogle デベロッパーツールで
Responsive 320×2000 などのサイズにしていただき
Capture screenshot でキャプチャととり、画面をずらしながら数回スクリンショットをとっていただくか
（最後に合体させる必要がありますが…）
他のスクリンショットツールをご使用いただく形になると思います。スクリンショットはうまくとれないとちょっとストレスですよね…
なにかいい方法がありましたらまた追記したいと思います。以下のクラス名に対してbackground-positionを指定してみてください。
.vk_outer.vk_outer-width-full{ background-position: ○○; }※○○の中はお好みで設定してください。
中央でしたらcenterになります。▼background-position で「右から」とか「下から」などを指定する方法
画像ブロック、アウターブロック、スライダーブロックの方法をそれぞれ書きましたので
お好きな方法で試してみてください。▼画像ブロック▼
設置したimgに対して、cssで width: 100%; を指定してあげるとコンテンツ幅いっぱいに収まるようになります。
↓cssのカスタマイズはこちらの記事を参考にしてみてください。▼アウターブロック▼
アウターブロックの背景画像サイズをカバーにして、
アウターブロックの中に、レスポンシブスペーサーブロックを配置し、
レスポンシブスペーサーの余白の単位をvwにして、
ちょうど良さそうな高さを入れて調整してみてください。▼スライダーブロック▼
背景画像サイズをカバーにして、高さの単位をvw にし、
PC、タブレット、スマホにちょうど良さそうな高さを入れて調整してみてください。以下の方法でいかがでしょうか？お好みの方で実装してみてください。
▼追加CSSで実装する場合
カスタマイズの追加CSSに以下のCSSを入れますと、全てのページの下部が0になります。.l-container_inner { padding-bottom: 0; }トップページのみ効かせたい場合などは、以下のCSSで調整できるかなと思います。
.home .l-container_inner { padding-bottom: 0; }▼デザイン設定機能で実装する場合（添付画像参照）
管理画面の固定ページから、Katawara レイアウト設定がございますので、そちらの「余白設定」の
「サイトコンテンツの上下余白を無しにする」 にチェックを入れますと、上下の余白が無くなります。上の余白も無くなりますので、上の部分に余白を付けたい場合は、レスポンシブスペーサーブロックなどを挿入していただき、お好みの余白を付けてください。
わたしの環境で、試しにベクトルのFBのURLを貼ったところ、表示されました。
リ・バースさまのFBのURLを貼ったところ、表示されないことが確認できました。
調査いたしますので、少々お待ちください。
［追記メモ］
そのほかのFacebookページも問題なく表示されました。
なぜでしょうか、、、？Lightning Variety 2.0.8
気になりましたのがVarietyスキンのバージョンが古いように思います。
現在はLightning Skin Varietyバージョン 10.0.0 が最新となります。プラグインからLightning Skin Varietyを最新版に更新することはできますか？
＞前者の場合 テーマをアップデートすると無効になる
＞後者の場合 テーマをアップデートしても無効にならない
このような違いを生じるのだろうと推察しています。A）ダッシュボード＞外観＞カスタマイズ＞追加CSS
B）ダッシュボード＞ExUnit＞CSSカスタマイズAとBのどちらに書いても、テーマをアップデートしてもcssは反映されます。
Aの場合はテーマを変更すると、そこに記述したCSSは反映されません。
Bの場合はテーマを変更してもそこに記述したCSSは反映されますが、ExUnitを停止すると反映されなくなります。実際、上記の場所へcssを書いてみて、テーマを切り替えてみるとどのような感じか分かると思います。
たくさんcssを書く場合は、子テーマのstyle.css に書く方が楽かもしれません。
Lightningは使っていない場合には、Lightningの子テーマは不要ですよね？
はい、Lightningを使用していない場合はLightningの子テーマは不要です。
今回はLightning Proを使用していますので、Lightning Pro と Lightning Pro用子テーマが必要になります。—————————
＞style.css
「step2」に説明されている通りにTheme nameを書き換える
＞functions.php
親テーマのfunctions.phpをコピペする
—————————子テーマのfunctions.phpに、親テーマのfunctions.phpは複製しなくても大丈夫です。
子テーマのfunctions.phpには、子テーマで追加してカスタマイズするものを記載していきます。その上で、親テーマのcontent.phpを複製して、
style.css、functions.phpと同じフォルダに入れてアップロード＆有効化する、という手順かと理解しました。今回親テーマのcontent.phpを直接カスタマイズしているということでしたので、
親テーマのcontent.phpを複製して、子テーマフォルダへ置く場合も、親テーマと同じ階層の場所へファイルを置いてください。おそらくカスタマイズしたファイルは以下の場所ですよね？？
/template-parts/post/content.php子テーマフォルダ内に template-parts フォルダを作成し、その中に post フォルダを作成し、
その中にcontent.phpを入れることになると思います。関連してお尋ねさせてください。
A）ダッシュボード＞外観＞カスタマイズ＞追加CSS
B）ダッシュボード＞ExUnit＞CSSカスタマイズ
上記A・Bに書かれた内容は、それぞれどのファイルに書き込んでいるのでしょうか。CSSのカスタマイズにつきましては、↓下の記事が最新となりますので、こちらの方がわかりやすいかもしれません。
（上記のAとBに関しましては、直接管理画面に入って入力しています。）
一度ご確認いただけますでしょうか。まずは子テーマを作成して、今回カスタマイズしたcontent.phpを同じ階層内に複製し、
以下のサイトを参考にアップし、子テーマを有効化してみてください。一度以下の記事をよんでいただくと、良いかなと思います。
今回カスタマイズした個所が
非表示にしたいだけならCSSで対応が無難な場合もありますし、アクションフックで改造できるのであれば、そちらをお勧めしております。————————–
現時点でカスタマイズしているファイルを複製して、
子テーマのフォルダに格納する必要がある
————————–
以上の認識は正しいでしょうか？認識は正しいですが、注意点があります。
下のリンクにも記載がありますが、テンプレートファイルはなるべくカスタマイズしず、アクションフックやフィルターフックで改変して対応することをお勧めしています。
▼子テーマでのカスタマイズまた、正しいとすれば、どのファイルがカスタマイズされているか調べるには、
どのような手法があるのでしょうか？結構カスタマイズしてしまった感じでしょうか、、？
どのファイルをカスタマイズしたかは、覚えていますか？
