حاليًا، تعرض صفحة الاشتراك الرئيسية /s ببساطة خيارات الاشتراك/الدفع. ويحتوي كل خيار اشتراك/دفع على قدر محدود فقط من الأحرف النصية التي يمكنك تضمينها.
لأغراضي، أود أن أجعل صفحة الهبوط /s أكثر ترحيبًا وإعلامًا بدلاً من مجرد “للأعمال فقط”.
هل من الممكن إضافة نوع من النص التمهيدي أو المعلوماتي إلى صفحة /s فوق خيارات الاشتراك/الدفع؟ أو هل هذا شيء قد يتم تنفيذه (يومًا ما) كخيار أو هو خارج النطاق؟
في الأساس، مجرد مربع نص قابل للتحرير من قبل المستخدم مع خيارات التنسيق القياسية فوق الخيارات الحالية.
لست على دراية تامة بخيارات تحرير CSS الخاصة بـ Discourse بعد، لذلك أنا غير متأكد مما هو ممكن عندما يتعلق الأمر بتحرير الصفحات أو المكونات الإضافية أو المكونات. لذا أرجو المعذرة عن أي جهل من جانبي.
قبل/بعد. لاحظ أنني اضطررت إلى تغيير النص الافتراضي “الاشتراكات” إلى “إجراء دفعة” لأننا نقدم أكثر من الاشتراكات. على الرغم من أنه يبدو أن النص مرتبط أيضًا بعنوان الصفحة. لذلك في حالتي، سيكون من المنطقي إضافة كتلة نصية فوق عنوان الصفحة الحالي مقابل أسفلها.
هل يمكنني الاستفادة من هذا إذا كنت مستضافًا؟ إنه يفتقر قليلاً إلى التعليمات لمستخدمي Discourse الجدد - لذا فمن المحتمل أنني لست المرشح المثالي للاستخدام في الوقت الحالي، ولكني أحاول أن أكون على اطلاع في أسرع وقت ممكن وهذا يبدو مفيدًا حقًا.
اضطررت إلى متابعة صفحة Github للعثور على إشارة إلى هذا:
للعثور على منافذ الإضافات (plugin outlets)، قم بتشغيل enableDevTools() في وحدة تحكم جافاسكريبت (javascript console).
لقد أضفت هذا الرابط حتى قبل أن أقرأ هذا الجزء من رسالتك!
أوه، ولكن بالنظر إلى مخارج المكونات الإضافية على /s لا يبدو أن هناك أي مخارج للمكونات الإضافية. إذا كنت ترغب في وضع نص فوق عنوان “إجراء دفعة”، فأنت محظوظ!
(تظاهر بأن “الدفع مقابل الخدمات” هي “إجراء دفعة”) يمكنك وضعه إما في top-notices أو above-main-container، ولكني أخشى أن يؤدي ذلك إلى إضافة المحتوى في كل صفحة، وليس فقط صفحة الدفع ما لم تتمكن من اكتشاف بعض CSS لإخفائه في جميع الصفحات الأخرى. إذا كنت صبورًا، فهناك احتمال معقول أن تتمكن من الحصول على https://ask.discourse.com/ ليخبرك بكيفية القيام بذلك.
من ناحية أخرى، سيكون طلبًا عادلاً لإضافة مخرج مكون إضافي في تلك الصفحة، ولكن هذا شيء آخر لتتعلمه.
نعم. أنا في مستوى يمكنني فيه تثبيت مكونات السمة دون مشاكل.
لم يكن القصد منه نقدًا على الإطلاق. أعتذر إذا بدا الأمر كذلك. كان مجرد ملاحظة كمستخدم جديد.
نعم، لقد اكتشفت هذا الرابط في وقت سابق خلال عمليات البحث التي أجريتها. المشكلة هي أنني لا أعرف كيفية تشغيل Discourse في بيئة تطوير (أو الوصول إليه عبر وحدة تحكم المتصفح) بعد.
لذا، كان استفساري حول إمكانية الاستفادة من المكون الخاص بك يتعلق بذلك والحاجة إلى الوصول إلى شريط أدوات المطور لاستخدامه، وليس تثبيت المكون نفسه. أعتذر عن الالتباس.
لم أكن على علم بهذا المورد، شكرًا لك.
أما بالنسبة للموضع، فأنا راضٍ عن وضع النص التمهيدي في أي مكان يناسبه بسهولة فوق محتوى “الاشتراك” الفعلي طالما أنه لا يظهر في كل صفحة.
لا، لا. كنت أقصد أن أشير، نعم. أنت على حق. يجب تحسين التوثيق. لهذا السبب قلت إنه “عادِل”!
لست مضطرًا لذلك. فقط افتح أدوات المطور في متصفحك (يعمل F12 ما لم تكن تستخدم جهاز Mac؛ ويجب أن أبحث عنها في كل مرة أستخدم فيها جهاز Mac حتى لو كان على بعد 8 أقدام مني، ثم أبحث في جوجل عن “mac open dev tools browser” أو شيء من هذا القبيل) واكتب enableDevTools() في موجه وحدة التحكم. يمكنك القيام بذلك هنا والآن، على هذا الموقع.
آه. وحدة تحكم المطور للمتصفح، وليس وحدة تحكم تابعة لـ Discourse. بدأت الأمور تتضح أكثر. شكرًا لك.
لقد قمت بتمكين المكونات المخصصة (Custom Components). وقمت بتمكين أدوات المطور (devtools) في وحدة تحكم المتصفح. وقمت بتنشيط شريط أدوات المطور لرؤية مكونات الإضافات (plugin-components).
والآن أفهم، أنت تقول أنه لا يوجد مكون إضافة لـ الاشتراكات (Subscriptions)، وبالتالي لا توجد طريقة *سهلة لوضع نص في صفحة الهبوط المحددة تلك. فهمت.
*سهلة بمعنى الخطوة 1. الخطوة 2. الخطوة 3. نجاح! وليس تتطلب ساعات من البحث وتعليمات CSS، إلخ.
قرأت في مكان ما خلال عمليات بحثي الأخيرة عن الاشتراكات (أعتذر ليس لدي الرابط في هذه اللحظة) أنه من المقرر إجراء عملية مراجعة شاملة لها على أي حال. آمل أن يتم النظر في اقتراحي لإضافة منطقة مقدمة/نص في أي تطوير مستقبلي.
يجب أن يكون هناك فئة جسم (body class) موجودة فقط في صفحة الاشتراك، حتى تتمكن بعد ذلك من استخدام CSS لإخفاء العنصر الذي تضيفه في كل صفحة ما عدا صفحة الاشتراك.
نعم، الاشتراكات لديها class="above-main-container-outlet subscriptions-campaign ember-view"، لذا يمكنك فعل شيء مثل إخفاء فئة العنصر الذي تضيفه ثم إظهاره مرة أخرى إذا كان ضمن subscriptions-campaign. شيء من هذا القبيل.
بعد البحث قليلاً على جوجل و SO، قمت بتجميع نسخة CSS خالصة:
.above-main-container-outlet.subscriptions-campaign::after {
content: "Whatever text I want to put here! \A This is a new line! \A";
white-space: pre;
}
لقد نجحت في تشغيله فقط على صفحة الاشتراكات وبشكل منسق بشكل صحيح تقريبًا باستخدام ما يلي:
/* الجزء 1: العنوان (منسق كـ H1 أصلي) */
body:has(.product-list) .above-main-container-outlet.subscriptions-campaign::before {
content: "هذا هو العنوان";
display: block;
/* تنسيق لمطابقة عناوين 'title-wrapper' */
font-family: var(--heading-font-family);
font-size: var(--font-up-5);
font-weight: bold;
line-height: var(--line-height-small);
color: #DDDDDD;
/* مسافة بين هذا العنوان والنص أدناه */
margin-bottom: 8px;
}
/* الجزء 2: نص الجسم (مع مسافة أدناه) */
body:has(.product-list) .above-main-container-outlet.subscriptions-campaign::after {
content: "هذا هو النص العادي الذي يأتي أسفل العنوان. \A لا يزال بإمكانك استخدام الشرطة المائلة العكسية A لأسطر جديدة هنا.";
display: block;
/* تنسيق لمطابقة نص الجسم القياسي */
font-family: var(--font-family);
font-size: var(--font-0);
line-height: var(--line-height-medium);
color: #DDDDDD;
white-space: pre-wrap;
/* هذا ينشئ المساحة الفارغة (عودة السطر) أسفل النص الخاص بك */
margin-bottom: 40px;
}