メニュー
ひとぅ
新しいもの好きな「ひとぅ」が2007年10月からガジェット製品や雑貨、面白いウェブサービスなどの情報を発信しています。お得な情報や役立つTIPSも人気です。
アーカイブ
カテゴリー

【随時更新】WordPressテーマ「Stinger」カスタマイズメモエントリー

  • URLをコピーしました!

※当サイトではアフィリエイト広告を利用しています

Vintage Memo Notepad
2013年8月23日より利用を開始したWordPressテーマ「Stinger2」のカスタマイズした箇所のメモエントリーです。この記事の内容は適宜、追加・更新します。

目次

標準機能利用

標準機能を利用しています。バージョンアップの際、変更する可能性、必要性は低いかも。

  • メニュー
    • 人気タグ、ひとぅブログについてのリンクを配置
  • ウィジェット
    • サイドバー1
      • SNSリンク、カウンターなど
    • スクロール広告用
      • Amazonアドセンスを配置
    • Googleアドセンス用
      • 336×228広告コードをひとつ配置(サイドバー、記事のあとに2つ自動配置される)

テーマ内PHP編集

テーマのバージョンアップ時に書き換えが必要になる可能性が高いので、特に重要な覚え書きです。

footer.php

Google Analysisコードを配置
< /body>直前に配置
[code firstline=”56″]
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push([‘_setAccount’, ‘UA-1848331-1’]);
_gaq.push([‘_trackPageview’]);

(function() {
var ga = document.createElement(‘script’); ga.type = ‘text/javascript’; ga.async = true;
ga.src = (‘https:’ == document.location.protocol ? ‘https://ssl’ : ‘http://www’) + ‘.google-analytics.com/ga.js’;
var s = document.getElementsByTagName(‘script’)0; s.parentNode.insertBefore(ga, s);
})();
</script>
[/code]

header.php

トップページのみSNSシェアボタンを非表示
表示部分をすべてコメントアウト(トップページ判断処理は元々有り)

[code firstline=”63″]
<?php if (is_home()) { ?>

<!–
<div id="snsbox">
<div class="sns">
<ul class="snsb clearfix">
<li>
<a href="https://twitter.com/share" class="twitter-share-button" data-count="vertical" data-via="" data-url="<?php echo get_option(‘home’); ?>" data-text="<?php bloginfo(‘name’); ?>">Tweet</a><script type="text/javascript" src="//platform.twitter.com/widgets.js"></script>
</li>
<li>
<iframe src="http://www.facebook.com/plugins/like.php?href=<?php echo get_option(‘home’); ?>&amp;layout=box_count&amp;show_faces=false&amp;width=50&amp;action=like&amp;colorscheme=light&amp;height=62" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:70px; height:62px;" allowTransparency="true"></iframe>
</li>
<li><script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script><g:plusone size="tall" href="<?php echo get_option(‘home’); ?>"></g:plusone></li>
<li>
<a href="http://b.hatena.ne.jp/entry/<?php echo get_option(‘home’); ?>" class="hatena-bookmark-button" data-hatena-bookmark-title="<?php bloginfo(‘name’); ?>" data-hatena-bookmark-layout="vertical" title="このエントリーをはてなブックマークに追加"><img src="http://b.st-hatena.com/images/entry-button/button-only.gif" alt="このエントリーをはてなブックマークに追加" width="20" height="20" style="border: none;" /></a><script type="text/javascript" src="http://b.st-hatena.com/js/bookmark_button.js" charset="utf-8" async="async"></script>
</li>
</ul>

</div>
</div>
–>
[/code]

iTunes(PHG)オートリンク用
[code firstline=”56″]
<script type=’text/javascript’>var _merchantSettings=_merchantSettings || [];_merchantSettings.push([‘AT’, ’11l6p8′]);(function(){var autolink=document.createElement(‘script’);autolink.type=’text/javascript’;autolink.async=true; autolink.src=’https://autolinkmaker.itunes.apple.com/js/itunes_autolinkmaker.js’;var s=document.getElementsByTagName(‘script’)0;s.parentNode.insertBefore(autolink, s);})();</script>

</head>
[/code]

テーマ内CSS編集

style.css

タイトルサイズ、タイトルスペース追加
[code firstline=”186″]
/*ブログタイトル*/

#container #header #header-in #h-l .sitename {
font-size: 40px;
color: #fff;
margin-top: 10px;
margin-bottom: 10px;
line-height: 30px;
}
[/code]

フォントサイズ、フォント種類変更
[code firstline=”31″]
* {
font-family:’Lucida Grande’,’Hiragino Kaku Gothic ProN’,
Meiryo, sans-serif;
margin: 0px;
padding: 0px;
}
body {
background-color: #f3f3f3;
}
p {
font-size: 16px;
line-height: 27px;
margin-bottom: 20px;
}
[/code]

画像の周りに線(行230〜244まで)
[code firstline=”225″]
.entry-title a {
color: #333;
text-decoration: none;
}

.sumbox img {
border:solid 1px #ccc;
padding:3px;
}

.post img {
border:solid 1px #ccc;
padding:3px;
}

/*アーカイブタイトル*/

.entry-title-ac {
font-size: 24px;
}
[/code]

ダミー用イメージに枠が付くのを防ぐ
[code firstline=”1414″]
img.bordernone{
border:none;
}
[/code]

smart.css

画像が横画面に収まるように追加
(iPhone5で500pxの画像がはみ出していたため)

[code firstline=”57″]
.post img{
max-width: 100%;
height: auto;
border:solid 1px #ccc;
padding:3px;
}
[/code]

ダミー用イメージに枠が付くのを防ぐ
[code firstline=”1009″]
img.bordernone{
border:none;
}
[/code]

この記事が気に入ったら
フォローしてね!

この記事をシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!
目次