[Resolved] Conditional Logic for a Button

[Author]

Posts

[jacobB-3]

I have a question regarding URL fields (a follow up to this support thread: https://toolset.com/forums/topic/shortcode-to-display-content-if-toolset-field-has-content/)

Some of the faculty listed in our people pages on this site want to add a link to additional publications. I've created a URL field with the slug "more-publications-link" then tried to use that in a shortcode with a button that only appears if they have publications. But I get stuck when trying to use that URL field in a button or an <a> tag...

Here's an example of how the design went sidewise for one professor (see giant blue button at the bottom): hidden link

And here's an example of a scholar's page who doesn't have additional publications but the button still shows up - it would be better if it didn't appear at all: hidden link

Thanks for your help!

[Shane]

Hi Jacob,

Thank you for getting in touch.

Is there an example of how you want the button to appear when the user has a link in the field ?

Secondly we can use our conditional block to check if the user has a link in the URL field before displaying the section. For information on how to use the conditional blocks please follow the instructions in the link below.
https://toolset.com/course-lesson/using-toolset-conditional-block/

Please let me know if this helps.
Thanks,
Shane

[jacobB-3]

Thanks, Shane!

It'd be great if the button could simply be like the "See More Publications" button on this page hidden link (though this button is not linked anywhere currently).

And I'm using the legacy version of Toolset. Is it possible to get conditional logic without blocks? Or is blocks really best here?

cheers,
Jacob

[Shane]

Hi Jacob,

Then you should be writing it like this.

<a href="[types field='url-field'][/types]">Text Goes Here</a>

All thats needed is for you to style the anchor tag like a button. You can have a look at this example below.
https://stackoverflow.com/questions/8357058/how-to-make-an-html-anchor-tag-or-link-look-like-a-button

This would be the best option if you're not using the gutenburg editor.

If you're using our Gutenburg editor then you can use our Button block and use a dynamic URL to assign the correct URL to the button. From there you can also using the styling options for the button to style it any way you feel.

Please let me know if this helps.
Thanks,
Shane

[jacobB-3]

Thanks, Shane. I've used that code, but regrettably, It seems to be coming out strangely (see screenshot or have a look at the bottom of hidden link)

Toolset is correctly picking up the URL, but doesn't seem to be using it properly in the <a> tag.

I haven't yet added in button styling, but can do that once the link works...

cheers,
Jacob

[Shane]

Hi Jacob,

Ok so the problem you are currently experiencing isn't toolset related as wordpress core itself removed support for shortcodes in html attributes, this is why it is broken.

I was under the impression that you were using a content template to display this page which doesn't have this issue as toolset implemented special means by which you can still use shortcodes as parameters for HTML elements.

The only way to resolve this is to use a content template to create the page layout.

Thanks,
Shane

[jacobB-3]

Thanks, Shane. I appreciate that explanation. I am creating "content templates" of a sort using Beaver Themer. But it sounds like I'd need to create "content templates" using Toolset Blocks (and enabling Gutenberg) on the site. Is that correct?

[Shane]

Hi Jacob,

That is correct in order for you to use the nesting of the shortcodes then you will need to our Toolset Blocks content templates with gutenburg.

However I'm checking on an alternative and you can add the shortcode directly like this.
[types field="my-link" title="got to look at this"][/types]

Then you can also use the style attribute and add your css to the field. Example

[types field="my-link" title="got to look at this" style="color:red;"][/types]

Please let me know if this helps.
Thanks,
Shane

[jacobB-3]

Shane,

So good! That alternative is great! I've just used it on the site and it works well.

Is there a way to add a "target=_blank" to the shortcode so the link opens in a new tab?

cheers,
Jacob

[Shane]

Hi Jacob,

Unfortunately no you cant add it through the shortcode attribute, however you can add it using some Javascript.
hidden link

This should allow you to do it.

Thanks,
Shane

[jacobB-3]

My issue is resolved now. Thank you!