Twenty Thirteen カスタマイズ

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

目次

  • アイコンフォント「Genericons」を無効化
  • ヘッダ画像のサイズを変更する
  • "Proudly powered by WordPress" 非表示
  • コメント欄停止・コメント削除

別記事

「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 Twelve 投稿日・投稿者を非表示に

TwentyTwelveのちょっとした部分をカスタマイズする方法を紹介していきます。 また、子テーマで出力部分を変更する際に、翻訳が必要な部分//_()の部分がでてきますので、以下の投稿も参考に

ツールチップ実装プラグイン「WordPress Tooltip」

「WordPress Tooltip」は、WordPressにツールチップを実装できるプラグインです。jQueryプラグイン「TipTip」を組み込んでいます。プラグインページの対応バージョンは古めで

「カテゴリー」ウィジェット カスタマイズ

「カテゴリー」ウィジェットは、管理画面ではあまりカスタマイズできません。必要であれば、フックやプラグインを用いて表示設定などの変更を行うことができます。 目次 「カテゴリー」ウィジェットの追加

Twenty Fourteenカスタマイズ用プラグインと派生テーマ

WordPressの現在のデフォルトテーマ「Twenty Fourteen」のカスタマイズに便利なプラグインと、「Twenty Fourteen」をもとに作成されたテーマのまとめです。 カスタマ

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

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

多言語化プラグイン「qTranslate」

ブログを多言語化しようと思い、プラグイン「qTranslate」を導入してみました。 General Settingsで使用する言語を選択する ★使用する言語を選択 管理画面「設定」⇒「Lang

"コメントを残す" 削除・文言を変更する方法

コメントフォームに表示される「コメントを残す」はWordPress標準で翻訳される要素です。テーマ側でカスタマイズしていない限り表示されます。 ここでは、この要素を削除したり、文言を変更する方法を紹

Twenty Fifteen カスタマイズ

WordPress 4.1のデフォルトテーマである「Twenty Fifteen」は三世代前の「Twenty Twelve」に似たテーマで非常にシンプルなテーマにまとまっていますね。カスタマイズをまと

no image

Pocketボタンの設置

日本のブログでは、4大SNS(Twitter, はてな, Facebook, Google+)に加えて最近では、Pocket(以前は、Read it later)もよく見かけますよね。追加してみました

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

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

Comment

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

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

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

    • コメントありがとうございます。
      いただいたコメントは「質問いただいた」と理解して
      (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;
      }
      
    • 返信ありがとうございます!

      私がやりたいと思ったのは、(1)のほうです。
      分かりにくい文ですみませんでした。。

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

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

*

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

    PAGE TOP ↑