Iframe embedding of webpages

Archive Feature Requests
#1

I would like have an option to embed webpages in remnote using iframe. Although there is a workaround for this by using /plug-in command, it takes too much time since every webpage which I want to embed has be added separately as a plug in.

#2

Another workaround would be :gear: Smart Rem

3 Likes
#3

How to use it? Is it there in the remnote library.

1 Like
#4

Finally today I was able to use Smart Rem to embed websites in remnote. Thanks @hannesfrank. I saw in discord that you are working on version 2 of Smart Rem. Will there be any backwards compatibility problem? I am asking because I plan to use it extensively. Or should I wait for the version 2 ?

1 Like
#5

Sorry that I did not answer earlier. I actually had your post bookmarked to notify you on v2 release, but I was still not satisfied enough to publish it…

I think there we can make a way to maintain backwards compatibility. But using >>> to tigger the “smartness” is just one - and maybe not the best - of many possible ways:

  1. prefix text: E.g. >>> embed:
    • easy to type
    • easy to parse for
    • feels like a real REPL (>>> is used by Python for example)
    • no backlinks, need text search portals
  2. Reference (prefix): E.g. [[embed]]:
    • automatic backlinks and queries
    • more flexible to configure (You’d select a RemId that can be renamed later)
  3. Tags: I’m planning a group of smart rem under the working name “Smart View” that just display a certain type of rems. For example tag a template with #template-table to list all template instances in a table. Or #mermaid the code block instead of >>> mermaid: or #mindmap to display all children in a mindmap. Or various time table views for the daily document.
    • automatic backlinks and queries
    • don’t interfere with content
    • bring the whole template and typing functionality of RemNote like inheritance
  4. Intelligent Parsing: E.g. automatically render any hyperlinks to twitter as tweets or google docs or dropbox links as embedded document.
    • Maybe (?) too much of a performance drain since all rems on a page have to be checked for all types of smart rem (so a fast checking method like the first 3 is required).
    • Some really user friendly use cases since they activate without the user doing anything.

How would you prefer to trigger Smart Rem? One of the above or any other way?

Which Smart Rem are you planning to use extensively? The query ones will be reworked 100% for example :slight_smile:

#6

@hannesfrank

I am a radiology doctor. I use remnote to make notes about radiology and create flashcards for some upcoming exams.

For triggering Smart Rems I would prefer the simplest one
Why do you think that >>> embed : is easier to type than [[embed]]:
When we type [[embed]] for the first time, it gets saved as a rem reference and the next instance when we use it, it’s much easier to type than >>> embed. Am I right? or did I misunderstood something?
Also [[embed]] gives automatic backlinks and queries.

But from what I understood, tagging would be the best since template and typing functionality of RemNote also is preserved in addition to backlinks and queries.(Not sure whether I understood it fully) Can tags trigger every Smart Rem functionality or only a few of the Smart Rems like mind map?. If tags won’t works with all types of Smart Rems, [[]] can be used for rest of the functionality

Use-cases for smart rems, which I can incorporate into my workflow are

  1. Major use is for embedding websites which don’t allow download of data from there site. For example, see this link. I want to see this webpage embedded in my notes about that topic because that allow me to easily take a look at that case and it’s MRI findings without leaving remnote. Can you add some option to resize the embedded webpages also?
  2. Embed files from OneDrive and Dropbox (mostly CT/MRI images of cases)
  3. Mind mapping is the feature which could be implemented in describing classifications or imaging approach for a disease especially when they too big (helps in easy comprehension) Eg: Algorithm
  4. Queries - I may not use it currently since my database is small. As it grows big, queries will be important. Filtering was an important part which I liked in tiddlywiki which is my other tool of choice.
  5. Tweeting notes from remnote directly.

Hope this help :slightly_smiling_face:

1 Like
#7

Yeah, you are right. [[embed]] is even fewer keystrokes than >>> embed:. Guess it’s just personal preference for me: I find it requires less metal effort if I just type than if I have to “wait” for a dialog to open, change my focus and consciously have to select the right option.

I also forgot to mention references have autocomplete! E.g. we could start all smart rem references or tags with a special symbol like $ or > (like universal descriptors start with ~ by convention).

Tags can be made work for all Smart Rem. It just how we decide to implement it. Technical detail: At the moment I just ask a smart rem implementation “Hey, do you want to be executed for this rem?” and the Smart Rem is like “Let’s see. The Rem Starts with >>> embed:, so yes! It applies to me!”. And besides text in a rem it can also check for references, tags, if a certain highlight is present, if there is any link starting with https://twitter.com/, if it has more than 3 children, if its grandparent is a concept and its second to last sibling a descriptor ending in 42! and so on. :upside_down_face: You get the idea. And nobody says there can’t be multiple triggers for a Smart Rem (hence enabling backwards compatibility).

This currently not easily possible since Smart Rem can’t modify your knowledge base to store the size information. I think you can have an extra Custom CSS styling tag #iframe-w600-h400 though that applies a width and hight to that iframe.

Thanks for your interest and discussion! Now I just have to find the time to clean up the code and release it.

2 Likes