プロフィール


【HN】おだぽん
【趣味】収入自動化

アーカイブ

ワードプレスにアメブロ風のメッセージボードを追加してみる

いままでアメブロを使っていたので、メッセージボードに慣れていて、

 

ワードプレスに移行した際にメッセージボードに入れていたコンテンツの配置に困りました。

 

色々テンプレート探したのですが、なかなかメッセージボードが使えるテンプレが見つからず、

 

しょうがないので、自分でテンプレ作り変えることにしました。

 

同じ悩み持っている方のために、方法書いておきます。

 

色々実現方法はあると思いますが、

 

今回はウィジェット欄にテキストとして書き込みができ、

 

そのウィジェットをブログ内に表示し、ウィジェットメニューから内容編集できるようにします。

 

通常、アメブロではメッセージボードはトップページにのみ表示されるものなので、

 

今回はそれを真似て、ウィジェットのテキスト部分をトップページの記事タイトルの上に表示させるようにします。

 

一般的に出回っているテンプレでは、ウィジェット欄は左サイド、右サイド、ヘッダー部、フッター部に表示させるものがありますので、

 

そこにメッセージボードウィジェット欄を追加します。

まず、触るファイルは”functions.php”というファイル。

 

編集箇所は2箇所。

 

まず1つめは「外観」→「テーマ編集」→「テーマのための関数(functions.php)」

 

ここにウィジェットの情報が書かれてありますので、ウィジェットを追加します。

 

一番最後の”?>”の前に追加します。

 

2行めの「メッセージボード」がウィジェットの名前になります。以下のソースを貼り付けます。

 

===================================
register_sidebar(array(
'name' => 'メッセージボード',
'before_widget' => '<div id="massage_bord"><div id="%1$s">',
'after_widget' => '</div></div>',
'before_title' => '<h3>',
'after_title' => '</h3>'
));
===================================

上記を追加したら、実際にウィジェットが追加されたか確認します。

 

確認方法は「外観」→「ウィジェット」

 

上記画像のように「メッセージボード」というウィジェットが追加されているはずです。

 

そのウィジェットの中に「テキスト」を追加します。

 

テキストを「お知らせ欄」ウィジェットにドラッグします。

 

するとウィジェット内にテキスト ウィジェットが追加されます。

 

このテキストはhtmlが利用できますので、文字の装飾、画像の添付、リンク貼付けも可能になります。

 

ここまでがウィジェットの設定です。2つ目の編集箇所は、ここから設定したウィジェットを実際にブログに表示させます。

 

ここではトップページのみに表示させます。

 

編集するファイルは”index.php”です。

 

以下のタグを記事部分の直前の場所に挿入します。

 

===================================
<?php if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar(‘メッセージボード’) ) : ?>
<?php endif; ?>
===================================

 

追加する場所なのですが、これは利用されているテーマによって微妙に異なりますが、

 

だいたいは、”content”とか”post”とかがブログの記事部分になっていますので、

 

その直前あたりに追記すると良いです。

 

ここは少々HTMLの知識が必要ですが、

 

なかなかうまくいかないという方は、メッセージいただければアドバイスしますよ☆

 

※問い合わせ多くて返信追いつかなかったらごめんなさい(汗)

タグ: , , , , ,

コメントをどうぞ

ネットビジネスの教科書
最強のサイト作成ツール
脱・初心者用教材!
アフィリエイトの新常識
集客NO,1ツール!
最強のSEO対策
LUREA
サイトアフィリでショートレンジ、ミドルレンジ、ロングレンジと様々なスタイルの戦略が学べます。さらに、被リンクやテンプレート等の特典が凄いです!本気でアフィリで食べていこうと思う人には絶対に必要な教材です。
国内最安VPS
スポンサーリンク