[Olein_jp]

実現されたい参考サイト、拝見しました。

現状、どのようなCSSを書かれてうまく実現できない状況ですか？そちらを共有いただけますと幸いです。

— 追記
@キタジマタカシ 氏

すんませんかぶったw

♥ 1

いいねをした人: 居ません

[Olein_jp]

他の有効化されているプラグインや、子テーマ・My Snow Monkeyならびに追加CSSで書かれているCSSなどが影響している可能性があるので、まずは、

1. プラグインを全て無効化してみる
2. （上で問題が解決したら）一つ一つ有効化していき原因となったプラグインを特定する
3. １で解決しない場合には、子テーマやMy Snow Monkey、追加CSSに書かれているCSSを一旦効かないようにする

キャプチャ画面だけでは推測が難しいので、まずはこちらを試されるのが良いかと思います。

♥ 1

いいねをした人: 居ません

[Olein_jp]

.l-header .c-hamburger-btn__bar {
    background-color: white;
}

こちらのCSSで実現できるかと思います。色は任意に white の部分を変えてください。

また、Google Chrome の開発者ツールを活用してCSSを解析してみると、比較的簡単にこのような問題も解決できるようになるので、ぜひ挑戦してみてください。

手前味噌ですが、以下の動画も参考にしていただけるかもしれませんので添付します。

本家 Snow Monkey とのコラボ企画！「簡単なCSSカスタマイズに挑戦してみよう！」を開催します

この度、以下の日程にて HAPPY SNOW MONKEY と 100%GPL有料 WordPress テーマ…

happy-snow-monkey.olein-design.com

♥ 2

いいねをした人: 居ません

[Olein_jp]

本件がアップデートの影響かどうかはわからないのですが、アップデートによってこういったことが起こり得ることは不思議ではないかと思います。

案件にもよりますが、大元から言ってしまうと、WordPressを使う上で「アップデートをしない」という選択肢を採用するのであれば、そもそもWordPressを選択するべきかどうかという点から考え直す必要があるかな、と僕自身なら思います。

そして、WordPress本体もSnow Monkey を含むテーマも、各種プラグインもそうですが、アップデートをしないという選択肢をする場合は、そのリスクも理解してクライアントにも認識していただいた上で判断を仰ぐというフェーズを踏まないと、トラブルが発生した際の責任問題やコストの問題にも繋がるかなと思います。

個人的には、WordPressにおいてアップデートはマストかなと思っています。しないという選択をする場合には、そこから発生した諸問題に対する対応方法も明確にしておきますねー。

♥ 0

いいねをした人: 居ません

[Olein_jp]

@アクツさん

まじすか…子テーマやらなさすぎて全然知らなかったです。

@高島さん

ということで、僕のレスは無視してください！もっと詳しい人を待ちましょう！失礼しました！

♥ 0

いいねをした人: 居ません

[Olein_jp]

理解しました。

本件とは関係ありませんが、ロゴという言葉が指すものは認識が合っていますが、「ドロワー」とは「ハンバーガーメニュー（3本線のもの）」をタップすると通常左側から出てくるメニューのことを指します。ですので、「ドロワーメニュー」とはそのメニューを指し、「ドロワー」と言われているものは一般的に「ハンバーガーメニュー」と呼ばれます。ご参考までに。

@ryoma_aki さんはPHPは書けますか？僕の認識では、かなり難しいカスタマイズになると思います。（僕ならやりたくないです）

この箇所にどのような文章や画像を挿入されたいのかにもよりますが、スペース的にはかなり狭い部分ですので、本当にその対応がユーザーにとって最適なのか（画像・文字視認の観点より）検討が必要な気がします。

掲載されたい内容情報がないので判断はできませんが、テンプレートの上書きになるかと思います。ただし、その場合ヘッダー構造のレイアウトをカスタマイザで変更されたら別のテンプレートが読み込まれる形になることもあるので、そういった自由度を制限することが利用者のためになるのか、トラブル発生の元にならないかも検討が必要でしょう。

どのテンプレートを上書きするかは、利用しているヘッダーレイアウトにもよるので断定はできませんが、templates/layout/headerから利用しているテンプレートを探して、適所を上書きする形になると思います。

ご確認をお願いいたします。

♥ 2

いいねをした人: 居ません

[Olein_jp]

子テーマ > templates > static > ◯◯

こちらのstaticというのは、なぜ入っているのでしょうか？

