Element Conditions Discussion

Quick update on this. The next beta will have a “Featured Image [is / is not] set” condition, but I’ve not created any other rules yet.

4 Likes

Good afternoon my friends, wanted to post a quick update here. We added a couple more conditions in beta8 related to Loopers. For example, you can output an element if it [is/is not] the first, last element or even/odd elements. This will help with adding things like separators in-between looper elements.

For the 4.0.0 update we’re not introducing any more conditions. I’ve got a list going for what could be a smaller “conditional logic” update with much of what we discussed above like string and URL based conditions.

2 Likes

Awesome! I was wondering what those were for.

:+1:

I know Conditions list are mostly done for the release, but one thing crossed my mind:

Show/hide elements is showing/hiding them using CSS, which means they are still loading in the browser, even if hidden.

Conditions are disabling stuff from what I understood. So would it be possible to add conditions based on the Viewport width as well?

Thanks!

2 Likes

Hey, @Misho! Great thought, but this is unfortunately not possible. The conditions allow you to hide things based on immutable characteristics within a singular page load. For instance, we can easily check if a featured image is set or not, and then choose to show variations in markup based on that because that will never change within a user’s session in the browser. This condition is checked before the markup is even generated, and it alters the markup accordingly based on the conditions we’ve set. So if we have a post that doesn’t have a featured image set, it’s not just “hiding” the featured image markup we want gone, it’s physically removing it from the markup and it can’t be generated until:

  1. An image is set, and…
  2. The user refreshes the page after the image is set.

With responsively showing and hiding Elements as the viewport changes, we have to use CSS because a user may or may not resize their browser up and down multiple times in a session, or change from portrait to landscape within the same session, et cetera, and the only way to juggle the changes in layout we need for this type of change is CSS.

2 Likes

Hey everyone, with the release candidate being imminent we have pushed the new documentation live. Here’s a helpful article on this subject: https://theme.co/docs/conditions-and-assignments

1 Like

I’ll just carry on writing custom shortcodes in the meantime to do this, but a good example of a typical use case for me is I have a list of staff members, with photo, name, job title, phone number etc…

When I display phone number it will look like this:

Tel: 123 45 678

But if the data field for the phone is blank it will look like this:

Tel:

I would prefer just to not show that element at all if the data doesn’t exist.

Gotcha, definitely a good case for some kind of string matching which we’re planning on coming back to. For example, it could run Dynamic Content and see if the result is empty or has some kind of value match.

We definitely need conditionals for post metadata / ACF fields.

Hearing you. We’ve gotten an incredible amount of solid feedback in this beta cycle and have detailed notes compiled for getting more functionality in to the new systems like Conditions and Loopers. I know there’s so much more that we could make possible but we needed to draw the line somewhere and get this release out. As mentioned in the beta overview thread we’re “feature complete” for 4.0.0 so anything beyond what you have now in the release candidate will be part of a future update.

Hey everyone (@urchindesign, @spedney, @devinelston, @Misho) wanted to pass on the good news that in 4.1.0 you will find a new section under element conditions called Expressions with sub items for String, Number, and Date. Each will let you define a left and right value, and and operator to use. Here are the available operators for each type:

  • String - is, is not, in, not in
  • Number - ==, !==, >, >=, <, <=
  • Date - before, after

Some notes on how it works:

  • All values are processed through dynamic content and do_shortcode. This means you can do things like
    • {{dc:post:meta key="custom_field"}} | in | lets check if the field is found anywhere as a substring of this string
    • [membership level=1]SHOW[/membership] | is | SHOW
  • Numbers are passed through PHP floatval before running boolean logic.
  • Dates are passed through PHP strtotime before checking if before/after

Even better news, we’re planning on getting 4.1.0 out as early as next week! Still have a few more things to patch up and a few more improvements to get in.

6 Likes

Looking forward to try this out - thanks for all your great work!

You’re welcome! Today is the day. Should be seeing Pro 4.1.0 on manual updates shortly.

1 Like

Hi @alexander! I am not sure if the string conditions already have a capability to include/exclude elements based on the url parameters of the current page?

Thanks!

@Misho Search the Dynamic Content picker for “URL” and you’ll find some new options there. It now offers a way to retrieve URL segments and parameters.

1 Like

Oh, wow, that’s great!

No idea how to use that in the string condition though, (what goes left and what goes right). I’ll try to play with it more. :slight_smile:

Sure! Here’s a quick example. If you do this:

{{dc:url:param key="hello" }} | is | there

it will be true when ?hello=there is in the URL.

3 Likes

Is there a string or Conditions setting for when a URL contains something?

I’d like an element to display when the url contains jonathan

For example:
mysite.com/salespagejonathan24 displays the element
mysite.com/salespagestevemc does not display the element

I’ve been messing around with Conditions but can’t seem to figure this out.

Thanks!

1 Like

Sure! That one is called URL > Segment. So the condition would be something like:

{{dc:url:segment}} | is | salespagejonathan24

1 Like