*

Stinger3 に対して行ったカスタマイズのセルフまとめ #Stinger-WP


ちわ、秋田@豊作(@housakuakita‎)です。

Stinger Advent Calendar 2013

このブログ「OBRIGADO! ARIGATO!Stinger を使わせてもらう前は、購入したテンプレートに手を加えて運用していました。今年の夏頃、秋田がチェックしているブロガーのブログが、結構な割合で似たようなデザインになり、なかなか行けてる感じのレイアウト変わって来ました。フッタを見ると皆同じ「Stinger」。

それらブログのフッタリンクを辿り「Stinger」と出会いました。

おぉ〜!フリーじゃん!」って事で早速インストール。秋田のブログも、チェックさせてもらっているブロガーさん達の仲間入りぃ〜!てな事で、それから Stinger と暮らす日々が始まった訳です。

Stinger にしてから程なく「Stinger3」がリリースされたので、入れ替え。今は「Ver 20130906」を利用。

Stinger を作成し、無料配布しているENJILOGさんに感謝します。

また、今日のこのエントリーは「Stinger」好きが集まって行っている「Stinger Advent Calendar 2013」。12月1日からクリスマスの25日まで、「Stinger」をお題に、ブログでリレーを行っていくイベントへの参加エントリーです。

立案者のniji_mamiさんに感謝致します。

さて「Yuta Watanabe @fukujion」さんからバトンを空中で受け取りました(笑)。「Stinger3」に出会ってからこれまでに行ったカスタマイズをまとめてみます。

medium_6485865107
photo credit: Puzzler4879 via photopin cc

メインビジュアルの変更

インストール直後、まずはメインビジュアルの変更。流石にそのままって訳にはいかない。

皆さんどうやっているのか解らないが、秋田の場合はメインビジュアルを作ってそのまま上書き作戦

メインビジュアルは

/wp-content/themes/stinger3ver20130906/images/stinger3.png

ここに配置されているので、FTP ソフトを使いファイルをダウンロード。フォトショップ等の画像レタッチソフトを使い画像を加工。

再び FTP ソフトを使って該当ファイルを上書き。

これでメインビジュアルが入れ替えられます。

今、改めて見てみると、左メニューの「外観」→「ヘッダー」から入れ替えられますね。ややこしい事をしてしまった・・・(涙)

リスト表示時にショートコードを見せなくする方法

実際に運用に入って行くと、リスト表示の時にショートコードがそのまま見えてしまって、なんだか格好悪いなぁ〜と思ったので、ショートコードをエスケープするようにカスタマイズをしました。

これのエントリーはこちら「WordPress STINGER3 を使っていてショートコードが見えちゃって嫌な場合の対処法(簡易版)

/wp-content/themes/stinger3ver20130906/functions.php に、

 //ショートコードを外す function akita_noshotcode($content){ $rtn = ""; preg_match("/\[.+?\]/",$content,$retArr); $rtn = str_replace($retArr[0],'',$content); return $rtn; } 

 

 

を記述し、

/wp-content/themes/stinger3ver20130906/sidebar.php
/wp-content/themes/stinger3ver20130906/archive.php
/wp-content/themes/stinger3ver20130906/home.php
/wp-content/themes/stinger3ver20130906/single.php

それぞれのファイルの

 strip_tags($post-> post_content); 

 

 

となっている箇所を

 strip_tags(akita_noshotcode($post-> post_content)); 

 

 

と書き換えます。

これでリスト表示箇所で、ショートコードを見せなくする事が出来ました。

アイキャッチの登録回避

medium_3295094303
photo credit: @Doug88888 via photopin cc

Stinger のリスト部分は、サムネイルが表示されるようになっています。アイキャッチ登録が無い場合は「no image」が表示されるようになっています。

このブログ、今では300エントリーですが、Stinger3 に入れ替えた事は100エントリー程度。なんとか手動でアイキャッチ登録をしたのですが、以前書いてブログは500エントリー以上あり、アイキャッチ登録なんてしてませんでした。

