「お気に入り追加」ボタンを設置する

ヘッダー部分によくお気に入り追加ボタンがあるサイトも多く、設置をしてみました。

サイトトップへの追加の場合

どのページでもサイトのトップへのお気に入り追加を表示させる場合には、ヘッダーにかかるphp内の任意の場所に以下の記述を追加すればokです。

<input type=”button” style=”font-size:10pt” onclick=”javascript:window.external.AddFavorite
(‘http://good.emo-web.com/index.html’, ‘初心者のワードプレス‘)”
value=”お気に入りに追加 !” />

赤字のところは自己の内容を・・・文言は任意で・・・

個別の記事・ページをお気に入りの追加先にる場合

今回はこの方法でやってみました。このサイトはテーマTwenty Tenを使って色々とやっています(※作成日時点)
上記でいうurlに係る部分とサイト名にかかる部分をタグで記述することが必要となりました。

<input type=”button” style=”font-size:10pt “onclick=”javascript:window.external.AddFavorite
(‘<?php the_permalink();?>‘, ‘<?php
 /*
  * Print the <title> tag based on what is being viewed.
  */
 global $page, $paged;

 wp_title( ‘|’, true, ‘right’ );

 // Add the blog name.
 bloginfo( ‘name’ );

 // Add the blog description for the home/front page.
 $site_description = get_bloginfo( ‘description’, ‘display’ );
 if ( $site_description && ( is_home() || is_front_page() ) )
  echo ” | $site_description”;

 // Add a page number if necessary:
 if ( $paged >= 2 || $page >= 2 )
  echo ‘ | ‘ . sprintf( __( ‘Page %s’, ‘twentyten’ ), max( $paged, $page ) );

 ?>‘)”
value=”お気に入りに追加 !” />

ブルーの部分は、当該テーマ内のタイトルを表示させるタグをそのままコピペしています。

お気に入り追加ボタンの装飾と配置

上記の記述を、single/page.phpのmain内に記述します。
さらに

<div id=”book_m”>~</div>でくくり
スタイルシートで配置を右寄せにしてみました。
スタイルシートの記述は
#book_m{
float: right;
}
のみです。設置後のイメージはこの記事の右上です。

master の紹介

サイト作成で、ワードプレスというものを知り、phpやcssの初心者なりに自己流にカスタマイズしていこうと思っています。 ワードプレスの機能やプラグインを使えば結構楽しくサイトが作れます。
カテゴリー: 初心者のワードプレス   タグ:   この投稿のパーマリンク

コメントは受け付けていません。