子テーマでテンプレートファイルを上書きする場合、親テーマと同じように階層を作らないといけないはずですので、templates/view/***.phpというような構造になるのかなと思われます。

子テーマに追加した自作ページの表示したい

何を表示させるページとして用意していますか？アーカイブ（例archive.php）でしょうか？投稿詳細（例single.php）でしょうか？

・カスタム投稿のスラッグを変更

用意されているカスタム投稿のスラッグと作成されたファイル名（例single-{cutom-post-type-slug}.php）を共有ください。

尚、Show Current Templateプラグインや WP_DEBUGを使って、表示テンプレートの確認ならびにエラー確認などはしていただいている前提でお話を進めてもよろしいでしょうか？

以上、ご確認をお願いいたします。

♥ 0

いいねをした人: 居ません

[Olein_jp]

カスタムHTMLブロックを利用されてはいかがでしょうか？

♥ 2

いいねをした人: 居ません

[Olein_jp]

こちらの赤丸を書かれているのは、

• ヘッダーの中
• ヘッダーの下

どちらでしょうか？

また、タイトルにある「ヘッダーとドロワーの間」という意味がわからなかったのですが、もしよろしければお教えください。

♥ 0

いいねをした人: 居ません

[Olein_jp]

単純に親要素にposition: relative;が付いていないのが原因かと思います。

この場合、.summa2-imgの直接の親要素は、.summa2ではなく.smb-section_bodyですね。なので、.summa2-imgに書かれているposition: absoluteは正常に動かないと思います。

何をどうされたいのか具体的に書かれていないので、これ以上どう書くことが課題の実現に繋がるかわからないため、コードでのアドバイスは難しいです。

また、同一のブロックでない限りHTML構造が変わることがほとんどだと思うので、まずは開発者ツールなどでHTML構造を確認された上でCSSを色々と書いてみることをお勧めします。

手前の情報で恐縮ですが、開発者ツールの使い方などはこちらの動画などでも取り扱っているので、Snow MonkeyをCSSカスタマイズする際には、参考にしていただけるかもしれません。よろしければどうぞ！

本家 Snow Monkey とのコラボ企画！「簡単なCSSカスタマイズに挑戦してみよう！」を開催します

この度、以下の日程にて HAPPY SNOW MONKEY と 100%GPL有料 WordPress テーマ…

happy-snow-monkey.olein-design.com

♥ 0

いいねをした人: 居ません

[Olein_jp]

Dropbox経由で画像を共有されると、こちらからのアクセス情報をそちらに渡さなければならないのと、そちらのファイルを削除された場合にこのトピックを他の方が見られた際に内容を把握することができず、共有知として活用することができなくなります。ですので、上記のDropbox共有の画像もトピックに掲載をお願いします。

そちらと一緒に、現在試されて何が上手くいかなかったのかも掲載頂けるとスムーズかと思いますので、併せてご確認をお願い致します。

追記:本件不具合ではないかと思うのでカテゴリーが間違ってますね

♥ 0

いいねをした人: 居ません

[Olein_jp]

今一度、現状どのような設定状態になっていて、どんな状態で何を実現されたいのか、出来るだけ共有頂いてもよろしいでしょうか？

可能であればスクリーンショットなども交えてお教えいただけると助かります。

♥ 0

いいねをした人: 居ません

[Olein_jp]

実際のページを見ないとHTML構造などが把握できないので、なんともアドバイスし難いのですが、基本的にブラウザの開発者ツールでの確認しかないので、どのクラスにどのような要素が当たっていて、入力されたz-indexが効いていないのかをチェックしてみてください。

それらを実際に見ないと的確なアドバイスを差し上げられないかなと思います。

♥ 0

いいねをした人: 居ません

[Olein_jp]

最適解かどうかわかりません（他に良い方法がありそうな気がします）が、CSSでゴリゴリしてしまうのであれば、

.c-hamburger-btn {
    display: none;
}

.l-center-header__row {
    display: block !important;
}

こうすることで、トグルボタンは表示されず、メニュー自体は出現するので、あとは追加でCSS調整を行うという形で実現できるかと思います。

（もしかしたらPHP側からフックでトグルボタンの制御ができるのかな？できないのかな？現時点でわかりませんでした）

♥ 1

いいねをした人: 居ません

[Olein_jp]

スマホで見た時にスマホ固定メニューが透過されて白くなる。

透過されたら白くならないような気がします。

現在、スマホ表示時のヘッダーは「上部固定」になっていると思うので、動作としてはこれが普通かなという認識ですがフッターメニューも現状背景白で透過はされていないですね。どのような動きにしたいなどあれば、共有していただければアドバイスできるかもしれません。

ご確認をお願いします。

♥ 2

いいねをした人: 居ません

[投稿者]

投稿