0

First of all I use Timber (TWIG) with WordPress. That's why there are some differences with only the use of PHP.

I implemented the WordPress search function with a searched word highlighting system (with "mark" js plugin).

Everything works fine however I would like to display the paragraph that contains the search word as an extract.

For example if I use the word "speaker" for my search. I would like to display the paragraph that contains the word "speaker" in the results.

To inject the appropriate paragraph instead of card.article_exceprt ( see full code below) :

<div class="card__content">
    {{ card.article_exceprt }}
</div>

How to do that please ?

script.js

function init_datas_fetch() {
$('#search-form').on('submit', function(e) {
    e.preventDefault();

    var searchValue = $('#search-input').val();

    if (searchValue.length > 0) {
        $.ajax({
            type: 'POST',
            url: '/wp-admin/admin-ajax.php',
            dataType: 'html',
            data: {
                'action' : 'datas_fetch',
                'terms' : searchValue
            },
            success: function(data) {
                $('#fetch-list').html(data);
            },
            error: function(data) {

            }
        });
    } else {
        $('#fetch-list').html('');
    }
});
}

functions.php

add_action( 'wp_ajax_nopriv_datas_fetch', 'datas_fetch' );
add_action( 'wp_ajax_datas_fetch', 'datas_fetch' );

function datas_fetch() {
    $context['page_search'] = true;
    $keywords = isset($_POST['terms']) ? $_POST['terms'] : '';

    $posts_types_selected = array('pages' => 'page', 'articles' => 'post', 'videos' => 'videos', 'podcasts' => 'podcasts');

    $exclude_posts = get_field('search_exclude','option');

    $meta_query = array(
        'relation' => 'OR'
    );

    if (!empty($keywords)) {
        $fields = array(
            'article_exceprt',
            'article_chapeau',
            'blocs_article_$_article_wysiwyg'
        );

        foreach($fields as $field) {
            array_push($meta_query, array(
                'key' => $field,
                'value' => $keywords,
                'compare' => 'LIKE'
            ));
        }
    }

    if ($keywords) {
        $context['posts'] = Timber::get_posts(array(
            'post_type' => array_values($posts_types_selected),
            'post_status' => 'publish',
            'posts_per_page' => -1,
            'paged' => 1,
            'orderby' => 'date',
            'order' => 'DESC',
            'post__not_in' => array_values($exclude_posts),
            'hide_empty' => true,
            'has_password' => FALSE,
            '_meta_or_title' => $keywords,
            'meta_query' => $meta_query
        ));
    } else {
        $context['posts'] = Timber::get_posts(array(
            'post_type' => array_values($posts_types_selected),
            'post_status' => 'publish',
            'posts_per_page' => -1,
            'paged' => 1,
            'orderby' => 'date',
            'order' => 'DESC',
            'post__not_in' => array_values($exclude_posts),
            'hide_empty' => true,
            'has_password' => FALSE
        ));
    }

    Timber::render( 'bloc_fetch.twig', $context );

    die();
}

tpl_search.twig

<form role="search" id="search-form">
    <input type="text" id="search-input" class="search__input" placeholder="{{ __('Rechercher des articles, vidéos...', 'cmd') }}" value="">
    <input type="submit" id="search-submit" class="search__button" value="Rechercher">
</form>

<div id="fetch-list">
 {% include "bloc_fetch.twig" %}
</div>

bloc_fetch.twig

{% for card in posts %}
    <div class="card">
        <img src="{{ card.thumbnail.src }}" class="card__visual" alt="{{ card.thumbnail.alt }}">
        <a href="{{ card.link }}" class="card__link"></a>
        <div class="card__content">
            {{ card.article_exceprt }}
        </div>
    </div>
{% endfor %}
  • I really don't see a way to accomplish this using only WordPress knowledge. Perhaps you can use basic PHP string functions or XPath to identify the tag that the search term first appears in, but getting it into card.article_excerpt is impossible to answer within the scope of this site. You need to ask this in a Timber community or Timber support, particularly people familiar with Timber::render. I can't even tell if card.article_excerpt already exists or not, and I'd consider splitting this question in two, 1: the Timber part, and 2: Finding the paragraph – Tom J Nowell Oct 5 at 21:20
  • Thank you for your answer. I'm interesting with basic PHP string functions solution – Jandon Oct 6 at 8:11
  • you might get more eyes on it if you ask at stackoverflow, there are more generic PHP programmers there – Tom J Nowell Oct 6 at 8:39

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.