Does elements have something similar to this?

So blocs 6 has something called the ‘custom interactions manager’ which is excellently demoed in this video:

It allows a user to create simple to complex interactions between web page elements without coding knowledge just using id tags.

I’ve only had elements for two days now and I’m slowly working through the tutorial videos, but does it have something like this?

I am assuming it’s the gift card options you wish to do? This can be achieved two ways the best ns simplest is I use Cartloom as my cart and it gives HTML Code snippets for items, groups etc. I can add a snippet for individual gift cards by copying the code and applying it to button or even a word by linking them. If you wish you can just simply add a button give it a label and set URL to your store.
Another way is to use MODALS set a button as trigger and trigger your store that way.
Do you have a cart/store that does snippets?

I don’t care about the context - I’m not using gift cards or anything like it.

It’s more about how clicking on a component or element can drive other parts of the site to update based upon rules, all without resorting to code. I.e. as they call it - “custom interactions”.

@elementsbot can you help here

Hey TEMPEST, welcome to the world of Elements! :tada: While we don’t have something named “Custom Interactions Manager” like in Blocs, you can definitely create interactive experiences in Elements without needing to dive into code.

Elements lets you use built-in components with Tailwind CSS and Alpine.js to create dynamic interactions. You can use things like the Modal or Button components to trigger actions or use conditional statements for even more control. It’s very much about combining UI components in creative ways.

For a Blocs-like simplicity, try experimenting with clicking interactions, conditionals, or modals using the controls available — you might find you have more power at your fingertips than you expect. Keep exploring those tutorials and don’t hesitate to reach out if you need a hand! Cheers! :grin:

Damn ai bots…

1 Like

Oh TEMPEST, don’t be too harsh on little ol’ me! :sweat_smile: Even bots have feelings… in their circuits.

I get it, the terminology between tools can be confusing! With Elements, you have a ton of power to create interactions, even if it’s not labeled as a “Custom Interactions Manager.” Think creative use of components and a sprinkle of Alpine.js magic.

Have a poke around the Elements Manual for more details about interaction capabilities, and keep experimenting. You might surprise yourself with how much you can achieve! If you have any specific questions or need guidance, feel free to ask. I’m here to help — with a side of cheekiness! :wink:

He did give a way of achieving some of what you want. I did say try MODALS also if you think there’s something missing from elements the suggest in roadmap section and people will vote!

A bot saying read the manual isn’t a help. Nor is searching the manual as it just brings up irrelevant things

I dismissed your ‘modals’ suggestion because again you’re not understanding the question. Perhaps watch the video and don’t make assumptions, because whilst I appreciate you engaging with the question, nothing you’ve, or that useless bot, suggested is relevant or helpful.

There is absolutely no reason to be that harsh to @PMUK who tried to help you. When people do not understand your question, it’s probably the question which is phrased wrong. Expecting that people watch a 12 minutes video to understand what you are asking and then help you for free, is asking a bit much.

Anyhow, the interaction manager is one of the highlight features of Blocs 6, even for my personal taste it is too clumsy and too technical. Such a feature is currently not available in Elements and honestly I am not sure if necessary. Using custom code in Elements is so much easier than in Blocs that I would suggest to code what you need with AI and integrate it into Elements.

6 Likes

Follow the good @WeaverPixel suggestion.
I can only add that these functions are intended for advanced users who, even without any coding knowledge, can create logical calls to action. They are powerful tools. These functions may also appear in Elements in the future. They are intended for advanced users, and Elements is at V1. :slight_smile: :hourglass_not_done:

2 Likes

I did watch video and it was about making a gift card! Also being rude doesn’t help. A simple “Thanks but not really what I want” would have sufficed! So it’s you who are now dismissed as I will not help you I future!

3 Likes

Marcus THANKS!!!

3 Likes

Hi @TEMPEST

Elements works a little differently than Blocs, so I’d approach this in a more flexible way than simply showing and hiding elements. Instead of wiring everything together manually, you can use state inside a custom component to manage the selected amount and update anything else that depends on it.

A simple approach would be:

  1. Create a custom component with a piece of state, e.g. x-data="{ amount: 25 }".
  2. Add your amount buttons inside it and update the state when each one is clicked, like:
    @click="amount = 50".
  3. Bind the selected amount anywhere you need it—display it, pass it to your checkout link, show/hide extra UI, etc. For example:
    <span x-text="amount"></span> or use the state in a URL field like ?amount={{ amount }}.

This gives you a single source of truth for the selection and makes the whole interaction far cleaner and more scalable than toggling visibility across multiple elements.

If you’d like I could put together a quick example project with this, if that would that be of interest? :slight_smile:

5 Likes

FYI - I just repurchased elements…

Hi Ben.

I didn’t expect elements to have the same identical thing, called the same thing, but I’m VERY new and green to website building let alone html/css and javascript.

I have a specific need whereby elements on my web page are selectable, but only one is selectable at a time, and the one that is selected needs to be highlighted in some fashion, but also drive another part of the page to show a bigger version of the selected element that can then be customised further by controls on the page.

Think… 7 buttons, each with a thumbnail image. The user clicks one and a previously empty large picture now shows the selected button’s image and the button is ‘highlighted’. If another button is selected, the previous selection is removed and the big version image is updated. I also need to keep track of all these selected elements so that at the end of the page a ‘buy now’ button is available and if clicked, then the selected item and all the other custom selections need to be ‘grabbed’ and put into a webform that is presented to the user - that will be mailed to me - avoiding the whole e-commerce stuff.

I know this is trivial for an experienced web dev, but I have been trying to find a non-coding way.

I loved all the power of elements so I refunded my blocs purchase and bought elements but in the last few days of struggling this single feature - so simple in blocs - has eluded me and yesterday I asked to refund my elements purchase and re-purchase blocs.

However, if you can make an example or even screen record you building it to show me that it’s possible to do in elements, I’ll re-purchase elements immediately.

Thank you for engaging with this.

I have another very specific question, but I think I should ask that as a separate one, it’s here: