[対馬 俊彦]

以下の CSS を追加すると、
見た目が添付画像のようにハンバーガーっぽくなりますよ。

.gMenu_name .fa-bars {
  color: #999;
  border: 1px solid #999;
  font-size: 22px;
  padding: 5px;
  border-radius: 3px;
  margin-top: -8px;
}

Attachments:

You must be logged in to view attached files.

[対馬 俊彦]

その他の下層メニューをハンバーガーメニューに隠したい。

一般的な右上にあるハンバーガーメニューの動きをイメージされているのであれば、
ご希望のことを実現するのは、不可能ではありませんが、難しそうです。

なんちゃってハンバーガーであれば、かんたんなやり方があります。
添付画像をご参照ください。

ナビゲーションラベルに <i class="fas fa-bars"></i> と入力すれば、
見た目はそれらしくなりますし、URL の欄を空にしておけば
ハンバーガーボタンのリンクは解除されます。

メニューに追加するときには URL を空にできませんが、あとから空にすることはできます。

いかがでしょうか？

Attachments:

You must be logged in to view attached files.

[対馬 俊彦]

モバイルの時に出てくる三本線メニュー（ハンバーガーメニュー）をパソコンの時にも表示できますか？

ご質問者がやりたいこととは違うかもしれませんが、
単純にモバイルナビと同じものをパソコンでも表示したいのであれば、
以下の CSS でいけると思います。

@media (min-width: 992px) {
body.device-pc .vk-mobile-nav-menu-btn,
body.device-pc .vk-mobile-nav {
  display: block;
}
}

メニューが多いので、ヘッダーメニューに5つほど通常のメニュー表示をし、隅っこに三本線メニュー（ハンバーガーメニュー）を表示させたいと思っています。

モバイルナビと違う中味のハンバーガーメニューを実現するのは難しそうです。

こだわりがなければ、ナビゲーションメニューを階層構造にするのが楽でよいと思います。

[対馬 俊彦]

これ、先日経験して、報告しようとして忘れてました。
VK Blocks Pro が有効化されていないとこうなってしまいます。

岩佐さん、
VK Blocks Pro をインストールすればカスタマイズできるようになります。
このプラグインはとても役に立ちますので、入れておくといいです。

• この返信は3年、 10ヶ月前に対馬 俊彦が編集しました。

[対馬 俊彦]

石川さんが提示された CSS にコメントするのはドキドキしますが…

Windows のブラウザは overflow-y: scroll; にすると、
スクロールの必要がないときでも添付画像 (Chrome の例) のように
スクロールバーを表示してしまいます。

overflow-y: auto; の方がよいのではないかと思います。

Attachments:

You must be logged in to view attached files.

[対馬 俊彦]

ご回答、ありがとうございます。

ツールバーのリンクアイコンをクリックしてください。

そこでしたかぁ…気がつきませんでした。

ちょっと柔軟な思考をすればわかったことですね…反省です。

記事タイトルでも入力しやすいようにという仕様変更

やり方がわかれば、たしかに今までより使いやすくなってますね。
ありがとうございます。

[対馬 俊彦]

横からすみません。

以下の CSS を追加すればとりあえず表示が欠けないようになります。

.vk-menu-acc ul.acc-child-open {
  max-height: 1200px;
}

Lightning では 1200px のところが 1000px になっていて、
20個の項目を表示するには足らないのですが、20個は多過ぎると思います。

モバイル端末であればスクロールして最後まで表示することが可能ですが、
ノートパソコンではスクロールしても下の項目を表示できません。

低価格のノートパソコンでよく使われている 1366 x 768 ピクセルの画面だと、
「ボード重量計算シート」の先を見ることができません。

ご参考まで。

[対馬 俊彦]

私の Katawara のサイトでも確認したところ、
クラシックエディターで画像を追加して中央揃えにした場合、
公開されている記事に中央揃えが反映されません。

とりあえず、以下の CSS で中央揃えにできます。

img.aligncenter {
  display: block;
}

Katawara はブロックエディターで使うことを前提にした製品だと思いますので、
クラシックエディターを使い続けると、他にもこのような問題が起きる可能性がありそうです。

また、インストールされている VK Blocks Pro はとても役に立つプラグインですが、
クラシックエディターでは使えません。

> クラシックエディターを適用で運用しておりますが、

使い慣れたエディターということでそのようにされているのだと思いますが…