気軽に Stinger3 テーマを入れ替えたのですが、一つ一つアイキャッチ登録をしなけれ格好わるくて仕方が無い。元のテーマに戻すか?このままアイキャッチ無しで使い続けるか?それとも頑張ってアイキャッチ登録するか?とても悩みました。

画像はそれなりに記事に入れてあるので、なんとかそれを使えない物か?と考え、「アイキャッチが登録されていなかったら、記事中の1つ目の画像をサムネイルとして使う」ってカスタマイズをしました。

これのエントリーはこちら「WordPress STINGER3 を使っていてアイキャッチを登録したくない場合の対処法

/wp-content/themes/stinger3ver20130906/functions.php に、

 function akita_catch_that_image($content) { $first_img = ''; ob_start(); ob_end_clean(); $output = preg_match_all('/<img.+src=[\'"]([^\'"]+)[\'"].*>/i', $content, $matches); $first_img = $matches [1] [0]; if(empty($first_img)){ //Defines a default image $first_img = get_template_directory_uri()."/images/no-img.png"; } return $first_img; } 

 

 

を、記述。

それぞれのファイルの該当する箇所を書き換えます。

/wp-content/themes/stinger3ver20130906/sidebar.php

 <img src="<?php echo get_template_directory_uri(); ?>/images/no-img.png" alt="no image" title="no image" width="100" height="100" /> ↓ <img src="<?php echo akita_catch_that_image($post->post_content); ?>" width="100" /> 

 

 

/wp-content/themes/stinger3ver20130906/archive.php

 <img src="<?php echo get_template_directory_uri(); ?>/images/no-img.png" alt="no image" title="no image" width="150" height="150" /> ↓ <img src="<?php echo akita_catch_that_image($post->post_content); ?>" width="150" /> 

 

 

/wp-content/themes/stinger3ver20130906/home.php

 <img src="<?php echo get_template_directory_uri(); ?>/images/no-img.png" alt="no image" title="no image" width="150" height="150" /> ↓ <img src="<?php echo akita_catch_that_image($post->post_content); ?>" width="150" /> 

 

 

/wp-content/themes/stinger3ver20130906/single.php(2ヶ所あります)

 <img src="<?php echo get_template_directory_uri(); ?>/images/no-img.png" alt="no image" title="no image" width="110px" /> ↓ <img src="<?php echo akita_catch_that_image($post->post_content); ?>" width="110" /> 

 

 

これで、元のテーマに戻す事無く Stinger3 にする事が出来ました。

画像を掲載していないエントリーもあります。その場合は Stinger3 に元々用意されている「no image」画像が表示されます。こちらが並ぶと味気ないので、会社のロゴに変更。少しいい感じになりました。

デフォルトの no image を変更する場合は、「/wp-content/themes/stinger3ver20130906/images/no-img.png」を入れ替えます。

見出しアイコン設置

色々な方の Stinger サイトをみていると、hタグにいい感じのアイコンが付いています。う〜ん。秋田も欲しぃ〜!とのたうち回ったのですが、自分では上手に出来ない。

デザイナーのスタッフにお願いしてアイコン作ってもらいました。

エントリーはこちら「WordPress テーマ STINGER ちょいとお洒落をさせてもらい、個性を出してみました。

h1 〜 h3 の画像を用意

h1

h2

h3

CSS に関しては Stinger3 サイトのエントリー「見出し命!ブログに必要なデザイン」を参考にするようにと、スタッフに伝え作業依頼。

お気に入りの Stinger3 に仕上がりました。

まとめ

medium_4745520501
photo credit: Denis Dervisevic via photopin cc

他にも色々とカスタマイズは行っていますが、それは Stinger3 じゃなくても行ったカスタマイズです。今回のエントリーは Stinger 縛りなので、Stinger3 だからこうカスタマイズした。ってカスタマイズに絞ってまとめてみました。

Stinger3 は、お気に入りのテーマです。知人のブログを立ち上げる時にも使っています。「地下鉄のギタリスト 復活編 〜ギターその愛〜」。知人も気に入って頂けているようです。

てな訳で Stinger Advent Calendar 2013 18日目。皆さんのお役に立てましたでしょうか?少しでも皆さんの Stinger life のお役に立てたらな幸いです。

明日の担当は「hamako9999」さん。バトン渡します。よろしくお願いします!

2013/12/18 | wordpress

関連記事

ブログ全体 WordPress を SSL 化しました

ポケモン GO! 金銀のポケモンがリリースされましたね。 しかし・・...

記事を読む

WordPress 引数で固定ページ動的出力の rewrite

WordPress の固定ページ(投稿ページでも可)にショートコードを...

記事を読む

今年の総括、2015年を振り返ってみる

いや〜早いものでいよいよ今日が仕事納めです。 まあ、最近は日の経...

記事を読む

クミンでダイエット!次のアイアンマンまでに腹割るぞぉ〜!

先日、トライアスロントレーナの「河原 勇人」氏に、内臓脂肪を落とし...

記事を読む

WordPrss カスタムポストタイプのカテゴリリスト出力、ソースコード付

あるサイトを WordPress で構築しているのですが、ありがたい事...

記事を読む

新着記事

新しいウクレレ Mabuhay MTS-NAZCA/MK MONKEY 買ったのでカスタマイズ

新しいウクレレ Mabuhay MTS-NAZCA/MK MONKEY...

記事を読む

祝!定食復活!福しん 蓮 中野店

いや〜嬉しい! 最近の事だったけど「福しん 中野店」が改装しまして・...

記事を読む

ウクレレレッスン動画【島人ぬ宝 / BEGIN】

え〜・・・YouTubeへのアクセス数を稼ぐために、レッスン動画に手を...

記事を読む

ウクレレブーム到来?ガズレレめっちゃ流行ってます

秋田こう見えてもウクレレ教室に通ってます。 って言ってもそんなにかし...

記事を読む

ウクレレレッスン用の動画をつくってみました

GWの前半は、キャンプ行ったりダラダラしたり。どちらかというと不摂生。...

記事を読む

コメント/トラックバック (8件)

トラックバック用URL:

コメントフィード

  1. […] 秋田@豊作さんのStinger3 に対して行ったカスタマイズのセルフまとめ #Stinger-WPから確かにバトン受け取りました!! […]

  2. […] Stinger3 に対して行ったカスタマイズのセルフまとめ […]

  3. […] Stinger3 に対して行ったカスタマイズのセルフまとめ #Stinger-WP […]

  4. […] ARIGATO! Stinger3 に対して行ったカスタマイズのセルフまとめ #Stinger-WP ただsingle.phpを2ヶ所変更するって書かれていましたが […]

  5. […] URLhttp://obrigado.biz/ […]

  6. […] Stinger3 に対して行ったカスタマイズのセルフまとめ #Stinger-WP […]

  7. […] Stinger3 に対して行ったカスタマイズのセルフまとめ #Stinger-WPStinger3 に対して行ったカスタマイズのセルフまとめ #Stinger-WP … […]

  8. […] Stinger3 に対して行ったカスタマイズのセルフまとめ #Stinger-WP […]




管理人にのみ公開されます

*

8月30日 ソロギタリスト IN 梅若能楽堂学院会館「出音一番勝負」
Stinger Advent Calendar 2013
ネットショップは豊作カートで
新しいウクレレ Mabuhay MTS-NAZCA/MK MONKEY 買ったのでカスタマイズ

新しいウクレレ Mabuhay MTS-NAZCA/MK MONKEY...

祝!定食復活!福しん 蓮 中野店

いや〜嬉しい! 最近の事だったけど「福しん 中野店」が改装しまして・...

ウクレレレッスン動画【島人ぬ宝 / BEGIN】

え〜・・・YouTubeへのアクセス数を稼ぐために、レッスン動画に手を...

ウクレレブーム到来?ガズレレめっちゃ流行ってます

秋田こう見えてもウクレレ教室に通ってます。 って言ってもそんなにかし...

ウクレレレッスン用の動画をつくってみました

GWの前半は、キャンプ行ったりダラダラしたり。どちらかというと不摂生。...

→もっと見る

PAGE TOP ↑