Simplicityの特徴 › フォーラム › テーマファイルのカスタマイズに関する質問など › SNSボタン下のauthorアイコンについて
- このトピックには12件の返信、2人の参加者があり、最後に
みきにより9年、 5ヶ月前に更新されました。
-
投稿者投稿
-
-
2017年5月25日 2:38 PM #52710
hide
ゲストWordPress 4.7.3
バージョン: 2.4.8bいつもsimplicity2を利用させていただいております。
SNSボタン下のauthorアイコンを指定の画像に変更する方法をご教授いただきたいです。
よろしくお願い致します。 -
2017年5月25日 7:39 PM #52713
かうたっく
ゲストこんばんは!
物凄く強引なやり方かもしれませんが。CSSで対処してみました。.post-author .fa-user { display:none; } .fn:before{ content: ""; background: url(画像のパス) no-repeat; width: 16px; height:16px; background-size: contain; display:inline-block; padding-right: 2px; }.post-author .fa-userは、アイコンフォントを消す記載で、次の.fn:beforeで新たな画像を配置して16pxの大きさに画像を入れるスタイルです。
もっと良い方法があるかもしれませんが
-
2017年5月25日 7:41 PM #52714
わいひらキーマスター分かりやすい方法で言えば、author-link.phpテンプレートの
<?php echo $auther_icon_tag; ?>部分を「指定の画像タグ」に変更すればできるかと思います。 -
2017年5月25日 7:41 PM #52715
かうたっく
ゲスト4行目の
content: "";
こちらは
content: “”;
です。 -
2017年5月25日 9:27 PM #52718
hide
ゲストご返信ありがとうございます。
>>かうたっくさん
アイコンは消えたのですが、画像のパスを入れても画像が表示されませんでした。素人のため、原因はわかりません…。>>わいひらさん
申し訳ございません。指定の画像タグに変更するやり方がわからないのですが、例えば「http://~~~ico2.jpg」という画像を挿入する場合、どのように変更するのかご教授いただきたいです。お手数おかけしますが、よろしくお願い致します。
-
2017年5月25日 10:02 PM #52723
みき
ゲスト指定の画像タグに変更するやり方がわからないのですが、例えば「http://~~~ico2.jpg」という画像を挿入する場合、どのように変更するのかご教授いただきたいです。
わいひらさんではありませんが。。。
<?php echo $auther_icon_tag; ?>をに変更すれば可能だと思います。
※検証はしていません。こんな感じ
<span class="post-author vcard author"><?php echo $auther_icon_tag; ?><span class="fn"<?php is_single() ? '' : ''; ?>><?php if ( is_twitter_follow_id_author_visible() && get_twitter_follow_id() ): //TwitterID表示の場合 ?> <a href="https://twitter.com/<?php echo esc_html( get_twitter_follow_id() ); ?>" target="_blank" rel="nofollow">@<?php echo esc_html( get_twitter_follow_id() ); ?></a><span class="post-author vcard author"><img src="" /><span class="fn"<?php is_single() ? '' : ''; ?>><?php if ( is_twitter_follow_id_author_visible() && get_twitter_follow_id() ): //TwitterID表示の場合 ?> <a href="https://twitter.com/<?php echo esc_html( get_twitter_follow_id() ); ?>" target="_blank" rel="nofollow">@<?php echo esc_html( get_twitter_follow_id() ); ?></a> -
2017年5月25日 10:04 PM #52724
みき
ゲストそのまま書いたので消えてしまった。。。
<?php echo $auther_icon_tag; ?>を<img src="" />に変更すれば可能だと思います。 -
2017年5月25日 10:06 PM #52727
かうたっく
ゲストなぜでしょうねぇ^^;
わいひらさんおっしゃる、そのPHPファイルを編集する場合
<img class="aligncenter" src="画像のパス" alt="" width="" height="" />といれて、CSSで追記するとかどうでしょうか?
.post-author img { width: 16px; height: 16px; display: inline; } -
2017年5月25日 10:19 PM #52730
わいひらキーマスター単に、画像を適切な大きさにリサイズして、画像タグで書くだけです。
<img src="http://~~~ico2.jpg">
。
<IMG>-HTMLタグリファレンス
画像タグの使い方は、「img html」」で検索すれば、その他にも出てくるので、調べて利用してみてください。 -
2017年5月25日 10:21 PM #52732
わいひらキーマスターあら、タブを開いたまましばらく何かした後に書いたら、みなさんも書かれていて、書き込みがかぶってしまいました;
ありがとうございます。 -
2017年5月25日 11:19 PM #52737
かうたっく
ゲストお疲れ様です^^
CSS再チャレンジしました
.post-author .fa { display: none; } .fn:before { content: ""; background: url(画像のパス) no-repeat; padding-left: 20px; display: inline; background-size: auto 16px; }これで、画像のパスを貼り付ければ、問題ありません。・・・と思います。ちょっと気になったので^^;
<img src="画像のパス">も良いですよね❦ -
2017年5月27日 11:36 AM #52756
hide
ゲストわいひらさん、みきさん、かうたっくさん
ご丁寧に解説してくださりありがとうございます。
お三方にご教授いただいたおかげで無事解決できました!これからもsimplicity2を利用させていただきます。
-
2017年5月27日 11:42 AM #52757
みき
ゲスト解決できて良かったです!!
-
-
投稿者投稿
- トピック「SNSボタン下のauthorアイコンについて」には新しい返信をつけることはできません。