Custom Modal Popups

Posted in: Newspaper
Post count: 12

Hi TagDiv Team,

I am implementing two custom modal popups in my site’s header for the user flow.

The first modal (Login/Register) is working fine, triggered by a default user icon when the user is logged out.

The problem lies with the second modal, which is for logged-in users. I want to replace the standard “My Account” dropdown menu behavior with a custom modal that slides out from the right side of the screen. This custom modal will contain unique content.

I am using the Block Menu Login which correctly displays the dynamic user avatar in the header when the user is logged in. However, clicking on this avatar causes an unwanted redirection to the “My Account” page, preventing me from using my custom JavaScript to trigger the modal popup.

I need a solution to use the dynamic user avatar shown in the header as a dedicated, non-linking JavaScript click trigger for my custom modal.

The attached image (https://imgur.com/a/5Xbqtuc), titled “Modal Popups.png” (specifically the bottom section showing the user avatar), is a CROQUI (sketch) that illustrates the intended final result: the custom “My Account” modal opening upon clicking the user’s avatar. It does not represent functionality I have achieved yet.

Could you please advise on the officially supported method to disable the default link action on the avatar within the Block Menu Login, or provide a reliable shortcode/method to inject only the dynamic logged-in user’s avatar image (without any default link or container) into a raw code block?

Thank you for your help.

Best regards,

Post count: 35449

Hi,
Unfortunately, there are no options for this, but what I can suggest in case that you want to display only an icone and not a text and the user name, then you can use the icon, set it in a inner row and hide and show that inner row based on whether the user is logged in or not – https://i.imgur.com/Wg1OIti.png

Viewing 2 posts - 1 through 2 (of 2 total)
The forum ‘Newspaper’ is closed to new topics and replies.