web-dev-qa-db-ja.com

メニューバーを維持しながら、すべてのページを1つにマージする方法

私は現在基本的な組織のあるウェブサイトを持っています:5つの異なるページ( "About us"、 "projects" ...など)と典型的なメニューバー。

すべてのページを1つのページにまとめたいと思います。 1)すべてのページをホームページに表示する方法

私は(一種の)メニューバーも残しておきたい。たとえば、メニューバーの「プロジェクト」をクリックすると、リーダーがメインページのプロジェクト部分に表示される。 2)どうやってそのようなメニューバーを作ることができますか?

私は(残念ながら)Wordpressとコーディングの知識が限られています。詳細な回答は大歓迎です:)

ありがとう、イネス

1
Inès Joubert

これには2つの方法があります。

1)WordPressダッシュボードのページを個別のページのままにして、それらのページコンテンツをリストするカスタムページテンプレートを作成します。このカスタムテンプレートをホームページに割り当てます。

2)これらのページのコンテンツをホームページエディターに移動します。

オプション1:

よりクリーンなオプションで、後の段階で個々のページに戻ることができます。また、ページの編集が非常に簡単になります。

カスタムページテンプレート をセットアップします。page-home.phpと呼びますが、好きなように呼び出すことができます。

テーマフォルダー内にこのテンプレートを作成する必要があります。 (WordPressの標準インストールの)パスは/ wp-content/themes/your-theme /である必要があります。ここで、「your-theme」はテーマの名前です。

NB:テーマが更新された場合、おそらくこのテンプレートは失われます。これを防ぐには、 子テーマを作成することをお勧めします

Page.phpの内容をコピーして、新しく作成したpage-home.phpに貼り付けて、テーママークアップを保持するのがおそらく最も簡単です。 page-home.phpの上部に次を挿入します。

<?php
/*
 * Template Name: Home Page
 */
?>

ほとんどの場合、次のようなデフォルトループを探します。

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>

    <!-- Loop HTML/PHP -->

<?php endwhile; endif; ?>

次に、デフォルトのループを次のコードに置き換えます。

<?php
    $pages = get_pages( array(
        'sort_column' => 'menu_order', // allows you to order pages using menu order under page attributes
        'exclude' => 3, // the home page ID
    ) );
?>

<?php
    foreach ( $pages as $page ) {
        $content = $page->post_content;
        if ( ! $content ) // Check for empty page
            continue;

            $content = apply_filters( 'the_content', $content );
            ?>
        <div id="page-<?php echo $page->ID; ?>">
            <?php echo $content; ?>
        </div>
        <?php
    }
?>

このテンプレートをテーマに保存したら、ホームページを編集してください。 (まだ存在していない場合は、作成してダッシュボード>設定>読み取りに移動し、フロントページの表示オプションを静的ページに変更して、新しく作成したホームページを選択します。)および テンプレートを選択 =。

オプション1メニュー

各セクションには、このようなpage-34のようなIDがあります。34はページIDです。ページIDの検索方法がわからない場合は、 この動画をご覧ください

通常、[外観]> [メニュー]でメニューを作成します。ただし、ページを挿入する代わりに、リンクを使用します。たとえば、IDが34のダミーという名前のページを追加するとします。メニューに移動し、[リンク]ドロップダウンに切り替えます。 URLフィールドに「#page-34」と入力し、リンクテキストフィールドに好きなものを入力しますが、私のものは「ダミー」になります。次に、メニューに追加をクリックします。

メニューに追加するすべてのページで、すすぎと繰り返しを行います。メニューを保存すると、各メニュー項目が関連するセクションにリンクする標準のWordPressメニューが表示されます。

オプション2:

ホームページを編集し、WYSIWYGエディターのテキストビューに切り替えます。

「ページ」ごとに、このような一意のIDを持つdivを追加します。

<div id="page-about">
    <!-- about page content here -->
</div>

これらのdivタグの間にページコンテンツを挿入します。ホームページに追加するページごとに繰り返します。例えば:

<div id="page-contact">
    <!-- contact page content here -->
</div>

オプション2メニュー

通常、[外観]> [メニュー]でメニューを作成します。ただし、ページを挿入する代わりに、リンクを使用します。 Aboutページセクションにリンクするには、URLを「#page-about」に設定して新しいリンクを追加します。連絡先ページセクションにリンクするには、URLを「#page-contact」に設定して新しいリンクを追加します。他のすべてのページの繰り返しをすすいでください。

1
Duane