questions about iframes- and how many dynamic / fantastical possibilities they hold..?

Webweaving
1

hello my dearest forum friends,

i have… gosh. so. many. questions. and SO many topics i want to post. i will do my best to refrain from spamming or exploding into a billion pieces for now but this is a burning question on my mind lately, i had to go digging!~

essentially, i am incredibly curious about the entire scope of iframes. sure, you provide a window into another world, some other url/webpage address, like a cure little terrarium, but WHAT ELSE? im SURE there are more cool things waiting to be done, for example- if i am not mistaken, cbox is an example of an iframe-based widget, right? thats cool!!

please tell me more ways to use iframes!! ignite my curiosity, set me ablaze~

1 Like
2

i use iframes for my marigold town hosting! every hostee makes a “sign” out of a 100x100 space that then displays in the iframe. :)

3

ok wow that a really cool use case wow!!! i love that- how cute. i might have to “move in” haha. to be honest- i am looking for more ideas to add more little containers to nolove.neocities.com/gallery - perhaps it is time to get a gifypet? yes,…

1 Like
4

For a little while on neocities people made “web gardens” which were little site snapshots made for other people to “plant” on a page using iframes. Here’s my collection of webgardens which includes my own and some other people made (a few are broken but the idea is there!)

Some people use iframes for more practical purposes, like making a site navigation/menu and putting on their pages via an iframe, so if they add a new page to their menu they only have to update one file rather than every page (this can be done other ways like static site generators, JavaScript, and server side includes, but iframes are particularly beginner friendly).

5

You can set the target attribute of an <a> tag to be the name of an <iframe>, which will cause the HTML to be loaded into the <iframe> instead of a new page. I discovered this on ribose’s microscopy site.

For instance: <iframe name=“scope”> and <a target=“scope”> will make the anchor target the “scope” iframe.

Reference: <iframe>: The Inline Frame element - HTML: HyperText Markup Language | MDN

1 Like
6

there’s a fair number of iframe widget type things! navlink ads (and similar indieweb ad things) are iframes cropped to a specific size with overflow hidden. this tarot widget is an iframe, and kp radio’s widget is an iframe as well! this increment counter is also an iframe widget, just a really small one!

zombiethederg’s sewer arcade has some games embedded via iframe, which i thought was fun and hadn’t occurred to me to do! the melonland surf club navigator is a fun way of using iframe navigation across different sites instead of just within one, i think it’d be interesting to play around with trapping people in iframe browsers like that.
also, this page on the melonland everyone site has a quite fun and interesting implementation of iframes + randomizing javascript i thought!

youtube embeds are iframes as well, which i didn’t realize before! i never looked that closely at it. same with google calendar embeds.

i think a fair number of people use status.cafe iframes on neocities, but you could do an iframe for other social media feed type things that don’t require a login to view! like a small “latest blog post:” box with an iframe pointed at a blog’s front page.

iframes are very fun!!

3 Likes
7

If it’s all on your own site, two sets of of web components offer what is in some ways an improvement over using iframe for layout or navigation: ufx-include and h-include

Web components are a way of creating new HTML elements with different behavior.

2 Likes
8

These look really interesting, but I’m not sure I understand the use-case… ufx-include loads in a snippet of html? The modularity is nice. Does this have any advantage over doing the same thing with JS?

9

Web components are created with JS. The advantage to the web developer is that it is neatly encapsulated so it can be used like any other HTML element without writing additional JS. In this case it’s pretty similar to how an iframe is used:

<h-include src="/url/to/fragment.html"></h-include>

The use-case is similar to how I often see iframes used in environments where server-side include is not available.

1 Like
10

I see, that makes sense!

This might be a dumb question, but do frameworks like this have to be downloaded before they can be used? If I was going to use something like this, would I have to install it, then upload something to Neocities before I could use it…?

11

I wouldn’t put these two in the category of a framework because they’re so small and add just one or two things.

The instructions for installing UFX begin by saying you can either use npm install or manually download and host a js file and add a script tag to the head section which is pretty typical.

The instructions for h-include only cover npm and not manual download, which is also pretty common.

1 Like