15+ أمثلة على برنامج WordPress Slider (عرض)

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

• تقديم المحتوى بكفاءة وبأسلوب
• ضع الكثير من المعلومات في مساحة صغيرة
• أضف التفاعل إلى موقع الويب الخاص بك
• توجيه الزوار إلى الترقيات والصفحات الهامة

في هذه المقالة ، سوف نعرض لك أكثر من 15 مثالاً ممتازًا لشريط تمرير WordPress. سنوضح لك أيضًا كيفية إنشاء شريط تمرير رائع لموقعك على الويب بسرعة.

عرض إلهام المنزلق

فيما يلي بعض أفضل الأمثلة على أشرطة التمرير لإلهامك. كانت المعايير التي استخدمناها لاختيار هذه أشرطة التمرير هي 1) الإبداع و 2) سهولة الاستخدام. تحتوي بعض التصميمات على كليهما ، وبعضها له جانب واحد فقط.

سي ان بي سي برايم

شريط تمرير CNBC مقروء وسهل الاستخدام. يستخدمون خطًا سميكًا لعناوين العرض ، لذلك من السهل قراءتها. يساعد تلوين النص حقًا على إبراز الخلفية أيضًا.

سي بي اس

يستخدم شريط تمرير CBS صورًا جذابة بخط كبير والعديد من المساحات البيضاء لتسهيل القراءة والاستخدام. تجعل الرموز النقطية الكبيرة من الواضح تمامًا ما سيحدث عند النقر.

يونيفرسال أورلاندو

إن منزلق Universal له هدف واحد بسيط: إغراءك بزيارة متنزههم الترفيهي. على الرغم من أن CTAs تقدم بعض العروض المغرية ، إلا أن الصور تتحدث عن كل شيء.

دوف كوتس سافيل

يستخدم Saville خط Serif أنيقًا مقترنًا بالصور التي تبرز جودة وحرفية نقوش الحمام. يشرحون أيضًا معرفتهم الواسعة بالحمامات ، لذلك يمكنك التأكد من أنك تشتري أفضل المنازل على الإطلاق لأصدقائك الريش.

مخبز ماجنوليا

Magnolia Bakery هو مثال رائع على شريط تمرير للصور فقط. عندما يكون لديك معجنات لذيذة ، من يحتاج إلى شيتشات؟ تبدو هذه المنزلقات الثلاثة الصغيرة لذيذة على صفحة الويب هذه.

المشتعلة خانق

Flaming Gorge هو معلم جذب شهير في ولاية يوتا. تقول العناوين الرئيسية في معرض الصور الخاص بهم كل شيء: يمكنك الاستمتاع بالاتساع في المنظر دون التعرض للخشونة في منتجع Flaming Gorge.

الموضوعات الرئيسية

تقدم Headway Themes استخدامًا مبتكرًا لشريط التمرير. بدلاً من شريط التمرير النموذجي الموجود أعلى الصفحة ، قاموا بوضعهم في أسفل الصفحة ، واستخدموه لعرض مواقع الويب التي تستخدم سماتها. ماهر!

معرض سميثسونيان فرير ساكلر

يستخدم Smithsonian Freer Sackler شريط تمرير تنقل بسيطًا لتوجيهك إلى الصفحات الرئيسية على موقع الويب. يعد المظهر البسيط والنظيف لشريط التمرير ، المحاط بمساحة بيضاء تجذبك إلى الصور ، مثاليًا لمعرض فني.

كوكب وحيد

يتوهم شريط التمرير في Lonely Planet بصورة دوارة بملء الشاشة ورسوم متحركة لافتة للنظر. لا يقتصر الأمر على هذا المنزلق ذو المظهر الرائع فحسب ، بل يسهل أيضًا التنقل إلى أي مكان يلفت انتباهك.

الخليج الشرقي

يضع شريط تمرير كونفيرس كل التركيز في المكان الذي ينبغي أن يكون عليه: على المنتج. التفاصيل والأنسجة واضحة جدًا في شريط التمرير هذا بحيث يمكنك تقريبًا لمس القماش.

شيتز

يستخدم شريط تمرير Sheetz ألوانًا ساطعة وممتعة مع أزرار أمامية تفاعلية تنزلق للخارج وأنت تحوم فوقها. المتزلجون مثل هذا فقط التسول للعب بها.

اكس بوكس

يستخدم شريط تمرير Xbox للبساطة مع صور المنتج النظيفة ، وعدد قليل من الكلمات ، والكثير من المسافات البيضاء. هذه بالتأكيد حالة حيث الأقل هو الأكثر.

تيم هورتونز

