How to insert external javascript widgets?

kev

unread,

Nov 7, 2010, 11:36:28 AM11/7/10

to TiddlyWiki

I am trying to insert this widget - http://www.pipebytes.com/getwidget.html
into a Tiddler. I thought it would work like this:

<html><body>
<script type="text/javascript" src="http://www.pipebytes.com/widget/js/
widget.js">
</script
</body>
</html>

but it does not. Other widgets work. Am I doing something wrong?

Thanks

Eric Shulman

unread,

Nov 7, 2010, 12:53:28 PM11/7/10

to TiddlyWiki

> <html><body>
> <script type="text/javascript" src="http://www.pipebytes.com/widget/js/
> widget.js">
> </script
> </body>
> </html>

When <html>...</html> is embedded in tiddler content, it is simply
passed along to the browser for rendering. However, the browser
simply ignores any embedded <script>...</script> within the HTML and
just renders the actual content.

In order to embed a script within a tiddler, you can install
http://www.TiddlyTools.com/#InlineJavascriptPlugin

Once installed, you won't need to use any HTML, just a script block:

<script src="..."></script>

Note: the plugin syntax does not need (or even recognize)
type="text/javascript"
so that part of the usual script definition should be omitted.

Note also that the particular widget script you are loading still
might not work in a TiddlyWiki environment, so you still might have
problems getting the script to work. Be prepared to do some
debugging.

For more details about "inline script" usage within TiddlyWiki, please
see:
http://www.TiddlyTools.com/#InlineJavascriptPluginInfo

enjoy,
-e
Eric Shulman
TiddlyTools / ELS Design Studios

Tobias Beer

unread,

Nov 7, 2010, 3:09:21 PM11/7/10

to TiddlyWiki

Hi kev,

Have a look at the actual script that is supposed to load the
functionality...

http://www.pipebytes.com/widget/js/widget.js

This script has no real purpose. I have no idea why they chose to have
javascript create the iframe, but it is not needed at all. Simply
create a corresponding iframe containing the following and you're
done:

<html><iframe scrolling="no" frameborder="0" hspace="0" vspace="0"
style="width:385px;height:220px;border:none" src="http://
www.pipebytes.com/widget/index.php"></iframe></html>

I've created an example tiddler here:

http://tobibeer.tiddlyspace.com/#PipeBytes

Cheers, Tobias.

kev

unread,

Nov 7, 2010, 4:41:25 PM11/7/10

to TiddlyWiki

Hey - you solution works thanks! Of course, since I don't really know
how - I'll also install the inlineJavascript plugin. Thanks guys.

On Nov 7, 8:09 pm, Tobias Beer <beertob...@googlemail.com> wrote:
> Hi kev,
>
> Have a look at the actual script that is supposed to load the
> functionality...
>
> http://www.pipebytes.com/widget/js/widget.js
>
> This script has no real purpose. I have no idea why they chose to have
> javascript create the iframe, but it is not needed at all. Simply
> create a corresponding iframe containing the following and you're
> done:
>
> <html><iframe scrolling="no" frameborder="0" hspace="0" vspace="0"

> style="width:385px;height:220px;border:none" src="http://www.pipebytes.com/widget/index.php"></iframe></html>

Reply all

Reply to author

Forward