タイトルに顔アイコン表示されるようにしてみた

WordPress
この記事は約3分で読めます。

現在、WordPressのテーマとして、mono-labさんところの「monochrome 2.7」を使用中。

通常、一人で書く事が多いと思うので当然ちゃ当然なんだろうケド、タイトルのところに顔アイコン(アバター)表示が出来ないテーマが多い!
コメントはGravatarで登録したアバターが表示されるのにねー?

というわけで、付け足してみた。

 変更箇所としては、「メインインデックスのテンプレート(index.php)」に、

<div class=”post clearfix”>
<div class=”post_content_wrapper”>
<h2><?php echo get_avatar(get_the_author_id(),$size = ’48’,$default = ‘<path_to_url>’); ?><a href=”<?php the_permalink() ?>”><?php the_title(); ?></a></h2>
<div class=”post_content”>
<?php the_content(__(‘Read more’, ‘monochrome’)); ?>
<?php wp_link_pages(); ?>
</div>
</div>

の赤字部分を追加。これで、タイトルの直前にアバターが追加されます。・・・HTML文法的にNGかどうかは謎・・・(笑)
タイトルをクリックして、単一記事表示された時にも表示させたい場合は「単一記事の投稿 (single.php)」。
検索結果や、アーカイブ選択時の一覧でも表示させたい場合は「検索結果 (search.php)」と「アーカイブ (archive.php)」も同様の修正を入れておきます。

あとは、「スタイルシート(Style.css)」に、

.post img, .post a img { border:1px solid #ccc; padding:5px; margin:0 10px 0 0;  background:#f2f2f2; }
.post_content_wrapper h2 img { border:1px solid #0; padding:0px; margin:0 0 0 0;  background:#0; }
.post a:hover img { border:1px solid #38a1e5; background:#9cd1e1; }
.post img.centered,div.centered { display:block; margin:0 auto; }
.post img.aligncenter,div.aligncenter { display:block; margin:0 auto; }
.post img.alignright,div.alignright { margin:4px 0 15px 15px; display:inline; }
.post img.alignleft,div.alignleft { margin:4px 15px 15px 0; display:inline; }
.post img.wp-smiley { border:0px; padding:0px; margin:0px; background:none; }

の赤字部分を追加。これを追加すると、タイトル周辺の画像の周りにボーダーが表示されなくなります。

無事、タイトルに顔アイコンが表示。まあ、他のアイコンが表示されるこたぁ、まず無いんだけど…。

あー、ちなみに、こういう風にテーマをいじるのってOKなのかな?このまま再配布しなければOK…だよね…?…だよね?

コメント

タイトルとURLをコピーしました