مرحباً بالجميع.
لقد أضفت الأكواد هنا إلى الحقول المطلوبة، لكنها لم تعمل. أين أخطأت؟
لقد جربت الإضافة أيضاً، لكنها تعطل منطقة شريط البحث.
مرحباً بالجميع.
لقد أضفت الأكواد هنا إلى الحقول المطلوبة، لكنها لم تعمل. أين أخطأت؟
لقد جربت الإضافة أيضاً، لكنها تعطل منطقة شريط البحث.
هممم، نعم، أظن أنك ستحتاج إلى القيام ببعض العمل الإضافي في CSS لجعل شريط الرأس يعمل مع الروابط.
سؤال، هل تقوم بالتطوير للجوال أيضًا؟ لأن شريط الرأس على الجوال لديه مساحة أقل بكثير لإضافة الأشياء. لا تريد إنشاء موقع سطح مكتب جميل لتكتشف فقط أن عرض الجوال الخاص بك فوضوي.
لا أتذكر حاليًا، ولكن قد يكون هناك أيضًا منفذ إضافي يمكنك استخدامه. ![]()
مرحباً ليلي.
أريد أن أفعل هذا لسطح المكتب فقط.
العرض على الهاتف المحمول جيد الآن، لا أريد تضييق منطقة الرأس هناك.
إذا لم يحدث ذلك بالمناسبة، فلا بأس. سيؤدي هذا الزر إلى إعادة التوجيه إلى فئة منتدى.
أردت فقط أن يمنح هذا الزر أجواءً لطيفة.
هل تقصد أيقونة في هذه المنطقة، على سبيل المثال؟

هل يمكنك توضيح ما تبحث عنه بالضبط؟
المنفذ الإضافي هنا في هذه المنطقة هو before-header-panel.
يتم استخدامه بواسطة مكونات روابط الرأس المخصصة وبحث الرأس.
روابط الرأس المخصصة هي الطريقة المثلى!
كما ذكرت ليلي، ستحتاج إلى ضبط CSS هنا.
من وجهة نظري، يستخدم مكون روابط الرأس بعض CSS على حاوية المنفذ، مما قد يفسر سبب تعطيله للبحث.
إذا لم يكن لديك مانع، هل يمكنك تمكين المكون مرة أخرى حتى أتمكن من إلقاء نظرة مباشرة على منتداك؟
تم شرح ذلك هنا، ولكن عندما أكتب الرموز اللازمة، فإنها لا تعمل.
لقد قمت بالتمكين الآن يمكنك النظر، شكراً للمساعدة ![]()
شكرا لك!
حاول إضافة هذا الـ CSS:
.floating-search-input-wrapper .floating-search-input {
margin: auto;
}
عندما أستخدم هذا الكود، يبدو طبيعيًا للمستخدم المجهول. لكنه لا يبدو طبيعيًا للمستخدم المسجل دخوله. السبب هو الأكواد التي استخدمتها لتوسيط شريط البحث.
أنا مسجل الدخول، ويظهر كما هو متوقع. أرى البحث في المنتصف. انظر إلى لقطة الشاشة الخاصة بي. ![]()
نعم، لقد أضاف يدويًا margin-right: -35px; للتعويض عن لوحة الرؤوس، والآن، مع الرابط، يجب تعديل القيمة مرة أخرى.
السبب في قيامي بذلك هو أن شريط البحث لا يتحرك إلى اليسار أو اليمين للعضو المسجل دخوله. يظل شريط البحث في نفس المكان قبل وبعد تسجيل الدخول.
ولكن يبدو أنه يؤثر أيضًا على إضافة روابط الرأس المخصصة. أعتقد أنني لن أضع زرًا هناك في الوقت الحالي. إذا كان بإمكاننا إضافته باستخدام CSS و HTML، فسأرغب في تجربته.
شكراً لك على إعطاء الوقت. ![]()
يمكنك أيضًا جعل شريط البحث خارج التدفق باستخدام الموضع المطلق.
لن تحتاج إلى margin بعد الآن.
.floating-search-input-wrapper {
position: absolute;
left: 0;
top: calc((4em - 2.6rem - 2px - 2px) / 2); /* ارتفاع الرأس - ارتفاع البحث - الهامش - الحدود */
width: 100%;
}
قد تحتاج إلى إضافة استعلام وسائط للتحكم في العرض على دقة أقل والتأكد من أنه لا يتداخل مع العناصر الأخرى.
هذا رائع شكراً جزيلاً لك، سأتحكم/أتفقد ذلك. ![]()
ولكن، عندما أقوم بتمكين روابط الرأس المخصصة، لا يبدو قسم الرأس طبيعيًا.
هذه ليست مشكلة كبيرة. أردت فقط إضافة شيء مرئي إلى قسم الرأس.
مرحباً @Arkshine، لقد أدركت للتو. بعد هذه الشيفرة، لا يمكن النقر على الشعار.
أعتقد أن الأمر يتعلق بالشيفرة position: absolute;.
يمكنك إضافة هذا الـ CSS لجعل الشعار يتكدس فوق البحث.
.home-logo-wrapper-outlet {
z-index: 1;
}
لديك حل آخر للـ CSS floating-search-input بدلاً من التعامل مع الجوانب (تأكد من إزالة الـ CSS من floating-search-input-wrapper):
.floating-search-input {
position: absolute;
left: 0;
transform: translateX(calc(50vw - (33rem / 2)));
}
شكراً جزيلاً لك يا Arkshine ![]()