【動画版】子テーマでのバイラルメディア風facebookボタン設置方法

wordpress

この記事が気に入ったらいいね!しようというバイラルメディア風オリジナルSNSボタンの設置方法について、動画で解説しました。
前回は、プラグインを使って設置した のですが、簡単に設置できてよかったのですが、固定ページにも反映されたので、記事のみにバイラルメディア風facebookボタンを設置したく、子テーマを使い設置しました。
その時の様子を動画にして解説しましたので、参考にしていただけたらと思います。
また、設置するにあたり、ままはっく の記事からコードを使わせていただきました。まなしばさんありがとうございました。

バイラルメディア風facebookいいねボタン

スクリーンショット 2016-04-29 4.06.31
今回設置するバイラルメディア風facebookいいねボタンはこのような画像になります。このような画像を設置することで、facebookのいいねを押してもらいやすくなり、いいねを押してもらった人にfacebookを通じて記事を更新した時にお知らせすることができ、継続的にブログを見てもらうことができます。

こんな人にはおすすめ

  • 初めてwordpressをカスタマイズする人
  • CSS以外のコードを編集することが初めての人
  • カスタマイズの手順がわからない人

子テーマを使う理由

今回は子テーマを使いカスタマイズしました。子テーマとは何かわからない人はまず↓をご覧下さい。

通常テーマを直接、コードを書き換えてカスタマイズすると、テーマをアップデートした時に、カスタマイズした内容がアップデート後に戻ります。
しかし、子テーマを使うと、テーマをアップデートした時に、カスタマイズした内容が継続して受け継がれますので、安心してカスタマイズできます。

 

もっと詳しく子テーマを使う理由について知りたい方は↓を参照して下さい。
WordPressテーマのカスタマイズで子テーマを使うべき理由、使い方など

バイラルメディア風facebookいいねボタンの設置方法

バイラルメディア風facebookいいねボタンの設置方法について動画で解説しています。

クリックすると見れます↓
After EffectsでCMのグラブル風オープニングを作ってみよう。
ままはっくの記事について↓に貼ってますので、コードを使われる良いと思います。
FacebookページいいねやTwitterフォロワーが倍増!バイラルメディア風オリジナルSNSボタンの設置方法【WordPress】

カスタマイズする時につまづいた点

  • style.cssのスペル間違い
  • single.phpにコードをペーストする位置
  • functions.phpのコードミス

 style.cssを間違えると管理画面でエラーですよ。と現れるので、もう一度スペルの確認をした方が良いです。私は3回ほどエラーになりました。

 single.phpのペースト位置ですが、私はphpに関する知識はないですが、なんとなくこの辺にコードをペーストしたらいいかなという感じで取り組んでいたら、記事の上に貼り付けられたり、最下部に貼り付けられたりしました。その都度、変更してアップロードするっていう感じ何回もペーストすると、自分の位置に収まると思いますので、一度で諦めず、何度か試してみて下さい。

 functions.phpのコードを間違えると、画面が真っ白になります。しかし、FTPソフトで削除すると元に戻りますので、慌てずに冷静に対応すれば良いと思います。あと、万が一のためにバックアップを取ってカスタマイズされた方が良いと思います。

 

まとめ

いかがでしたでしょうか?wordpressのカスタマイズが初めての方はどのようにするか手順がつかめていただけたのではないかなと思います。私自身も初めてでしたので、ミスしながら、スペルの訂正やペーストの位置を変えたりして試しました。参考にしていただき、カスタマイズの一助になれば幸いです。

設置したバイラルメディア風facebookボタンに動きをつけたい方はこちら をご覧ください。

プラグインで簡単にバイラルメディア風facebookボタンを設置する方法

プラグインで簡単に設置する方法について知りたい方はご覧下さい。

この記事が気に入ったら
いいね!しよう

最新情報をお届けします

Twitterでshare lifeをフォローしよう!

中川 憲治

470,363 views

動画編集やWEB関連などを当ブログに書き出して2年後、12年間働いていた消防士を辞め、自分のやりたいことを仕事にしたいと考えてWEB業界に転職する。 自身の...

プロフィール