サポート » テーマ » テーマRaindrops トップページの作り方

  • kuroneko33

    (@kuroneko33)


    テーマRaindropsでトップページを制作しております。

    現在はノーマル?のトップーページで、新着記事の上段が指定件数分表示されています。

    これを残したまま、その上と下にトップページ用のコンテンツを書き足したいと思っています。

    スティッキーウィジェットですと、右カラムまで一緒に下に下がってしまうため、
    使いにくく、下段の「過去の投稿」の下に記事を書きたいのですが、
    ソースに直接書き込むことは更新を考え、避けたいと考えております。

    固定ページを新たに作る場合、現在の最新記事指定件数分を表示するショートコードなどが
    ありましたら、その前後に記事を作成してトップページにできるのかなと思っています。

    固定ページをトップページにする方法や、様々なテンプレートが用意されている
    記事を取扱説明書で拝見したので、試してみたのですが、思うようにできなかったので、
    ご相談させていただきました。

    どうぞ宜しくお願い申し上げます。

8件の返信を表示中 - 1 - 8件目 (全8件中)
  • nobita

    (@nobita)

    こんにちは、

    ソースに直接書き込むことは更新を考え、避けたいと考えております。

    チャイルドテーマを作成していただくと、カスタマイズした部分を保護しながら、Raindropsテーマの更新を行う事ができるようになります。

    作成方法は、

    http://www.tenman.info/wp3/manualraindrops/%E3%83%81%E3%83%A3%E3%82%A4%E3%83%AB%E3%83%89%E3%83%86%E3%83%BC%E3%83%9E%E3%81%AE%E4%BD%9C%E6%88%90%E6%96%B9%E6%B3%95

    を参照してください

    固定ページを新たに作る場合、現在の最新記事指定件数分を表示するショートコードなどが
    ありましたら、その前後に記事を作成してトップページにできるのかなと思っています。

    http://www.tenman.info/wp3/manualraindrops/template/%E5%9B%BA%E5%AE%9A%E3%83%9A%E3%83%BC%E3%82%B8%E3%83%86%E3%83%B3%E3%83%97%E3%83%AC%E3%83%BC%E3%83%88/%E5%88%9D%E5%BF%83%E8%80%85%E5%BF%85%E8%A6%8B%E3%80%80brank-front-%E3%83%86%E3%83%B3%E3%83%97%E3%83%AC%E3%83%BC%E3%83%88

    このテンプレートはお試しいただいたことがありますか?
    ショートコードではありませんが、テンプレートの操作で、最近の投稿などを表示する事ができます。

    トピック投稿者 kuroneko33

    (@kuroneko33)

    お返事ありがとうございます。

    チャイルドテーマを作成したのですが、
    「チャイルドテーマの作成方法」に記載されている
    ・functions.phpの作成

    ですが、これは新たに「functions.php」のファイルを作成するのか、
    テーマにある「alias_functions.php」のことを指しているのかどちらでしょうか?

    テンプレートは設定してみました。

    最近の投稿の下に、固定ページが表示されるので、固定ページを修整すれば
    トップページに反映されるので、非常に良い感じです。

    ただ、 $show_sticky_post = false; を true にすることで、
    最近の投稿が表示されたのですが、
    標準のトップページやカテゴリーでは、投稿ページの”more”までを表示してくれるので、
    数件分が段落ごとに表示されるのですが、このテーマですと、”more”は無視され、
    ページ全体が件数分表示されてしまいます。

    もう少しのような感じなのですが、どうぞよろしくお願いいたします。

    천궁 메텔

    (@digitmaetel)

    kuroneko33 さん
    チャイルドテーマとして指定したディレクトリに、
    functions.php を新規作成
    もとにする Raindrops テーマに備わっていない機能を追加する時にはこちらに記載します。
    また、もとにする Raindrops にある機能を、独自仕様にしたい場合もこちらに記載します。

    チャイルドテーマの方の functions.php に記載されていることを先に読み込む仕組みに WordPress はなっています。
    同じ関数があっても優先されます。

    nobita

    (@nobita)

    こんにちは、

    functions.phpは、digit@maetelさんが 既にお答えいただいている通りです

    digit@maetelさん ありがとうございます。

    kuroneko33さん いろいろ試していただきありがとうございます。

    ただ、 $show_sticky_post = false; を true にすることで、
    最近の投稿が表示されたのですが、
    標準のトップページやカテゴリーでは、投稿ページの”more”までを表示してくれるので、
    数件分が段落ごとに表示されるのですが、このテーマですと、”more”は無視され、
    ページ全体が件数分表示されてしまいます。

    Raindropsテーマでは、sticky postは、トップページだけで表示し、アーカイブページなどでは、本文を表示しない仕様になっています。
    実際、moreを使えるようにしてほしい、といったリクエストもあるのですが、どうしたものかと思案はしていますが、すぐに変更する事はできない状態です。

    いろいろ 思案をめぐらした結果、ループページの最初と最後にコンテンツを追加できるように、次回のRaindropsで変更を加える事にしました。

    WordPressには、一定の名前を付けたテンプレートが、指定した場面で自動的に適用されるテンプレート階層という仕組みがありますが、Raindropsにも、テンプレートパートファイルを、特定の名前にしておくと、サイドバーやページトップに自動的に表示できる機能があり、その機能を拡張したいと思います。

    今回追加する機能は、大体こんな感じのものにしたいと思っています。

    http://www.tenman.info/wp3/manualraindrops/files/loop-before-after-content.png

    画像が汚くてごめんなさい

    よろしければ、この機能を実現するチャイルドテーマの作成の仕方を書きますので、試してみて満足できるようなものになっているか、感想をお知らせいただけるとうれしいです。

    child theme ホルダー名: test-b

    style.css

    /*
    Theme Name: test b
    Theme URI: http://www.tenman.info/wp3/raindrops/
    Description: Test append loop and prepend loop hook
    Author: nobita
    Author URI: http://www.tenman.info/wp3/
    Version: 0.1
    License: GNU General Public License v2.0
    License URI: http://www.gnu.org/licenses/gpl-2.0.html
    Template: raindrops
    */

    functions.php

    <?php
    
    /* Basic Settiongs for Raindrops child theme */
    
    add_action( 'switch_theme', 'puddle_uninstall' );
    
    function puddle_uninstall(){
    
        delete_option("raindrops_theme_settings");
    }
    
    /* Custom Settings for Raindrops ver 1.203 */
    
    $parent_theme_info = wp_get_theme( 'raindrops' );
    
    if ( $parent_theme_info->exists() ) {
    
    	$parent_version = $parent_theme_info->get( 'Version' );
    
    	if ( $parent_version < 1.204 ) {
    
    		/**
    		 *
    		 *
    		 *
    		 *
    		 * @since 1.204
    		 */
    		function raindrops_prepend_loop( ) {
    			$args = array( 'hook_name' => 'raindrops_prepend_loop', 'template_part_name' => 'hook-prepend-loop.php' );
    
    			get_template_part( 'hook', 'prepend-loop' );
    			do_action( 'raindrops_prepend_loop', $args );
    		}
    		/**
    		*
    		*
    		*
    		*
    		* @since 1.204
    		*/
    		function raindrops_append_loop( ) {
    			$args = array( 'hook_name' => 'raindrops_append_loop', 'template_part_name' => 'hook-append-loop.php' );
    
    			get_template_part( 'hook', 'append-loop' );
    			do_action( 'raindrops_append_loop', $args );
    		}
    	}
    }
    ?>

    loop.php(チャイルドテーマ内に作ってください)

    このコードは、ちょっと長いので以下のリンクからこぴぺしてください

    https://gist.github.com/tenman/9754001

    以下のコードを全体を選択して、loop.phpに貼り付けてください

    https://gist.githubusercontent.com/tenman/9754001/raw/7856403fec656644423ad0e69d0af50c941c6b16/loop.php

    hook-prepend-loop.php(チャイルドテーマ内に作成してください)

    <?php if ( is_front_page() ) { ?>
    
    <div>
    <h2>Hello World Before loop</h2>
    <p> your content here </p>
    </div>
    
    <?php } ?>

    hook-append-loop.php(チャイルドテーマ内に作成してください)

    <?php if ( is_front_page() ) { ?>
    
    <div>
    <h2>Hello World After loop</h2>
    <p> your content here </p>
    </div>
    
    <?php } ?>

    hook-append-loop.php, hook-prepend-loop.php 煮記述した、htmlやphpがトップページのループの最初と最後に表示されるようになると思います

    (チャイルドテーマは作成の上テストを行っていますので、動作はすると思います。)

    注: blank-front固定ページテンプレートは、使わないでデフォルトの表示に戻してください。

    もうちょっと違うよ、とか あれば遠慮なく書き込んでください。

    トピック投稿者 kuroneko33

    (@kuroneko33)

    お世話になります。

    わがままな注文にも関わらず、これほどご丁寧にアドバイスいただけて深く感謝いたします。

    digit@maetel様 ありがとうございます。
    いろいろ勘違いをしていましたが、すっきりいたしました。

    nobita様

    本当にありがとうございます。

    ご指示いただきました通り、子テーマを作り、そこにファイルを作ることで、
    正常に動きました。

    まさにこの形を作りたかったので、非常に嬉しいです。

    これで、トップページにご挨拶や更新情報、その下に告知情報など、
    多くの要素を盛り込むことが出来そうです。

    一つ希望を申しますと、hook-append-loop.php, hook-prepend-loop.php に
    HTMLでテーブルを入れようと思っているのですが、どうしても文字化けしたり、
    左右のカラムがバラバラになったりと、どうもうまくいきません。
    これはまた別の問題だと思うのですが、できればこの前後の記述を固定ページなどで
    記述できるようにしていただけますと、簡単に更新ができるので便利になるかなと思いました。

    非常に使いやすいテーマなので、益々便利になっていくのではと嬉しく思っております。

    nobita

    (@nobita)

    テーブルのhtmlの記述については、以下のリンクを参考にしてみてください

    http://www.tenman.info/wp3/manualraindrops/archives/1065

    Raindropsのtableのデフォルトスタイルが、table-layout:fixedなため、カラム幅の調整がうまくいかないといった問題があると思いますが、

    table要素のclass属性に auto とテキスト左寄せにする left を入れていただけば、幅の調整が効くようになると思います。

    文字化けについては、テキストエディタがUTF-8のBOMなしになっているかどうかをチェックしてみてください。

    できればこの前後の記述を固定ページなどで
    記述できるようにしていただけますと、簡単に更新ができるので便利になるかなと思いました。

    現状では、ページ本文を挟み込むような形での挿入は可能です。

    hook-prepend-entry-content.php

    hook-append-entry-content.php

    のテンプレートが使えます。

    値は、ページの場合だけ適用されるように、必ずコンディショナルタグでくくっておくといいです。

    <?php if ( is_page() ) { ?>
    
    <h2>Hello World</h2>
    
    <?php }?>

    固定ページのテンプレートパートファイルのご要望は、今後の課題とさせてください

    今回の更新では、トップページ、検索結果ページ、カテゴリアーカイブ、月次アーカイブ(ループ表示のページ)で、前後にテンプレートが挿入されるようにしたいと考えています。

    Raindropsのアップデートにご協力いただきありがとうございます。

    追伸:現在ご使用いただいているチャイルドテーマのloop.phpは、Raindrops1.204にアップデートすると、必要なくなりますので、アップデート後、お暇なときにでも、削除お願いします。

    nobita

    (@nobita)

    先ほど、1.204がレビュー審査を通過したので、数日後には新しいバージョンがライブになると思いますので、よろしくお願いします。

    なを、今回の変更で、IE8などのオールドブラウザへのhtml5サポートを打ち切りました。

    これまでヘッダーにあった

    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>

    を削除しました。

    その代わり、IE8以下の場合は、強制的にxhtmlで表示されるようになりますので、その点もご留意ください。

    トピック投稿者 kuroneko33

    (@kuroneko33)

    本当に詳しく解説いただきありがとうございます。

    私のわがままがアップデートに協力などと言われますと、大変恐縮してしまいます。

    テーブルも、まだガタガタですが、何となく形になりそうなところまで来ました。

    今回、的確なアドバイスと新しいソースまで組んでいただき、本当にありがとうございます。

    ここまで対応していただけるテーマ制作者様は、他にはいないのではないでしょうか?

    本当に素晴らしいテーマに巡り合えて感謝でいっぱいです。
    ありがとうございました。

8件の返信を表示中 - 1 - 8件目 (全8件中)
  • トピック「テーマRaindrops トップページの作り方」には新たに返信することはできません。