skip to Main Content

I am working on localizing a custom theme I created for WordPress. I have a problem when I try to localize a jQuery file. I understand a little JS and jQuery but not enough to understand where I did a mistake.

Here is the function :

function inspire_enqueue_scripts() {
    $script_path = get_template_directory_uri() . '/js/';
    $css_path = get_template_directory_uri() . '/css/';
    

    if ( is_front_page() || is_category() ) { 
        wp_enqueue_script('ci-isotope', $script_path . 'ci-isotope.js', array( 'jquery' ) );
        wp_localize_script('ci-isotope', 'ci_isotope_vars', array(
                                                             'loadmore' => __('Load more', 'inspire')
                                                            )
        );
    }
    

}
add_action( 'wp_enqueue_scripts', 'inspire_enqueue_scripts' );

Here is the part of the jQuery files where I try to get the text translated.

//append load more button
$container.after('<button id="load-more" class="ciLink-button"> <span class="ciLink-button-text">' ci_isotope_vars.loadmore '</span> <span class="ciLink-button-icon"> </span> </button>');

Can you help to solve this? thank you.

2

Answers


  1. Chosen as BEST ANSWER

    I found a solution:

    $container.after('<button id="load-more" class="ciLink-button"> <span class="ciLink-button-text">Load More</span> <span class="ciLink-button-icon"> </span> </button>');
    $(".ciLink-button-text").text( ci_isotope_vars.loadmore);
    

  2. Looks like you’re missing concatenation (plus-signs). Try this

    $container.after('<button id="load-more" class="ciLink-button"> <span class="ciLink-button-text">' + ci_isotope_vars.loadmore + '</span> <span class="ciLink-button-icon"> </span> </button>');
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search