Twenty Thirteen カスタマイズ

WordPress 3.6のデフォルトテーマである「Twenty thirteen」のカスタマイズをまとめて投稿します。
Twenty thirteenのカスタマイズネタがあまりないです。(それだけ完成度が高いのか、それとも、イジりがいのないテーマなのか??) ネタ募集してますので、お問い合わせもしくはコメントいただけたらと思います。

別記事

Twenty Thirteen テーマ用フォント"Source Sans Pro" / "Bitter"の使用を止
Twenty Thirteen ナビゲーションメニューを固定

共通
投稿タイトル(entry-title)を非表示にする
 「編集(Edit)」リンクの非表示方法
 "コメントを残す" 削除・文言を変更する方法

「Twenty Thirteen」ベースのフリーテーマ 7
7 Free WordPress Themes Based on Twenty Thirteen

アイコンフォント「Genericons」を無効化

Twenty Thirteenでは、メタ情報や検索フォーム部分に「Genericons」というGPLで配布されているベクターアイコンを使用しています。記事のカテゴリーやタグなどの部分に付いてくるやつです。

使用しない場合は、子テーマのfunctions.phpに以下を追加して下さい。

// オリジナル：twentythirteen_scripts_styles in functions.php
function dequeue_genericons() {
    wp_dequeue_style( 'genericons' );
}
add_action( 'wp_enqueue_scripts', 'dequeue_genericons', 11 );

ヘッダ画像のサイズを変更する

ヘッダー画像は、管理画面の「概観」→「ヘッダ」で設定できます。
大きさを変更するには、add_theme_supportのcustom-headerに設定したい値を渡します。
以下はヘッダ画像の高さを400pxへ変更するコードです。

// オリジナル：twentythirteen_custom_header_setup in inc/custom-header.php
function my_twentythirteen_custom_header_setup() {
    $header_args = array( 
        'height' => 400
    );
    add_theme_support( 'custom-header', $header_args );
}
add_action( 'after_setup_theme', 'my_twentythirteen_custom_header_setup' );

"Proudly powered by WordPress" 非表示

2つ方法があります。

スタイルシートで消す方法

.site-info {
    display: none;
}

テンプレートを編集して消す方法

表示部分をコメントアウトして下さい。

// オリジナル：in footer.php
<?php if(0) { //コメントアウト開始 ?>
            <div class="site-info">
                <?php do_action( 'twentythirteen_credits' ); ?>
                <a href="<?php echo esc_url( __( 'http://wordpress.org/', 'twentythirteen' ) ); ?>" title="<?php esc_attr_e( 'Semantic Personal Publishing Platform', 'twentythirteen' ); ?>"><?php printf( __( 'Proudly powered by %s', 'twentythirteen' ), 'WordPress' ); ?></a>
            </div><!-- .site-info -->
<?php } //コメントアウト終了 ?>

コメント欄停止・コメント削除

TwentyThirteenでは、標準では、以下の3つのページでコメントフォームが表示されます。コメント欄出力部分をコメントアウトすることで、設定無しに停止・過去のコメントを非表示にすることができます。設定で行う場合はコチラ

シングルページ (single.php)
固定ページのデフォルトテンプレート (page.php)
画像(メディア)ページ (image.php)

コメントを無効にしたいページ(.php)の以下の部分をコメントアウトして下さい。

<?php comments_template( '', true ); ?>

: Twenty Fourteen クレジットを非表示・変更方法

Twenty Fourteenにも最下部に「Proudly powered by WordPress」というコピーライトが表示されます。それを削除もしくは変更するには、footer.phpを編集して行

: 画像マウスオーバーでキャプションを表示

メディアをアップロードした際に、「キャプション」項目にテキストを設定された画像を挿入した場合はキャプションショートコードが生成され、ページ内の各画像下にその設定したテキストが表示されます。今回

: サイトのキャプチャをショートコードで生成してくれる「Browser Shots」

外部のサイトを紹介する際にそのサイトのキャプチャが添えられているとイメージがつかみやすくなりクリックのモチベーションが上がるような気がします。今回は、ショートコード一行でサイトのスクリーンショット

: コメント欄停止・コメント削除

WordPressでは標準でコメント機能が付いてきます。この投稿ではコメント機能の停止や既に投稿されたコメントを削除する方法を紹介します。設定による停止方法新規の投稿に関してコメントを停止

: テーマブックマーク 2014

有料技術系・ガジェットサイトテーマ 30 Blog & Magazine Style WordPress Themes for Tech & Gadget Sites

: jQueryをCDNから読み込む

WordPressではデフォルトでjQueryライブラリが同梱されています。この記事では、それをやめて、CDNから読み込み、使用する方法を解説します。 WordPress 3.6 3.9 4.0

