Test for member status in HTML card

Weird question: Is there a way to test for paid/free status in an HTML card?

Write some JavaScript in a theme .hbs file that sets a variable, then in your html card, use the variable (in a script tag).

Since I am definitely a noob when it comes to writing JavaScript (I can read and edit it fairly well), can you throw an example?

Sure. This should work. (I tested the second part, not the first part.)

Somewhere in the THEME files (and near the top, so that it’s set before the html card tries to use it), do

<script>const myVariable={{member.paid}}</script>
// If in a slightly different example getting a string instead of a bool, you'll need quotes around it.  Handlebars replacements happen BEFORE the browser reads the javascript.

In the HTML card in the post body:

  if (myVariable) { document.write('Something you want to show up if member.paid was true')
} else {document.write('something else'}

Note that you’re letting the browser decide what to do here, so do NOT use this approach with sensitive information you don’t want the user to have access to, but if you need to tweak your CTA (probably still better accomplished at the theme level), this might be what you’re looking for.

Another option would be to park an empty <div> somewhere in the text and then have a piece of javascript change the contents. That javascript (IF set up in the theme layer, not code injection) could also make use of {{handlebars variables}}.

(Thanks @vikaspotluri123 for fixing my failure to escape that div. :) )

1 Like

So has to be in the theme files? I tried it using code injection, and it’s not working that way.

(BTW, need a / on that second SCRIPT tag, I think.)

So, I tried adding the variable script to both the overall code injection (in the header) and the individual post code injection, and then put this in an HTML block (leaving out the script tags):

  if (myVariable) { document.write("Something you want to show up if member.paid was true")
} else { document.write("something else if not paid");}

Even if the variable script doesn’t work in either location, but has to be in the post.hbs, it still seems to be that the second document.write should fire, since there is no variable at all. But, I’m getting no output at all. Thoughts?

Code injection doesn’t work with {{handlebars}}.

The second one needs script tags - code injection requires them too.

Yes, it’s got the script tags – I couldn’t include them in the comment, because the forum software thought it was an actual script.

Screenshot of post:

I’ll add the script to set the variable later today and test it. Will let you (and anyone reading) know how it goes. Thanks!

If you’re not defining myVariable before the content, your implementation might have issues

In addition to @Cathy_Sarisky’s suggestion, you can also use CSS to conditionally display contents of an HTML card. Here’s an example for an in-line signup form - you might have to make a few changes, and you probably don’t need any js:

Well, I tried putting the script to set the variable in post.hbs, at the very top, and it caused an error. Took it out, and error went away.

Tried putting it in default.hbs – same problem. Error: Expecting ‘INVERSE’, ‘OPEN_ENDBLOCK’, got ‘EOF’

Where to put it?