آه، لقد فهمت الآن. كنت أعتقد أن الغرض من embedMaxHeight هو عرض التعليقات بأسلوب أكثر طبيعية، مع تقليل التمرير إلى أقصى حد ممكن (إلا في الخيوط الطويلة التي ستظل تتطلب التمرير). لذلك قمت بضبطها على 15000 بكسل. سأقوم بتقليلها قليلاً.
في هذه الحالة، أعتقد أن embedMinHeight قد لا يعمل كما هو مقصود. حتى مع ضبطه على 400 بكسل، لا يزال للإطار المدمج ارتفاع لا يقل عن 600 بكسل، مع بقاء فجوة صغيرة في النهاية.
مرحبًا!
إن نموذج التعليقات المُعاد تصميمه حديثًا يتفوق بشكل كبير، خاصةً في تجربة الهاتف المحمول! ومع ذلك، حددت مشكلتين صغيرتين:
نعم! قام كيجان ببنائه مع وضع أحد حالات الاستخدام الأساسية في الاعتبار، وسعداء لأنك أعجبك. لم ندمجه إلا قبل بضع ساعات فقط، لذا لا نزال نعمل على المتابعات، مثل مشكلة عرض شريط الأدوات وسلوك الإرسال عند الضغط على Enter.
أتساءل عما إذا لم يكن من الجيد عرض هذا النموذج مباشرة في الموضوع (على Discourse) أيضًا. عادةً ما يكون فتح النموذج أكثر جاذبية وسهولة في الاستخدام للجمهور غير التقني. ربما يستحق الأمر تجربة لمعرفة ما إذا كان سيعزز التفاعل؟
كان هذا بالفعل خطأ، وقد تم إصلاحه للتو في
تم إصلاح هذه المشكلة الآن، يرجى التحديث!
لاحظت مشكلة أخرى في موقعك. أرى أنك قمت بدمج نظام الوضع المظلم/الوضع الفاتح لمدونتك مع نظام تضمين Discourse الجديد، بحيث يؤدي تغيير وضع المدونة تلقائيًا إلى تغيير وضع التضمين. ومع ذلك، بينما يعمل التكامل بشكل جيد في متصفحي Firefox و Chrome، إلا أنه لا يعمل مع Safari. أفترض أن هذه مشكلة في Discourse، ليس فقط لأن نافذة منبثقة “السماح بالوصول” خاصة بـ Safari فحسب، بل إن مشكلة أخرى تتعلق بوظيفة شريط التمرير غير الصحيحة تؤثر أيضًا على Safari فقط.
وبغض النظر عن كل ذلك، فإنني أتساءل عن كيفية عملك على دمج الوضع المظلم/الوضع الفاتح. لقد بدأت منشورًا بعنوان الوضع المظلم التلقائي للتعليقات المضمنة قبل عدة سنوات، ومن خلاله تمكنت من أن يكتب شخص ما سكريبتًا باستخدام postMessage لجعل النظامين يعملان معًا. لكن مع نظام تضمين التعليقات الكامل الجديد في Discourse، يبدو أن السكريبت قد تعطل (مع كون الوضع المظلم لموضوع Discourse الافتراضي غريبًا). لذا، فسؤالي هو: هل كان لديك سكريبت postMessage مكتوب مسبقًا قمت بتحديثه لنظام التضمين الجديد في Discourse؟ وإذا كان الأمر كذلك (ورغم أنك تستخدم WordPress وأنا أستخدم Ghost)، فهل تمانع في مشاركة الكود الخاص بك؟ ربما يمكنني مقارنة كودك بما لدي لمحاولة جعل الأمور تعمل مع Ghost وإعداد الوضع المظلم لمدونتي.
إذا كان كل من مدونتك وDiscourse يستخدمان الوضع الداكن التلقائي المتبع لنظام التشغيل، فسيتم مزامنتهما.
أضفنا الوضع الداكن التلقائي إلى Discourse في Automatic Dark Mode color scheme switching
نعم، ولكن إذا فهمت وتذكرت بشكل صحيح، فإن ذلك يتيح لـ Discourse اكتشاف ما إذا كان نظام التشغيل يستخدم الوضع المظلم، ثم يضبط نفسه وفقًا لذلك. الموضوع الذي أعددته، والذي كان ردًا على الموضوع الذي ربطت به (والذي ربط أيضًا به)، كان يتعلق بزر التبديل في مدونة يقوم بالتبديل يدويًا بين الوضع الفاتح والوضع المظلم للمدونة (بغض النظر عن وضع نظام التشغيل). هل يبدو ذلك صحيحًا (وهذا بدوره يجعل سؤالي السابق ذا صلة)؟
وللتوضيح، هذا هو السكربت الذي طلبت من شخص ما كتابته لاستخدامه في مدونتي، والذي أعتقد الآن أنه يحتاج إلى بعض التعديلات (ربما يحتاج فقط إلى تغيير بعض الفئات، لست متأكدًا).
<style>:root.dark{background: #1D2224}</style>
<script>
const discourseUrl = 'https://ff2f.discourse.group';
const clearDarkModeThrottle = () => window.darkThrottled = false;
window.isDark = false;
window.discourseLoaded = false;
window.setDarkMode = state => {
window.isDark = state;
window.darkThrottled = true;
localStorage.setItem('darkmode-enabled', state);
Array.from(document.getElementsByClassName('dm-input')).forEach(element => element.checked = state);
document.documentElement.classList[state ? 'add' : 'remove']('dark');
setTimeout(clearDarkModeThrottle, 250);
window.discourseLoaded && setIframeStyle();
};
let sub = () => {};
if (localStorage.getItem('darkmode-enabled') === "true") {
document.documentElement.classList.add('dark');
// Update elements after domContentLoaded
sub = () => window.setDarkMode(true);
}
document.addEventListener('DOMContentLoaded', () => {
Array.from(document.getElementsByClassName('darkmode-toggle'))
.forEach(element => element.onchange = darkmodeToggled);
function darkmodeToggled() {
const input = this.querySelector('input');
window.darkThrottled ? (input.checked = !input.checked) : window.setDarkMode(input.checked);
}
sub();
sub = null;
});
const handleMessageListener = (event) => {
var origin = event.origin;
if (origin === discourseUrl) {
setIframeStyle();
window.discourseLoaded = true;
}
};
const setIframeStyle = () => {
const iframe = document.getElementById("discourse-embed-frame");
if (iframe && iframe.contentWindow) {
iframe.contentWindow.postMessage(
window.isDark ? "dark" : "light",
discourseUrl
);
}
};
window.addEventListener("message", handleMessageListener);
</script>
لقد قمت للتو بتحديث Discourse إلى أحدث إصدار، لكنني أواجه مشكلتين:
بالتأكيد،
هذا هو كود CSS الذي أستخدمه في Discourse
header a.button {
color: #fff;
padding: 6px 8px;
background-color: var(--tertiary);
display: inline-block;
}
.username a.staff {
padding: 2px 5px;
border-radius: 4px;
color: var(--tertiary-hover);
// text-shadow: 0px 0px 14px var(--tertiary-400);
background-color: var(--tertiary-400);
}
@media (prefers-color-scheme: light) {
/* الخلفية الرئيسية للإطار المدمج */
html, body {
font-family: 'Inter', sans-serif;
}
}
@media (prefers-color-scheme: dark) {
/* الخلفية الرئيسية للإطار المدمج */
html, body {
background-color: #1e2021 !important; /* متغير --bg الخاص بك */
color: #f7f7f7 !important; /* متغير --body-color الخاص بك */
font-family: 'Inter', sans-serif;
}
header.discourse {
border-bottom: 3px solid rgb(50.82, 50.82, 50.82);
}
article.post {
border-bottom: 1px solid rgb(50.82, 50.82, 50.82);
}
/* لون النص الرئيسي */
.embedded-posts,
.embedded-posts p,
.embedded-posts h1,
.embedded-posts h2,
.embedded-posts h3 {
color: #f7f7f7 !important;
}
/* خلفية الكتل، مثل تذييل الإطار المدمج (خيارات الرد) */
.embedded-footer {
background: #27292b !important; /* متغير --bg-2 الخاص بك */
border-top: 1px solid #27292b !important;
}
/* لون الحدود (لمنع ظهور الحدود الفاتحة) */
.embedded-posts, .embedded-footer {
border-color: #27292b !important;
}
/* يضمن أن الروابط/الأزرار لها اللون الصحيح */
// a:link, a:visited, .topic-post .post-action-list button {
// color: #35bcf1 !important; /* متغير --link-color الخاص بك */
// }
}
في هذه الحالة، أعتقد أن النهج الصحيح هو تفعيل حدث المراقبة دون تشغيل العلامة بالكامل. الإعداد الحالي يشوّه تحليلاتنا لأنه يُفعّل حدث page_view، مما يؤدي إلى تضخيم إحصائيات الموقع بشكل مصطنع.
خلال الليل، قفز عدد مرات مشاهدة الصفحات بشكل هائل، لكن هذه الأرقام مصطنعة—لا تملك أي منطق تجاري.
علاوة على ذلك، نحن نضاعف حاليًا تحميل ومعالجة السكريبتات.
في حالة GTM (مدير علامات جوجل)، الوضع أسوأ: كل سكريبت آخر في الحساب يتم حقنه مرتين، بما في ذلك بكسلات إعلانات Google وMeta، وسكريبتات شبكات الإعلانات التابعة لجهات خارجية، وغيرها.
بخصوص تحليلات Discourse الأصلية، أقترح إجراء تعديل إضافي: تقسيم حركة مرور التضمين إلى فئة منفصلة. هذا سيسمح لنا بعرض حركة مرور المجتمع وحركة مرور التضمين بشكل منفصل.
شكرًا جزيلاً لك، أقدر ذلك حقًا. ومع ذلك، فإن هذا يتركني في حالة من الارتباك قليلًا. عندما كنت أحاول تفعيل زر الوضع المظلم على مدونتي المستضافة على Ghost ليتوافق مع تضمين Discourse (حيث لم يكن يعمل افتراضيًا)، قيل لي في النهاية أنني سأحتاج إلى تنفيذ كود يستخدم postMessage (وقد قام شخص ببنائه، وقد نجح الأمر). لكن الكود الذي زودتني به لا يتضمن أي كود JavaScript على الإطلاق، وهذا لا يبدو منطقيًا بالنسبة لي، ولا أستطيع أن أفهم كيف يمكن أن يعمل كل شيء بشكل مباشر بسبب استخدام WordPress. على أي حال، شكرًا لك على كل حال.
مرحبًا بالجميع، فقط أتأكد لمعرفة ما إذا كان قد تمكّن أحد من النظر في هذه المشكلة حتى الآن؟
يبلغ المستخدمون عن عدم قدرتهم على استخدام النموذج على الإطلاق بسبب مشكلة حقل النص، مما يجعلها عائقًا كبيرًا لمجتمعنا.
LucasMiller: واجهة التعليقات أسفل المقالات بها خلل؛ لا يمكنني كتابة أي شيء للنشر (تم الاختبار على كل من iPhone و Android/Xiaomi). تضغط على حقل النص للكتابة، لكنه ببساطة لا يسجل أي إدخال. يرجى الاطلاع على ذلك عندما يتاح لكم الوقت!
يحدث هذا فقط في المقالات حيث سيكون التعليق هو الأول.
LucasMiller: تمكنت فقط من النشر عن طريق إنشاء اقتباس دون إضافة أي نص. فقط بعد إعادة توجيهي إلى واجهة المجتمع (بدلًا من البقاء أسفل المقال) تمكنت فعليًا من إضافة تعليقي.
إن استخدام حل Markdown البديل يساعد، لكنه ليس مثاليًا للمستخدم العادي. أي رؤى أو حلول مؤقتة ستكون محل تقدير كبير! شكرًا مجددًا على المساعدة.
cc @Falco
هذا الإصلاح يجب أن يحل المشكلة، وسيتم تطبيقه لاحقًا اليوم
شكرًا @renato
شكرًا لك يا @ريناتو، تم الإصلاح!
ملاحظة سريعة: لا يزال التمرير الأفقي يظهر على الأجهزة المحمولة، متى ما توفرت لديك الفرصة للنظر في الأمر.
تحدث هذه المشكلة بالنسبة لي في جميع المقالات. ربما تكون مشكلة خاصة بـ نظام iOS فقط؟ إليك بعض لقطات الشاشة من Safari و Chrome.
