[Resolved] Use a conditional shortcode on an elementor button

[Author]

Posts

[SteffenM1628]

Hey there, i built my entire site with elementor and toolset. And both work absolutly great together.
Tell us what you are trying to do?
I would like to show a button (elementor widget) only when the current logged in user = the author of the post.
But i don‘t know how to bring the conditional shortcode with its [opening brackets] and [/closing brackets] around the button widget!

Is there anyone with an idea?

Cheers

[Waqar]

Hi Steffen,

Thank you for contacting us and I'll be happy to assist.

To show a button (or any content) only when the currently logged-in user is also the author of the post, you can wrap it inside a conditional block like this:

[wpv-conditional if="( '[wpv-current-user]' eq '[wpv-post-author]' )"]
Current user is author of this post
[/wpv-conditional]

You can learn more about the available Views shortcodes and the conditional blocks, from the following guides:
https://toolset.com/documentation/user-guides/views-shortcodes/
https://toolset.com/documentation/user-guides/conditional-html-output-in-views/

I hope this helps.

regards,
Waqar

[SteffenM1628]

Hey waqar!

I do know how to use the shortcodes ☺️.

My question is how can i use the toolset shortcodes on a elementor page to hide eg. a button.
The problem is the wrapping. Do you have any ideas how we can achieve this on elementor?

Cheers

[Waqar]

Hi Steffen,

Thank you for sharing further details.

I'm afraid, there is no direct way to wrap Elementor's items (e.g. Button) inside a Toolset conditional block shortcode, but as a workaround, you can follow these steps:

1. Please create a new temporary page and then add the required button in its content using the Elementor page builder.

2. Using Chrome's inspect element tool ( ref: hidden link ), copy the generated HTML code for that button.

3. Next, you can wrap that button's HTML code inside the Toolset conditional block shortcode in a view and include it in your Elementor page template.

This should do the trick and please let me know if you have any further questions around this.

regards,
Waqar

[SteffenM1628]

Hey Waqar,

Thanjs for your answer. I have thought about this.
Another workaround could be:
I can give elementor widgets/elements a custom class.
Is it possible to built a conditional shortcode to show a class only when the current logged in user = the author?

Cheers

[Waqar]

Hi Steffen,

Thanks for writing back and I apologize for the delay.

If you'd like to control the conditional button, through CSS code, you can follow these steps:

1. You can add a special class e.g. "special-button" around your button in Elementor builder.

2. In the generic CSS section, you can add the following CSS code, so that this button is hidden, by default:

.special-button {
    display: none;
}

3. To make this hidden button show, only when the currently logged-in user is also the author of the current post/page, you can register a custom shortcode, by adding the following code in active theme's "functions.php" file:

add_shortcode('show_css_code_conditionally', 'show_css_code_conditionally_fn');
function show_css_code_conditionally_fn($atts) {
	
ob_start(); ?>
//   CSS code to show the button conditionally
<style type="text/css">

.special-button {
    display: block !important;
}

</style> <?php

	$CSS_output = ob_get_clean();

	$current_user = do_shortcode('[wpv-current-user]');
	$current_author = do_shortcode('[wpv-post-author]');

	if ($current_user == $current_author) {
		// this is confirmed that the current logged-in user is the author
		return $CSS_output;
	}	 
}

4. You can then include the shortcode [show_css_code_conditionally] in your Elementor template, through an "HTML Code" widget.

I hope this helps.

regards,
Waqar

[SteffenM1628]

My issue is resolved now. Thank you!