شريط تمرير Tim Hortons هو مثال كلاسيكي لتصوير الطعام الرائع في العمل. احصل على اللعاب ، وقم بإقران ذلك ببعض الصفقات الرائعة ، وزدهر! لديك منزلق يصعب للغاية مقاومته.

سوني الخشخشة

تلتصق الخشخشة بنظام ألوان أبيض وبرتقالي بسيط يلفت الانتباه إلى شريط التمرير الدوار. تمنحك الدعاية الصغيرة في كل شريحة الرغبة في تشغيل الأنبوب والتقاط بعض البرامج التلفزيونية.

معهد سميثسونيان

يستخدم شريط تمرير Smithsonian أسهم كبيرة وواضحة حتى تتمكن من العودة إلى الشريحة السابقة التي فاتتك. هذا مهم في هذه الحالة ، لأن هناك الكثير من النصوص للقراءة على كل شريحة.

متحف اللوفر

منزلق اللوفر هو بالضبط ما تتوقعه: تاريخي وأنيق. هذا بفضل المسافة البيضاء الواسعة والخط الرقيق والتلاشي البسيط والدرامي إلى اللون الأسود في الصور. الشيء الآخر الرائع في شريط التمرير هذا هو زر التشغيل / الإيقاف المؤقت في الركن الأيمن السفلي.

كيف تصمم منزلق WordPress الخاص بك

الآن قد تتساءل ، " إن أشرطة التمرير هذه رائعة ، ولكن كيف يمكنني إنشاء واحد لموقع الويب الخاص بي؟"

حسنًا ، لحسن الحظ ، الأمر بسيط جدًا بفضل المكون الإضافي Soliloquy لـ WordPress.

أولاً ، تحتاج إلى تثبيت وتفعيل المكون الإضافي Soliloquy Slider. لمزيد من التفاصيل ، راجع هذا الدليل خطوة بخطوة حول كيفية تثبيت مكون إضافي في WordPress.

بعد ذلك ، حان الوقت لإنشاء شريط التمرير الأول. انتقل إلى Soliloquy »إضافة جديد لإضافة شريط تمرير. يمكنك تحديد الملفات من جهاز الكمبيوتر الخاص بك إذا كنت بحاجة إلى تحميل الصور. إذا كنت قد قمت بالفعل بتحميل الصور إلى موقع الويب الخاص بك ، فحدد الملفات من مصادر أخرى.

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

يمكنك أيضًا تكوين تفاصيل أخرى حول شريط التمرير الخاص بك عن طريق تحديد علامة التبويب التكوين على اليسار. يمكنك تعيين حجم الصورة وموضوع شريط التمرير وسرعة انتقالات الشرائح. يمكن تغيير موضع التسمية التوضيحية للنص هنا أيضًا. راجع هذه الإعدادات.

بمجرد أن تشعر بالرضا عن الإعدادات الخاصة بك ، ألق نظرة على علامة التبويب الهاتف المحمول . سيسمح لك ذلك باختبار شكل موقع الويب الخاص بك على جهاز محمول وضبط إعدادات دقة الهاتف حسب الحاجة.

(راجع أيضًا علامة التبويب " متفرقات " لاستيراد أو تصدير شريط التمرير الخاص بك.)

أضف شريط تمرير إلى صفحة أو منشور

لقد انتهيت من إنشاء شريط التمرير! حان الوقت الآن لإضافته إلى المنشور أو الصفحة التي تختارها. قم بتحرير منشور أو صفحة ، وانقر فوق الزر " إضافة شريط تمرير " وحدد شريط التمرير الخاص بك. تذكر نشر أو تحديث المنشور / الصفحة الخاصة بك لحفظ التغييرات.

سيتم الآن تشغيل شريط التمرير الخاص بك على موقع الويب الخاص بك:

هذا هو! لديك الآن شريط تمرير WordPress الخاص بك. نأمل أن تكون هذه المقالة قد ألهمتك بأكثر من 15 مثالًا ممتازًا لشريط تمرير WordPress ، وساعدتك في إنشاء شريط التمرير الأول.

قد ترغب أيضًا في التحقق من جميع الميزات المتقدمة التي يمكنك استخدامها عند تصميم أشرطة التمرير الخاصة بك. إمكانيات تخصيص شريط التمرير الخاص بك لا حصر لها تقريبًا ، لذا ابدأ مع Soliliquy اليوم! فيما يلي بعض الأمثلة لما يمكنك القيام به باستخدام شريط تمرير Soliloquy.

• قم بإنشاء منزلق صورة بعرض كامل في WordPress
• تغيير وقت شريط التمرير في WordPress
• قم بإنشاء شريط تمرير فيديو سريع الاستجابة في WordPress

إذا أعجبك هذا المقال ، فيرجى متابعتنا على Facebook و Twitter لمزيد من دروس WordPress المجانية.