Katawara ＋ VK Blocks Pro の組み合わせであれば、機能面でも使いやすさの面でも、
ブロックエディターの方がはるかに上です。

新規制作中サイトのようですので、ブロックエディターへの切り替えをおすすめします。

• この返信は3年、 10ヶ月前に対馬 俊彦が編集しました。

[対馬 俊彦]

私のテストサイトで試してみたら、同じ現象が起きました。

■ 確認できた現象

PC の 固定ページ で下記の現象が起きます。(モバイルではこの現象は起きません)

1. [カスタマイズ]→[Lightning ページヘッダー設定]→[共通] で背景画像を変更する。
2. カスタマイズ画面で表示される固定ページには変更が反映されている。
3. 公開されている固定ページに変更が反映されていない。

■ 対策

1. [カスタマイズ]→[Lightning ページヘッダー設定]→[固定ページ] で背景画像を設定して公開する。
2. [カスタマイズ]→[Lightning ページヘッダー設定]→[固定ページ] で背景画像を削除して公開する。

ベクトル様、
もしかしたらバグかもしれませんので、ご確認いただければと思います。

[対馬 俊彦]

再現性がなく、問題があったPCでもしばらく経ってみたら治っているケースもあります。
また、逆に先ほどまで問題なく表示されていたのに、突然、崩れたりするケースもあります。

症状からすると、キャッシュ系のプラグインが悪さをしているようなかんじです。

WP Super Cache をお使いなので、このプラグインを止めて確認してみてください。

【追記】うなこさんと回答がダブっちゃいました。すみません。

• この返信は3年、 10ヶ月前に対馬 俊彦が編集しました。

[対馬 俊彦]

momo さんへ

momo さんのトップページは CLS スコアが 0 (満点) です。
つまり、もう CLS 改善の余地はないんです。

これをやると「CLS を改善できます。」と Google は言ってますが、
CLS に関してはこれ以上やる意味がないので無視するのが吉です。

momo さんのトップページを見たところ、もう十分にシェイプアップされていて、
やることがなさそうです。

これ以上スコア改善のためにやるとしたら、
デザインスキンを Origin III から Plain にすることくらいかと思います。

• この返信は3年、 10ヶ月前に対馬 俊彦が編集しました。
• この返信は3年、 10ヶ月前に対馬 俊彦が編集しました。

[対馬 俊彦]

> .vk_balloon_icon_image　のクラスにwidth とheightは入っているのですが

クラスに指定すると

画像要素で width と height が明示的に指定されていない

と言われてしまいます。

こうすると合格です。

img.vk_balloon_icon_image {
width: 64px;
height: 64px;
}

なにそれ？ ってかんじですよね。

どっちでもいいと思いますし、この部分に関しては Google のアドバイス通りやったからといってスコアがよくなるわけじゃないです。

[対馬 俊彦]

カスタマイズ
⇒ Lightning レイアウト設定
⇒ コンテナ設定
です。

[対馬 俊彦]

実現には相当かかると思うのですが、

私はシステム開発の経験がありますので、作業の大変さがなんとなくイメージできますが、
需要があればベクトルさんもコストをかけて機能を実装してくれると思います。

投稿リストブロックのリリースから月日が経過しても、このリクエストが出ないと言うことは

需要がないのです。

トップページに数件の新着情報を表示して、[過去の一覧はこちら] で
アーカイブページの先頭にリンクする使い方が一般的で、
トップページの新着情報で [2ページ目はこちら] という使い方を見た記憶が私はありません。

ページ送り機能があったら便利かもしれないな…とちらっと思った時期は私もありましたが、
実際にそういう使い方が必要になったことはないですし、
ExUnit に以下の機能が追加されたので、私にとってその機能はもう完全に不要になりました。

ExUnit 9.49.xで 投稿タイプアーカイブページで記事一覧の上部にウィジェットエリアを追加できるようになりました

• この返信は3年、 10ヶ月前に対馬 俊彦が編集しました。

[対馬 俊彦]

本件が成功したらトップページを固定ページに切り替えたいので

順番が逆で、トップページを固定ページに切り替えないと本件は成功しません。

https://momo-express.com/ で説明すると…

https://momo-express.com/ の最新の投稿一覧の URL は
https://momo-express.com/blog-list/ です。

ももちゃん便のサイトを作ったときに WordPress の [表示設定] で投稿ページとして
設定した固定ページのパーマリンクが最新の投稿一覧の URL になります。

[投稿者]

投稿