Hi, need some help to use custom helpers in child theme



  • Hello,

    I need to customize links in my custom child template with a helper like :

    //in my template file : 
    <span data-apt="{function.obfuscate, someUrl}" />
    

    I found some solutions on old topics but nothing in the documentation.

    My first attempt was to use the app load hook:

    // in the plugin.json file 
    { "hook": "static:app.load", "method": "init" },
    
    // in library.js
    const benchpress = require.main.require('benchpressjs');
    ....
    library.init =  async function (params) {
    	app = params.app;
    	const middleware = params.middleware;
    	benchpress.registerHelper('obfuscate', function(data){
    		// custom code
                    return 'mycustomcode';
    	});
    	....
    };
    

    My second attempt with a simple module and a require :

    // in helpers.js
    (function (factory) {
    	if (typeof module === 'object' && module.exports) {
    		factory(require.main.require('benchpressjs'));
    	} else {
    		require(['benchpress'], factory);
    	}
    })(function (Benchpress) {
    	Benchpress.registerHelper('obfuscate', function (data) {
    			return 'my-custom-result';
    		});
    	});
    
    //in library.js
    require(./helpers.js);
    
    

    And the pretty empty output trace for Benchpress object:

    benchpress {
       "helpers": {},
       "cache": {},
       "globals": {
          "true": true,
          "false": false
       }
    }
    
    

    Have you an idea ? A better way to add and use helpers ?

    Thx


  • Global Moderator

    The helper has to be registered both on the client side and the server side.



  • @PitaJ I see that in an other topic. It needs only this line in plugin.json :

    scripts : "./helpers.js" in plugin.json
    

    If the client registration is missing, at least it should work on first load... I miss the point here.



  • I have added some traces on the Benchpress object :

     {
      precompile: [Function: precompile] {
        isNative: true,
        defaults: { minify: false, unsafe: false, native: true }
      },
      __express: [Function: __express],
      evaluate: [Function: evaluate],
      compileRender: [Function: compileRender],
      compileParse: [Function: compileParse],
      runtime: [Function: runtime],
      helpers: {
        __escape: [Function: identity],
        displayMenuItem: [Function: displayMenuItem],
        buildMetaTag: [Function: buildMetaTag],
        buildLinkTag: [Function: buildLinkTag],
        stringify: [Function: stringify],
        escape: [Function: escape],
        stripTags: [Function: stripTags],
        generateCategoryBackground: [Function: generateCategoryBackground],
        generateChildrenCategories: [Function: generateChildrenCategories],
        generateTopicClass: [Function: generateTopicClass],
        membershipBtn: [Function: membershipBtn],
        spawnPrivilegeStates: [Function: spawnPrivilegeStates],
        localeToHTML: [Function: localeToHTML],
        renderTopicImage: [Function: renderTopicImage],
        renderDigestAvatar: [Function: renderDigestAvatar],
        userAgentIcons: [Function: userAgentIcons],
        buildAvatar: [Function: buildAvatar],
        register: [Function: register],
        logger: [Function: logger],
        obfuscate: [Function: obfuscate]
      },
      registerHelper: [Function: registerHelper],
      cache: {},
      globals: { true: true, false: false },
      setGlobal: [Function: setGlobal],
      addGlobals: [Function: addGlobals],
      flush: [Function: flush],
      render: [Function: render],
      parse: [Function: parse],
      registerLoader: [Function: registerLoader]
    }
    
    

    My two custom helper functions, logger and obfuscate, are visible, but the result template still show {function.obfuscate, 'testUrl'} .



  • I have found the problem, it was a bad theme declaration. My child theme was not encapsulate in

    (function(module) {
    
    ....
    
     }(module));
    

    Unfortunately, now i have a new probleme. It seems not possible to concatenate var in helper parameter like this :

    {function.myHelper, {config.relative_path}/user/{posts.user.userslug}}
    or 
    {function.myHelper, config.relative_path + '/user' + posts.user.userslug}
    

    Any idea ?


  • Global Moderator

    Yeah that isn't possible. Instead you'll need to pass the individual values in as arguments and perform the concatenation in the helper itself.

    BTW, I recommend you use the new helper syntax. It's easier to reason about.

    https://github.com/benchpressjs/benchpressjs/blob/master/docs/helpers.md



  • yes, it's the solution i have chosen. Thx !


Log in to reply
 

Suggested Topics

| |