web-dev-qa-db-fra.com

Charger les posts dynamiquement

Je cherche une solution/des conseils sur la manière dont je pourrais avoir des liens de publications listés de manière hiérarchique dans la colonne de gauche d'un modèle. Lorsqu'un lien est choisi, il charge une publication dans la colonne de droite mais la page entière ne s'actualise pas?

Merci Deon

Mise à jour de l'aide de Marfarma ci-dessous

Merci pour votre réponse. Après avoir lu plusieurs pages et posts, j'ai pu le faire fonctionner. Mon seul inconvénient est que les liens qui se trouvent dans la colonne de droite ont une valeur href de #. J'ai la configuration de la page d'accueil permettant à un utilisateur de choisir un parcours de formation lui permettant d'accéder à la page décrite ci-dessus. Mais j'ai également les liens individuels sur la page d'accueil au cas où un utilisateur souhaite passer à un sujet spécifique. Alors maintenant, mon problème est que je peux les coder individuellement et les envoyer dans le modèle de publication unique, mais je préférerais qu'un utilisateur accède à la page décrite ci-dessus avec le sujet de lien correct choisi dans la liste. Savez-vous comment cela pourrait être accompli? Je suppose que la première étape au lieu d’avoir le # comme href, je dois transmettre le bon identifiant/post slug comme href? Puis, d’une manière ou d’une autre, je peux créer un lien vers tout cela en javascript. Merci pour toute aide. Le code que j'ai utilisé est ci-dessous.

<?php
wp_enqueue_script( 'my-ajax-request', get_stylesheet_directory_uri( __FILE__ ) . '/js/ajax.js' );
wp_localize_script( 'my-ajax-request', 'MyAjax', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) ) );
?>

    <?php
    global $wpdb;
    global $post;
    $querystr = "
    SELECT * FROM $wpdb->posts
    LEFT JOIN $wpdb->postmeta ON($wpdb->posts.ID = $wpdb->postmeta.post_id)
    LEFT JOIN $wpdb->term_relationships ON($wpdb->posts.ID = $wpdb->term_relationships.object_id)
    LEFT JOIN $wpdb->term_taxonomy ON($wpdb->term_relationships.term_taxonomy_id = $wpdb->term_taxonomy.term_taxonomy_id)
    LEFT JOIN $wpdb->terms ON($wpdb->term_taxonomy.term_id = $wpdb->terms.term_id)
    WHERE $wpdb->terms.name = 'pathologist'
    AND $wpdb->term_taxonomy.taxonomy = 'category'
    AND $wpdb->posts.post_status = 'publish'
    AND $wpdb->posts.post_type = 'post'
    AND $wpdb->postmeta.meta_key = 'order'
    ORDER BY $wpdb->postmeta.meta_value ASC
    ";
    $pageposts = $wpdb->get_results($querystr, OBJECT);
    ?>


     <?php if ($pageposts): ?>
     <?php global $post; ?>
<div class="textwidget">
<ul id="nav">
<li class="list-title">Navigating your Workspace</li> 
<?php foreach ($pageposts as $post): ?>
<?php setup_postdata($post); ?>   
<li class="post" id="<?php the_ID(); ?>">
  <a href="#" class="ajax-click" rel="bookmark" title="<?php the_title(); ?>">
  <?php the_title(); ?></a>
</li>
<?php endforeach; ?>
</ul>
</div>

Et le ajax.js pour ci-dessus.

 jQuery(document).ready(function() {

     jQuery(".ajax-click").click(function() {
        jQuery("#loading-animation").show();
        var post_id = $(this).parent("li").attr("id");
        var ajaxURL = MyAjax.ajaxurl;

        jQuery.ajax({
        type: 'POST',
        url: ajaxURL,
        data: {"action": "load-content", post_id: post_id },
        success: function(response) {
             jQuery("#container-help-page").html(response);
             jQuery("#loading-animation").hide();
        return false;
    }
});
});
});
postsajax
3
Deon

Voici comment je l'aborderais. Faites-moi savoir dans les commentaires si vous avez besoin de plus de détails.

1) Créez un modèle qui extrait le contenu de votre page initiale - le contenu par défaut du panneau de droite et la liste des liens pour le panneau de gauche. Assurez-vous que les liens ont post_id défini comme valeur de l'attribut id.

2) Écrivez une fonction de requête Javascript pour demander le contenu du panneau de droite, en fonction du lien cliqué dans le panneau de gauche, à l'aide d'un appel ajax. Transmettez la valeur de l'attribut id et de la fonction de rappel (à partir de l'étape 3). Ecrivez une fonction init pour l'ajouter à l'événement onclick pour chaque lien du panneau de gauche. Ajoutez la fonction init à l'événement de chargement de page.

3) Ecrivez une fonction de rappel Javascript pour remplacer le contenu du panneau de gauche par les résultats de votre demande.

4) Ajoutez un filtre d’action ajax pour que WordPress sache gérer votre demande. Vous aurez également besoin d'une fonction php qui prend post-id et renvoie le contenu renvoyé à la page. Voici la page de codex sur l'utilisation d'Ajax dans WordPress. Voici un détail important sur l'utilisation des actions de filtre ajax lorsque vous appelez ajax depuis le serveur frontal: https://wordpress.stackexchange.com/a/53729/4645 Placez le code php dans votre fichier functions.php ou ajoutez-le à votre plugin spécifique au site.

5) Mettez tout le javascript dans un fichier. Mettez-le en file d'attente dans votre fichier functions.php ou dans votre plug-in spécifique au site. (Voici un tutoriel sur la façon de ne charger que le code d'un modèle spécifique.)

Voici un tutoriel sur le chargement de messages via ajax, qui vous donnera un code pour vous aider à démarrer.

3
marfarma