New Group type with custom HTML Tag Option

Feature Requests
1

I think we have asked before for , to be able to add /replace custom html tags to elements.

(**Note this request is not about Modals, its about HTML TAGS but this Modal example is the latest example where I ran into the issue of wanting the feature in this request ** )

After watching a YouTube video about the HTML Dialog Tag which gives you easy and customisable Models or Dialogs, with little coding to get expectant behaviour like not be able to click the background.

I wanted to see how easy it would be to get them into Hype.

Easy if you just want to design them with non Hype elements inside them as shown in the video.
But I quickly ran into the problem of how do we get hype elements inside them.

For me it was not so much a difficult hack. But that's what it is and it is one that could be broken at some point in the future since to involves moving hype elements around outside of hypes control.

Hack example. Which show how I am able to embed Hype Elements that retain the properties, animations etc after I have changed the groups Tag from a DIV to Dialog.

modal.hype.zip (70.3 KB)

But it would really be useful if we did not have to do that. Having a think about it, I think when we attempt to do stuff like this we really just want to wrap existing elements in a custom element.

So it would seem to me that every thing to do this already exists in Hype repertoire, in the form of Groups.

Can I propose that either an additional group type is added where we can name the resulting html Tag name. ie the Custom Group has a text field in the Inspector where you can enter the Tag name.
Or the existing Groups get the Option text field in the Inspector.

When hype writes out the HTML if this text filed for instance contains 'dialogue' the instead of the Group having the HTML Tag 'div' it gets 'dialogue' .

—-
Also it would be good to have this option on regular elements where we do need to also include innerHTML

1 Like
2

For more on using the HTML dialog element in Hype check out this thread and related video.

1 Like
3

Cheers, they also show why having a custom HTML Tag option is needed, which will open up using Hype Elements directly when you need to embed them inside a special Tagged Element or assign a Tag to an element other than DIV.

4

Thanks for the request!

It of course makes sense to allow this generally, though I do wonder if we should provide a limited set. Ironically stuff like changing to the dialog tag I suspect would break the editor badly. (though I suppose we could only apply it on export and not the editor environment)

1 Like
5

Yes I was thinking that's how it would work, during write out. The Tag Name textfield would not affect the editor.

I think it would be better to leave it open and up to the user to write in what they need.

It would mean if we are trying to create something from a library that itself expects a custom Tagged element we are not limited in doing that.

Also means we would not need to ask for it to be added to a list.

1 Like
6

Yeah, I'm leaning towards being able to write whatever you want, but it is not in the editor. This means CSS in a style sheet would not apply, but c'est la vie.

I thought about allowing some subset of tags to apply, but I think that might just be more inconsistent than it is worth.

Thanks!

2 Likes