retypeapp / retype

Retype is an ✨ ultra-high-performance✨ static site generator that builds a website based on simple text files.
https://retype.com
Other
1.06k stars 203 forks source link

Add embed content function #51

Open slimooo opened 3 years ago

slimooo commented 3 years ago

Hello,

Can you please add the possibility to add easily videos (youtube, dailymotion...), music (soundcloud, deezer...), codes (codepens...) ?

Thank you :)

AndreyChechel commented 3 years ago

Hi @slimooo

Thanks for the request, currently we have limited support of the embed feature - multimedia content can be integrated into the page using the syntax below. Please pay your attention to the YouTube URL structure, it has to use /embed/ path in order to work.

{% embed url="https://www.youtube.com/embed/qeqhXvE5aPY" caption="Video caption here" %}

image

We have plans on supporting slightly different syntax, so it's aligned to other Retype components, as well as implementing auto-detection of embeddable URLs. We'll keep the issue open to track the progress here.

devon commented 3 years ago

Some suggestions about embed video:

![](my_video.mp4)
!!!loop autoplay muted playsinline
../static/my_video.mp4
!!!
![!video loop autoplay width=300](../static/my_video.mp4)
latenitefilms commented 1 year ago

Just jumping onto this issue...

We currently use this for our YouTube embeds:

<style>
    .videocontainer {
      position: relative;
      width: 100%;
      padding-bottom: 56.25%;
    }
    .video {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      border: 0;
    }
</style>

:::videocontainer
<iframe class="video" src="https://www.youtube-nocookie.com/embed/_tHdyD9TGCA?controls=0" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
:::

This works great, however it would be amazing if it would be simplified to:

![youtube cookies="false" playercontrols="false" url="https://www.youtube.com/watch?v=_tHdyD9TGCA"]

It would also be AMAZING if instead of actually embedding the video, it just shows the thumbnail, and when you click on it, THEN it loads the embed. This would help with page loads and privacy concerns.

Something like:

![youtube preload="false" cookies="false" playercontrols="false" url="https://www.youtube.com/watch?v=_tHdyD9TGCA"]
j1mc commented 9 months ago

Along these same lines, we're interested in content embedding. For example, having a 'hidden', shared page that we can embed in other pages. Right now, we can embed and use the layout: central layout feature, but it includes the main site navigation in the embedded content.

I think that a feature like layout: embedded (which uses an slimmed-down, content-focused template) could work here.

I hope that this request makes sense. If there's a way for me to do this on my own, I'd be glad to know about it. Thank you.

j1mc commented 9 months ago

I think we can disregard my prior comment here. You provide this feature via 'include' statements (shown here).

Can this issue be closed now?