: Twenty Eleven カスタマイズ

目次 author-info 消す作成者(投稿者)を消す投稿者情報を表示しない proudly powered by wordpressのリンクをコピーライトに変更

: Tumblrの投稿をウィジェットに表示できる「Tumblr Widget」

このブログでは、サイドバーウィジェットに「Tumblr」に投稿したブックマーク一覧を表示させています。プラグインは「Tumblr Widget」を使用しています。ダウンロード「This plugi

: Twenty Thirteen テーマ用フォント "Source Sans Pro" / "Bitter"の使用を止

TwentyThirteenでは、テーマ用のフォントとして「Source Sans Pro」と「Bitter」というフォントをGoogleフォントから引っ張ってきて使用されるようです。ちなみにどの

: アップグレードで「更新を展開しています... 」のままになった場合の対処のひとつ

久々に出会ったような気がするのでメモです。ローカルのテスト環境でWordPressを3.7から3.8にアップグレードしようとしたところ、「更新を展開しています... 」で止まってしまい更新処理がす

Comment

aa より:

2015年11月27日 5:42 PM

コメント欄停止・コメント削除ですが

設定＞ディスカッション＞新しい投稿へのコメントを許可する
の方法もあります。

サイトタイトルの横スペースにリンク集を入れる方法を教えてください。

返信
@sirocco_jp より:

2015年8月13日 4:13 PM

“WordPress | Twenty Thirteen カスタマイズ” http://t.co/Su14edTtBJ

返信
Twenty Thirteen カスタマイズ | お得で格安情報 より:

2015年3月13日 4:20 PM

[…] 参考URL […]

返信
kozuwe より:

2014年8月31日 5:41 PM

Twenty thirteenの検索フォームをTwenty Twelveにカスタマイズしたい...!

返信
- kwski より:
  
  2014年9月2日 11:28 PM
  コメントありがとうございます。
  いただいたコメントは「質問いただいた」と理解して
  (1) Twenty Thriteenで表示されるような検索フォームをTwentyTwelveに組み込みたい。
  (2) Twenty Twelveで表示されるような検索フォームをTwenty Thirteenに組み込みたい。
  どちらでしょうか?
  
  (2)の場合を試してみたあと、いただいた質問をよくよく読むと上の疑問がでてきました。
  ひとまず、(2)の場合は、これでいけるはずです...!
  ーー
  Twenty Thirteenでは検索フォームがHTML5対応されていますのでまずそれを外します。
```
// 子テーマのfunctions.phpに追加
function my_twentythirteen_setup() {
    remove_theme_support( 'html5');
    add_theme_support( 'html5', array(
        'comment-form', 'comment-list', 'gallery', 'caption'
    ));
}
add_action( 'after_setup_theme', 'my_twentythirteen_setup', 9999);
```
  あとは、子テーマのstyle.cssにTwentyTwelveのスタイルを追加
```
/* 子テーマのstyle.cssに追加 */
#s {
    border: 1px solid #ccc;
    border-radius: 3px;
    font-family: inherit;
    padding: 0.428571rem;
}

input#searchsubmit {
    background-color: #e6e6e6;
    background-image: -moz-linear-gradient(center top , #f4f4f4, #e6e6e6);
    background-repeat: repeat-x;
    border: 1px solid #d2d2d2;
    border-radius: 3px;
    box-shadow: 0 1px 2px rgba(64, 64, 64, 0.1);
    color: #7c7c7c;
    font-size: 0.785714rem;
    font-weight: normal;
    line-height: 1.42857;
    padding: 0.428571rem 0.714286rem;
}
```
- kozuwe より:
  
  2014年9月8日 11:00 PM
  
  返信ありがとうございます！
  
  私がやりたいと思ったのは、(1)のほうです。
  分かりにくい文ですみませんでした。。
- kwski より:
  
  2014年9月17日 11:19 PM
  
  (1)について以下に投稿しました。
  ナビゲーションメニューに検索フォームを追加
@JyaaFunJyaa より:

2014年3月12日 1:31 AM

いいの見付けられた！しかも、STINGER3だ♪

Twenty Thirteen カスタマイズ http://t.co/qj17PA9F39
#wordpress #stinger3

返信
wordpressでwebサイトを立ち上げ時にやる事"まとめ" より:

2014年1月14日 11:20 AM

[…] Twenty Thirteen カスタマイズ […]

返信
shota1017 より:

2013年11月13日 10:53 PM

wordpress "proudly powered by" を消す
kasedac より:

2013年10月18日 1:40 PM

"ヘッダー画像は、管理画面の「概観」→「ヘッダ」で設定できます。大きさを変更するには、add_theme_supportのcustom-headerに設定したい値を渡します"