تضمين مواضيع Reddit المعاد تصميمها مع الفيديو

كيف يمكننا تضمين مقاطع فيديو من Reddit في منشوراتنا؟ على سبيل المثال، هذا المنشور:

رابط هنا

يحتوي على كود تضمين مثل هذا:

<blockquote class="reddit-card" data-card-created="1588774544"><a href="https://www.reddit.com/r/VALORANT/comments/gdyrsg/i_also_decided_to_edit_at_2am/">I also decided to edit at 2AM</a> from <a href="http://www.reddit.com/r/VALORANT">r/VALORANT</a></blockquote>
<script async src="//embed.redditmedia.com/widgets/platform.js" charset="UTF-8"></script>

ماذا عن هذا؟

  https://www.reddit.com/r/VALORANT/comments/gdyrsg/i_also_decided_to_edit_at_2am/

الذي يفعل ما يلي:

آه. هذا ليس جيدًا. أنت تريد أن يعمل الفيديو داخل discourse، لا أن ينقلك إلى Reddit.

إعجاب واحد (1)

شكرًا لك.
نعم، نود، إذا أمكن، تشغيله مباشرة هناك مثل يوتيوب وفيميو.

هاها، أنتما تريدان ذلك، لكن هل فكرتما فيما يريده Reddit؟

منذ أن غيّروا فلسفتهم بالكامل وبدأوا في استخدام v.redd.it، لم يعد الأمر كما كان من قبل.

جميع وسوم OpenGraph وTwitter Card تمنحنا صورة ثابتة. Reddit واضحة جدًا في السماح فقط بتضمين صورة ثابتة.

إذا تعمّقت أكثر، ستجد أن الفيديو موجود في حاوية DASH، لذا فإن الصوت والفيديو ملفان منفصلان. لجعل هذا يعمل على Discourse، يتطلب الأمر على الأقل استخدام مشغل فيديو JS مخصص.

إعجاب واحد (1)

في الواقع، يسمح Reddit بذلك:

عند الضغط على زر تضمين (Embed)، يظهر ما يلي:

مشكلتي هي كيفية السماح بعرض ذلك في منشوري على موقع Discourse الخاص بي.

لقد جربت مشاركة old.reddit وهي مجرد صورة أيضًا. هل هذه واجهة المستخدم الجديدة لـ Reddit؟

نعم، إنه الجديد.

إعجاب واحد (1)

يبدو أنهم يقومون بتفويض الأمر إلى embed.ly.

عند التعمق في الأمر، يبدو أنه يمكن استخدام معرف المنشور لبناء إطار iFrame يعمل في النهاية.

ما لم يرغب @techAPJ في تولي الأمر، فأنا أقول #مرحبًا_بالـPR

<iframe src="https://old.reddit.com/mediaembed/gdyrsg" width="690" height="388">

[إطار iFrame يعمل ويشغل الفيديو تلقائيًا]

إعجابَين (2)

@Falco، هل يمكننا إيجاد حل لا يشغل الفيديو تلقائيًا؟

تعديل: إذا قمنا بتطبيق allow="autoplay 'none'" قسرًا على عنصر iframe في مُنقي HTML، فقد يحل هذه المشكلة (في المتصفحات الجديدة فقط).

أيضًا، لا تعمل أي من أزرار المشغل (مثل الإيقاف المؤقت، ملء الشاشة، إلخ)

هل هناك من يرغب في تقديم طلب سحب (PR) لهذا؟ :thinking:

إذا نقرت على زر المشاركة > تضمين في عنوان URL المثال هذا: https://www.reddit.com/r/timelapse/comments/w2al1z/amazing_timelapse_of_summertime_storms_in_florida/، ثم انسخ هذا الرمز:


<iframe id="reddit-embed"
src="https://www.redditmedia.com/r/timelapse/comments/w2al1z/amazing_timelapse_of_summertime_storms_in_florida/?ref_source=embed&amp;ref=share&amp;embed=true"
sandbox="allow-scripts allow-same-origin allow-popups"
style="border: none;" scrolling="no"
width="640" height="419">
</iframe>

يتم تضمين الفيديو وتشغيله في نافذة الإنشاء:

ولكن يختفي الفيديو بعد إرسال المنشور.

إضافة allow="autoplay 'none'" في نهاية عنصر iframe يجعل الفيديو يظهر، ثم يتم تشغيله بشكل جيد مع عمل جميع عناصر التحكم المضمنة (إيقاف مؤقت، تشغيل، إلخ):


<iframe id="reddit-embed"
src="https://www.redditmedia.com/r/timelapse/comments/w2al1z/amazing_timelapse_of_summertime_storms_in_florida/?ref_source=embed&amp;ref=share&amp;embed=true"
sandbox="allow-scripts allow-same-origin allow-popups"
style="border: none;" scrolling="no"
width="640" height="419"
allow="autoplay 'none'">
</iframe>

مثل هذا: