対馬 俊彦
フォーラムへの返信
-
投稿者投稿
-
私の考えは junon さんとまったく同じですので、
junon さんが書かれたことを繰り返しません。付け足すことだけ書きます。
個人的には FAQ ブロックそのものがなくても問題ないと思っています。*1
あなたたち (junon さん・私) は自分でコードを書いてカスタマイズできるからそう言えるんでしょう
と感じる方がいらっしゃると思いますが、そうではありません。
コードを書かなくても、機能追加要望しなくても、現在あるものだけでいろんなことができます。
記事にまとめてみましたので、お時間がある方はご覧ください。
この記事を読んでいただければ、*1 がそんなに乱暴な考えでないとご理解いただけるのではないかと…
画像を50%幅で表示してテキストを回り込ませるのは、CSS を書かなくても
Bootstrap のクラスを使って、以下の手順でかんたんにできますね。- 画像を左寄せ(または右寄せ)する。
- 画像ブロックの 追加 CSS クラス に
w-50
と入力する。(添付画像参照)
50%幅ならレスポンシブ対応しなくてもよさそうです。
これでいかがでしょう?
Attachments:
You must be logged in to view attached files.回り込みではありませんが、代替案として VK Blocks Pro の グリッドカラムブロック でご希望のことができるかもしれません。
厳密な意味での回り込みをするのであればカラムは使えませんので、おそらく CSS でカスタマイズする必要があると思いますが、レスポンシブ対応まで考えると手間がかかりそうです。
他のページも試しましたら
左側にサイドバーが表示されました。この症状からすると、
カスタマイズ
⇒ Lightning レイアウト設定
⇒ メインカラム設定
⇒ 個別投稿ページ [固定ページ]が設定されていないのかもしれません。
Lightning 以外で私が使ったことがあるテーマとテンプレートで試したところ、
スクロール時にグローバルナビを上部に固定するものは「メニュー数が多いときに後ろの方を表示できない」
という先日のトピックと同じ問題が起きました。
Lightning G3 はスクロール時にグローバルナビを固定しないようにも設定できるので、
「メニューが特に多い場合はグローバルナビを固定しないでお使いください」
という対応でも許容範囲なのかなという気がしてきました。対応していただいているところ、申し訳ございませんが、コメントさせていただきました。
支障なく対応していただけるのであれば、
Lightning のアドバンテージになりますので、素晴らしいことだと思います。先日、Lightning で Katawara のように MENU を表示する CSS を提示しましたが、
自分でも G3 で制作中のサイトでこのやり方を採用して、以下のことに気がつきました。- 背景が濃色だと見た目が残念
- 開いたモバイルナビがボタンに近すぎる
上記の点を調整した CSS がこちらです。
.vk-mobile-nav-menu-btn { text-indent: 2px; font-size: 10px; padding-top: 26px; overflow: visible; border: none; background-position: top; height: 40px; } .vk-mobile-nav-menu-btn.menu-open { border: none; } .vk-mobile-nav { padding-top: 50px; }
すみません。
終わりにしましょう。
とのことですが、ご質問者が職業訓練について書かれている内容で黙っていられない部分がありますので、書かせていただきます。
厚労省の規定で、訓練で使用するテキスト等の、訓練申請時に許可が出たもの以外に、訓練生には1円も払わせてはならない規定があったからです。
これは事実です。
職業訓練の法律施行規則には以下のように書かれています。
訓練受講に係る費用
入学料(受講の開始に際し納付する料金をいう。)及び受講料が無料であること。また、申請職業訓練を受講する特定求職者等が所有することとなる教科書その他の教材等に係る費用としてあらかじめ明示したものを除き、無料であること。ただし…
訓練に興味を持った方、受講した方には、訓練期間以外にも未来永劫、対価を支払わせる行動をしてはならないという規定でした。
そんなの、厚労省の規定にないですよ。
もしあるとしたら、特定の地域のローカルルールなのかもしれませんが、ナンセンスです。
ベクトル製品よりもはるかに高価な Adobe Ilustrator / Photoshop を使っている職業訓練はありますし、そのナンセンス規定に沿ったら Word / Excel も教えることができなくなってしまいます。
私も市販の有料ソフトを使って職業訓練をしたことがありますよ。
フリーソフトを使った職業訓練はありますが、あれは予算の都合です。
このトピックを見た方が職業訓練について誤解されると困るので書かせていただきました。
ブログをサイト内で運用する際に、ブログとは無関係な「お知らせ」が表示されてしまい、その「お知らせ」を非表示にするために、さらにカスタマイズが必要という、典型的なバグ誘発ロジックになってしまいます。
初心者の WordPress 勉強、職業訓練講習に限定すれば、
私は以下の2つのカテゴリーを作って対応します。お知らせ
https://******.com/blog/info/スタッフブログ
https://******.com/blog/staff/実際に運用しているサイトでもこのやり方で OK のものもあります。
実際に運用するサイトでご指摘のようなケースが発生することはあります。
その場合は Pro 版でカスタム投稿タイプを使う、という考えでよいのではないかと思います。私はパソコン教室を運営していて、
自分で WordPress サイトを作りたいという初心者に指導することもありますし、
職業訓練でホームページ制作の講師を担当した経験もあります。
なので、貴社と似通っている部分はあると思います。> お知らせの機能は学びたがるところです。
この場合、投稿カテゴリーに「お知らせ」を作って、
WordPress 標準の [最新の投稿] ブロックでそのカテゴリーを表示すれば、
受講者は納得してくれると思います。> 方法も公開しているくらいなので、それほど労力はかからず、利便性と労力の両立ができると思うのですが…
数行のコードのカスタマイズでできることでも、
それをシステムのコアの機能として実装~メンテナンスするのに労力がかかるということはあると思います。-
この返信は3年、 9ヶ月前に
対馬 俊彦が編集しました。
ウィジェットは使わないという全体構想に合わせようとした結果発生した問題点なのに、ウィジェットを使うことで解決というのは、ちょっと全体の思想にミスマッチではないでしょうか?
コアの部分にウィジェットを実装せずに対応するということなので、
ミスマッチにはならないと思います。他の利用者のご意見も、伺いたいところです。
今までできたことがアップデートによりできなくなる、
ということについて残念に思われる気持ちがわかりますが、
G3 は古い機能・互換処理のためのコードを削除しているので、
無料版に関してはある程度の不便はしかたないのではないかと思います。同じようなブロックを増やすと実装がよかったとしてもメンテが対応できない。
石川さんが GitHub でこう書かれているのを見ると、Pro 版のユーザーとしては、
無料版の機能実装やメンテナンスに労力をかけ過ぎないでほしいと望みます。このフォーラムは Pro 版のユーザーがほとんどなので、
私の考えに近い方が多いかもしれません。こんな風にしたかったんです。
不可能ではありませんが…
Lightning Pro でここまでやるのであれば、ハイレベルなカスタマイズのスキルが必要です。-
この返信は3年、 9ヶ月前に
対馬 俊彦が編集しました。
以下の 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つほど通常のメニュー表示をし、隅っこに三本線メニュー(ハンバーガーメニュー)を表示させたいと思っています。
モバイルナビと違う中味のハンバーガーメニューを実現するのは難しそうです。
こだわりがなければ、ナビゲーションメニューを階層構造にするのが楽でよいと思います。
-
投稿者投稿