Cocoonフォーラム

2018.02.102023.01.25

書き込みの前に以下の3点をご確認ください。

1つのトピックにつき1つの質問を書き込んでください
不具合・カスタマイズ対象ページのURLを提示し高速化を無効にしてください
該当部分のキャプチャ・環境情報とともに書き込んでいただけると助かります

何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。

不具合・カスタマイズ対象ページのURL：

相談内容：

不具合の発生手順：

解決のために試したこと：

※文字だけでは正しく伝わらない可能性があるため、スクショ画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報：

※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。

環境情報の取得方法はこちら。
→ https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
→ https://wp-cocoon.com/theme-trouble/

フォーラム利用ガイドリンク

フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。

共有:

通知

すべてクリア

ヘッダーにロゴとブログタイトルをどちらも表示させたい場合

Cocoonテーマに関する質問

最新の投稿 : かうたっく 6年前

2 投稿

2 ユーザー

1 Reactions

2,223 表示

解決済

RSS

misaki

(@misaki)

New Member

結合: 6年前

投稿: 1

Topic starter 2019年1月13日 19:43

素晴らしいテンプレートのご提供、ありがとうございます。

表題の通りなのですが、現在の仕様ですと、ヘッダーにロゴを追加した場合、タイトルテキストが消えてしまうかと思います。

ブログのタイトルとロゴをどちらも表示させたい場合、どのようにカスタマイズしたら良いのでしょうか。ご教示いただけますと幸いです。

引用

かうたっく

(@kautakku)

Famed Member Moderator

結合: 7年前

投稿: 4764

2019年1月14日 09:46

#header-in .site-name {
	position: relative;
}

#header-in .site-name-text:before {
	content: "サイト名";
	position: absolute;
	top: 30%; /*どこに入れたいのか不明だから真ん中あたり※適当な数値*/
	left: 25%; /*文字列の長さに合わせ数値変更*/
	color: #f00; /*分かりやすいよう赤文字に*/
}

https://gyazo.com/063b8f99a6bbb23a1d2d14ef7f8abe47

こんな感じです。

モバイルでは以下

https://gyazo.com/402b7a86189c1ec0f788d2f4e4dc7660

Cocoonの設定の場合はこんな感じでした。

位置ずらしてみると

#header-in .site-name {
	position: relative;
}

#header-in .site-name-text:before {
	content: "サイト名";
	position: absolute;
	top: 50%;
	left: 10%;
	color: #f00;
}

https://gyazo.com/bc1d102c2497f2286e356828a13556ad

モバイル

https://gyazo.com/92e7a1ec07e54827493d83b98b14ca84

数値など変更してみてください。参考リンクも置いておきますね。

http://www.htmq.com/style/top.shtml

もしくは画像にサイト名を入れてアップロード。代替テキストaltにサイト名を入れておけばいいと思います。

PHPをさわるより手軽ですよ。

※画像がリンクになってなかったので再編集。

This post was modified 6年前 by かうたっく

わいひら reacted

返信引用