How to link to images and audio files on Android

[Raymond McDowell]

Can anyone advise: On Android with TiddloidLite, how can I link to external image and audio files, also on the same android device?

[Hubert]

Hi,

I'm not sure if Tiddloid differs in any way from any other browser but at least for external images TiddlyWiki uses the path relative to your TW file.

I have not linked to sounds inline, but I keep all my images in a folder that is in the same location as the TiddlyWiki file. Then you can use:

[img width="100%" alt="(image missing)" [TW_images/picture1.jpg]]

You can point TW to search for your images in other folders as well. Simply create a path to your image that is relative to your TW. For example, here you would reference a jpg file located up one level (..) from your TiddlyWiki file and then through the folder structure as below:

[img width="100%" alt="(image missing)" [../Other_folder/folder1/another_folder/picture.jpg]]

Hope that helps,

Hubert

[Raymond McDowell]

Sorry, it doesn't seem to work.

[Hubert]

Sorry, it doesn't seem to work.

I'm not quite sure what you mean by that. If you need help, please post what you see. Is your page blank? Do  you get an error message or weird formatting? What is your code, file/folder structure?

What I've posted above is the most basic syntax I could get to show you how you can place an external image in your tiddler including a relative file path to the image.

Perhaps refer to the documentation, you can find more info  here or here.

[Raymond McDowell]

Like you, I keep my images folder in the same location as my tiddlywiki. However, when I set the link I get nothing.


[img width="100%" alt="(image missing)"[00-mysite_portable-00/images/smudge.jpg]]

In your example I get the alt text "image missing".

Please note, when using orgzly, using orgzly syntax, [[file:00-mysite_portable-00/images/smudge.jpg]] the link works.

[Hubert]

Hi Raymond,

I've just rebuilt your folder structure and it works. However, I may have misunderstood you --- are you trying to create a link to your image files or display your images within your tiddlers? Either way, I've addressed both scenarios.

(1) LINKS to images

Please note, when using orgzly, using orgzly syntax, [[file:00-mysite_portable-00/images/smudge.jpg]] the link works.

If you want to use links to external files (whether they be images or anything else), you can use this syntax (please modify depending on the relative location of your target file). Note that depending on your browser, the link will be opened in a new tab:

[ext[Image|00-mysite_portable-00/images/smudge.jpg]]

(2) DISPLAYING images; please clarify which one is true:

(a) Your TW file and your "00-mysite_portable-00" folder are at the same level (in some folder)

(b) Your TW file and your "images" folder are are at the same level (in the "00-mysite_portable-00" folder)

In case of (a), the following works:

[img width="100%" alt="(image missing)" [00-mysite_portable-00/images/smudge.jpg]]

In case of (b), the following works:

[img width="100%" alt="(image missing)" [images/smudge.jpg]]

So in short, it all depends where your TW is located relative to your image(s) (and vice versa). Your TW will point to your image from its own "vantage point", so unless TiddloidLite renders its own path differently, which would mess up the default point of reference, you should have no issues.

Maybe try testing this using Chrome (or any other browser on Android) and see if you get the same results (I'm using my own TW on Android quite heavily, having adapted it for responsive design, and it works perfectly well in Chrome).

Regards,

Hubert

[Raymond McDowell]

Once again, thanks for your suggestions but it still doesn't work on any of my android devices. I thought perhaps it was because of my browser and attempted to use the Samsung browser, then Chrome but when the img command still didn't work and the ext command showed the following address

content://0@media/external/file/images/smudge.jpg

something is happening I don't understand.

I dug out a windows laptop and, using the same file configuration, everything worked fine just as you noted, but back on my android I am still flummoxed.

[Hubert]

It looks that for some unexplained and mysterious reasons relative paths are not interpreted correctly on your Android device.

It looks that your image access path is:

On Android
content://0@media/external/file/images/smudge.jpg

On Windows
file:///X:/file/images/smudge.jpg
(where X is your drive letter)

You might want to solve this by putting the underlined portion of the full path into, well, a variable that is dynamically set at startup (that's what I do to create full URLs no matter what devices or OSs I'm on). But I feel this could be a bit overkill in your case and an unnecessary solution to a problem that's probably caused by something that may have been overlooked elsewhere.

Again, I'm able to seamlessly use my responsive TW on Android, Windows and ChromeOS with references to files and images and don't experience (nor, would I expect to experience) the issues you're describing. It is very difficult to understand what the root cause of the problem could be, short of suspecting you're using a heavily customised version of Android.

My apologies, but I'm unable to give you any valuable advice (without looking at your device).

Regards,

Hubert

[Mark S.]

@Hubert @Raymond

What versions of Android are you each using?

Android is progressively making it harder to share files in the old fashioned way. Depending where your tw file is located, you may not be able to access subdirectories.

For the browser, if your starting directory is the downloads directory, or a sub-directory of the downloads directory, then you should be able to access an image directory below that.

Good luck!

[TonyM]

Perhaps you need to give Tiddloid lite file access. See what permissions the app wants or assign more in the phone.

[Raymond McDowell]

First of all, Mark S. thank you for your suggestion. I moved my trial tiddlywiki to the downloads folder and although relational linking does not work for me with TiddloidLite, Chrome or Samsung browser. I found it works perfectly with Firefox when PMario's File Backup 0.3.5 is included as an add-on. So thank you Mark and thank you Mario. Since I spend well over 90 per cent of my time on Android these days, it is essential I have an environment that works in that environment, but the ten percent I spend in a Windows environment is crucial as well.

I am now moving my data from orgzly, which I love on Android, but I hate trying to deal with org files on Windows, back to TiddlyWiki, which is both aesthetically pleasing and great for eliminating redundant entries.

Finally, as a normal end user without great technological leanings, I don't know how it works. I don't know why it works, but thank goodness it does work.