対馬 俊彦
フォーラムへの返信
-
投稿者投稿
-
文字数の多い・少ないがあると、たしかに気になりますね。
【困った点】段落の文字数により、枠の高さが変更してしまう。
【修正作業】グリッドカラムアイテムに display: flex; の指定を追加する。【困った点】ボタンの位置が下揃えが出来なく
【修正作業】ボタンに position: absolute; の指定を追加する。先ほどお知らせした投稿で上記の修正作業を行いました。
【追記】
以前、私は HTML・CSS を書いてこのようなレイアウトを時間をかけて作っていましたが、スキルと時間の制約のためになかなか納得いくものができませんでした。
ブロックエディターに移行してからは VK Blocks Pro などのブロックをなんとか工夫・活用して楽してやろうということを考えるようになり、以前よりもはるかに短時間で納得できるものを作れるようになりました。【追記 2.】
昨晩のベクトルさんの勉強会で こうの ちあき さんがプレゼンしてくれた「飲茶の作法」というサンプルページはブロックの活用のすごいヒントになりました。Slack に登録すればこのサイトのデータをダウンロードできます。
gundam さん、すでに参加・登録されてたらご容赦ください。
-
この返信は3年、 9ヶ月前に
対馬 俊彦が編集しました。理由: 【追記】
実際試してみたのですが、画像上左右角丸、グループの線の太さ、
余白、等の設定が大変そうな感じがしました。今年2月に自分の勉強と備忘録のために書いた投稿があったのを思い出しました。
グリッドカラムでひとつブロックを作ってしまえば、カスタム HTML で作るよりずっと楽できますので、ご参考にどうぞ。
マイアカウントのページにはありませんが、投稿に表示されているご自分の名前 ( 参加者の上の traveller ) をクリックして、[開始したトピック] で一覧を表示できます。
-
この返信は3年、 9ヶ月前に
対馬 俊彦が編集しました。
このトピックが参考になると思います。
私のサイトで確認したところ、先ほどの CSS で期待通りの表示をしています。
もしかしたら、不要な文字が入力されているとかが原因なのかもしれません。まず、テーマエディターに入力したお問い合わせフォームに関する部分を
いったん削除するのがよさそうです。この CSS はお問い合わせフォームだけに適用すればよいので、
CSS を書く場所としては、ひとつ前にキーマスターさまが提示された解説ページの
5.5. ExUnit のCSSカスタマイズ(指定ページ)
で説明されている カスタム CSS という入力欄がよいと思います。私が提示した CSS をコピーして、
お問い合わせフォームを置いてある固定ページの カスタム CSS に貼り付ければいけると思うのですが…質問なのか、機能追加要望なのか、判断できかねますが、質問という前提でコメントさせていただきます。
もし機能追加要望であれば私のこのコメントはスルーしてください。
現在は、画像が中央表示にならず、1枚表示でスライドするような形で、slideするだけです。
たぶん、ご質問者のサイトで起きている動きが Lightning G3 の coverflow の仕様です。
私のサイトでも coverflow のスライドショーにしてみましたので、比べてみてください。
→ https://lightning-g3.hp1.work/coverflowを実現できる他のスライドプラグインは、画像中央の設定、表示単位の設定、間のスペースの設定で調整できます。
現在の Lighnting G3 のスライドショーにその機能はないと思います。
添付の設定と追加の仕方で間違いないでしょうか。
margin-*** の設定は { と } の間に入れないといけませんので、以下の書き方が正しいです。
.wpcf7-form-control.form-control { width: auto; margin-left:auto; margin-right:auto; }
【以下、追記です】
上記の CSS だと、入力欄だけ中央に配置されてしまいますね。
それから、スマホで表示すると入力欄が画面からはみ出してしまいますので、以下のようにするのがよさそうです。
@media (min-width: 768px) { .wpcf7-form-control.form-control { width: auto; } .wpcf7-form { max-width: 680px; margin-left:auto; margin-right:auto; } }
-
この返信は3年、 9ヶ月前に
対馬 俊彦が編集しました。理由: CSS 見直し
複製が使えないのは残念ですが…
全ての高さや各設定を一から行わなければいけないため
VKブロックとしての機能性がなくなり、とても残念でした…。
相当時間が掛かり現実的ではないです。以下のようにすれば、修正待ちの間はとりあえず乗り切れます。
- スライダーアイテムを追加
- 背景画像を設定
- ひとつ前のスライダーアイテムに含まれるブロックをすべて選んでコピー ~ 追加したスライダーアイテムの中に貼り付け
このやり方なら、少し多めに時間が掛かるだけで済みます。お試しください。
複製しますとIDが同じになり、今回のような不具合を起こしてしまいます。
なるほど、そういうことでしたか。
WordPress 5.8 になって複製動作の仕様が変わったということなんですね。
スライダーアイテムを追加して作り直したら OK になりました。横からすみません。
私のサイトでも同じ症状が起きています。
起きている症状は以下の通りです。
- スライドが切り替わる動作はしている。
- スライダーアイテムに背景画像を設定してあると、常に先頭のスライダーアイテムの背景画像が表示されてしまう。
- その結果、背景画像だけを設定してあるフェード動作のスライダーは止まっているように見える。(ページネーションを見ると進んでいるのが確認できますが…)
以下のことを試しましたが、症状は改善しませんでした。
- Lightning G3 Pro Unit 0.6.4 / VK Blocks Pro 1.9.2 以外のプラグインをすべて無効化する
- 親テーマに戻す
以下の固定ページでは Slide 1 / Slide 2 / Slide 3 に別々の背景画像を設定してありますが、Slide 1 の背景画像が常に見えています。
WordPress 5.7.2 + Lightning Pro 8.11.0 の環境で、WordPress 5.8 にアップデートしました、
私のサイトでは問題が起きていませんが、ググってみると 5.8 にしたら重大なエラーが起きるようになったという報告もありますので、使用しているプラグインによっては問題が起きる可能性があるみたいです。
【追記】
ご質問の内容と関係ありませんが、このサイトの マイアカウント → アカウント詳細 で [Showcase ログインID] にメールアドレスを入力されているので、お名前の下の [制作実績] のリンクでメールアドレスが見えてしまってます。-
この返信は3年、 9ヶ月前に
対馬 俊彦が編集しました。
横からすみません。
スマホからの検索では、アイコン表示が多いので、対応した方がよいのかな・・
WordPress のカスタマイズでサイト基本情報のサイトアイコンを設定してあれば、ファビコン(favicon.ico)を設定しなくてもスマホで検索したときにアイコンは表示されています。
経験上、そういうものだと思っていましたが、違うのでしょうか…?
すみません。そういうことでしたら、私は PHP や JavaScript でセッション変数を扱った経験がないので、まともなアドバイスができる立場にありません。
どなたか詳しい方から有用な回答があるかもしれませんので、それをご期待ください。
でも…せっかくこのトピックに関わったので、勉強を兼ねてセッション変数を削除するシンプルなプログラムを作ってみました。
「特定のメニュークリック」したときにサイト内のどこかのページを表示するのではないかと思いますので、上記のプログラムのような動きでもよいのかもしれません。
-
この返信は3年、 9ヶ月前に
-
投稿者投稿