*

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

関連記事

19be7dd5715dc4e4237b603fac79dfe8_s

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

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

記事を読む

dc537b0820bf1e0c9d737231273006cb_s

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

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

記事を読む

IMG_1675

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

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

記事を読む

medium_2186228674

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

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

記事を読む

medium_394359583

Contact Form DB 2.7.5 文字化けではまった

今回のエントリーはプログラム関係になるので、チンプンカンプンの方もいら...

記事を読む

新着記事

img_2999

東海道ランの旅 三雲駅 〜 草津宿(26日目2016.09.10)

新幹線で京都まで行き、琵琶湖線で草津駅へ。宿泊予定の「スーパーホテル滋...

記事を読む

img_2559

水口宿へ行こう東海道編(ロンドン100連発[88/100])

え〜巷では「ピコ太郎」の「ペンパイナッポーアッポーペン」が大流行って事...

記事を読む

img_2883

土山宿へ行こう東海道編(ロンドン100連発[87/100])

ポケモンGO、ポケモンを調べてもらうを使ってポケモンを4段階に分け個体...

記事を読む

img_2311

坂下宿へ行こう東海道編(ロンドン100連発[86/100])

ポケモンGO の図鑑は 131。だいぶ集めたけど、国内コンプリートまで...

記事を読む

img_2204

関宿へ行こう東海道編(ロンドン100連発[85/100])

ポケモンGO、レベル29になりました。次のレベルまでは 350,000...

記事を読む

コメント/トラックバック (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
ネットショップは豊作カートで
img_2999
東海道ランの旅 三雲駅 〜 草津宿(26日目2016.09.10)

新幹線で京都まで行き、琵琶湖線で草津駅へ。宿泊予定の「スーパーホテル滋...

img_2559
水口宿へ行こう東海道編(ロンドン100連発[88/100])

え〜巷では「ピコ太郎」の「ペンパイナッポーアッポーペン」が大流行って事...

img_2883
土山宿へ行こう東海道編(ロンドン100連発[87/100])

ポケモンGO、ポケモンを調べてもらうを使ってポケモンを4段階に分け個体...

img_2311
坂下宿へ行こう東海道編(ロンドン100連発[86/100])

ポケモンGO の図鑑は 131。だいぶ集めたけど、国内コンプリートまで...

img_2204
関宿へ行こう東海道編(ロンドン100連発[85/100])

ポケモンGO、レベル29になりました。次のレベルまでは 350,000...

→もっと見る

PAGE TOP ↑