web-dev-qa-db-fra.com

Comment fusionner toutes mes pages en une, tout en gardant une barre de menus?

J'ai actuellement un site Web avec une organisation de base: 5 pages différentes ("À propos de nous", "Projets" ... etc.) avec une barre de menus typique.

Je voudrais maintenant avoir toutes les pages en une seule. 1) Comment puis-je importer toutes mes pages dans la page d'accueil?

J'aimerais aussi conserver une (sorte de) barre de menus: par exemple, cliquer sur "projets" dans la barre de menus amènera le lecteur à la partie projet de la page principale. 2) Comment puis-je construire une telle barre de menus?

Malheureusement, j'ai une connaissance limitée de Wordpress et du codage. Des réponses détaillées seraient très appréciées :)

Merci, Inès

customizationpages
1
Inès Joubert

Vous pouvez le faire de deux manières.

1) Laissez les pages en tant que pages séparées dans le tableau de bord WordPress et créez un modèle de page personnalisé répertoriant le contenu de ces pages. Attribuez ce modèle personnalisé à la page d'accueil.

2) Déplacez le contenu de ces pages dans l'éditeur de page d'accueil.

Option 1:

Une option beaucoup plus propre et vous permet de revenir à des pages individuelles à un stade ultérieur. Cela facilite également l'édition de pages.

Configurer un modèle de page personnalisé , je vais l'appeler page-home.php, mais vous pouvez l'appeler comme bon vous semble.

Vous devrez créer ce modèle dans votre dossier de thèmes. Le chemin (dans une installation standard de WordPress) doit être/wp-content/themes/votre-thème /, où "votre-thème" est le nom de votre thème.

NB: Si votre thème est mis à jour, vous perdez probablement ce modèle. Pour éviter cela, je suggèrerais de créer un thème child .

Il est probablement plus facile de copier le contenu de page.php et de le coller dans votre page-home.php nouvellement créé pour conserver le balisage de thème. En haut de page-home.php, insérez ce qui suit.

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

Recherchez la boucle par défaut qui ressemble probablement à ceci.

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

    <!-- Loop HTML/PHP -->

<?php endwhile; endif; ?>

Maintenant, vous voulez remplacer la boucle par défaut avec le code suivant.

<?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
    }
?>

Une fois que vous avez enregistré ce modèle dans le thème, allez modifier votre page d'accueil. (S'il n'existe pas encore, créez-en un, accédez à Tableau de bord> Paramètres> Lecture, puis modifiez l'option Affichages de la page de couverture en page statique et sélectionnez la page d'accueil que vous venez de créer.) Et sélectionnez le modèle .

Option 1 Menu

Chaque section aura un ID ressemblant à ceci page-34, où 34 est l’ID des pages. Si vous ne savez pas comment trouver un identifiant de page, regardez cette vidéo .

Créez le menu comme vous le feriez habituellement sous Apparence> Menus. Au lieu d’insérer des pages, utilisez des liens. Par exemple, supposons que je souhaite ajouter une page nommée Dummy avec l'ID 34. Je voudrais accéder aux menus et passer au menu déroulant Liens. Dans le champ URL, entrez "# page-34" et dans le champ de texte du lien, entrez ce que vous voulez, mais le mien serait "Dummy". Puis cliquez sur Ajouter au menu.

Rincez et répétez pour toutes les pages que vous souhaitez ajouter au menu. Une fois le menu enregistré, vous devriez avoir un menu WordPress standard dans lequel chaque élément de menu est lié à la section correspondante.

Option 2:

Modifiez la page d'accueil et passez à la vue texte de l'éditeur WYSIWYG.

Pour chaque "page", ajoutez un div avec un ID unique comme celui-ci.

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

Insérez le contenu de la page entre ces balises div. Répétez l'opération pour chaque page que vous souhaitez ajouter à la page d'accueil. Par exemple:

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

Option 2 Menu

Créez le menu comme vous le feriez habituellement sous Apparence> Menus. Au lieu d’insérer des pages, utilisez des liens. Pour créer un lien vers la section à propos de la page, ajoutez un nouveau lien dont l'URL est définie sur "# page-about". Pour créer un lien vers la section de la page de contact, ajoutez un nouveau lien dont l'URL est définie sur "# page-contact". Rincer une répétition pour toutes les autres pages.

1
Duane