كيف أصنع مكتبة الصور في WordPress؟

آخر تحديث - 8 مارس 2022

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

تعمل أداة Image carousel على الحفاظ على زوار موقع الويب بشكل فعال لفترة أطول لأن الصور المنزلقة تجعلهم أكثر فضولًا بشأن المنتج أو الخدمة التي يقدمها النشاط التجاري. في بعض الحالات ، لا يكون انزلاق الصورة آليًا ، ويتعين على الزائر تدوير الصورة يدويًا للكشف عن الشريحة التالية.

إنشاء مكتبة الصور في WordPress

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

سنقوم بوصف عملية تثبيت المكون الإضافي Smart Slider 3 في ضغط الكلمات. هناك العديد من الأدوات الأخرى للمهمة ، وقد تكون عملية التثبيت مشابهة لـ Smart Slider 3.

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

ابدأ باختيار حجم الصورة

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

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

نصيحة صغيرة واحدة: تنزلق دوارات الصور أفقيًا ، لذا فإن اختيار الصور الأوسع سيكون أكثر جاذبية من الصور المربعة.

تثبيت Smart Slider 3

تتشابه عملية تثبيت Smart Slider 3 إلى حد كبير مع أي أدوات أخرى متوفرة في السوق. للبدء ، أولاً ، قم بتسجيل الدخول إلى كلمتك اضغط على لوحة تحكم المسؤول. على الجانب الأيسر ، سترى لوحة تنقل بها العديد من الخيارات المختلفة للاختيار من بينها. من الخيارات ، اختر البرنامج المساعد وانقر على رابط "إضافة جديد".

سيظهر شريط البحث أمامك. ابحث عن Smart Slider 3 فيه. بمجرد تثبيت البرنامج المساعد ، يرجى النقر فوق خيار التنشيط.

بدء رحلة الرف الدائري للصور

يستخدم Smart Slider 3 صورًا من مكتبة الوسائط ، لذا تأكد من تحميل بعض الصور قبل البدء في عمل Slider. يمكنك الاطلاع على مقطع الفيديو التعليمي الخاص بهم للحصول على رؤية أفضل حول كيفية البدء في تحديد الصور وإضافتها إلى تنسيق العرض التقديمي الخاص بك. اضغط على Smart Slider 3 واحصل على مقطع الفيديو التعريفي "Learn Smart Slider 3" الذي يوفر معرفة متعمقة حول كيفية استخدام الأداة.

يمكنك الحصول على مساعدة من الفيديو أو قراءة هذه المقالة فقط للبدء.

اختر الخيار الأساسي من القائمة.

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

بعد تحسين الصورة ، اضغط على "إنشاء".

إضافة الصور إلى شريط التمرير

بمجرد تكوين الحجم والعرض الافتراضيين لـ Carousel ، فإن الخطوة الواضحة التالية هي ملء Carousel بصور جذابة. لهذا ، اتبع الخطوات أدناه:

• انقر فوق Add Slide Images في Smart Slider 3.
• سوف تحصل على خيار تحديد صورة لشريط التمرير الخاص بك. انقر فوق هذا الخيار.
• اختر الصور من مكتبة ورد.
• سيقدم كاروسيل بعد ذلك الصور المحددة. بمجرد أن تشعر بالرضا عن الصور المحددة ، انقر فوق قسم "نشر".

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

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

سيعمل Carousel على إعادة التوجيه أو الروابط الخلفية على جانبي أشرطة التمرير للتمرير يدويًا عبر الصور.

بشكل افتراضي ، لن تنزلق الصور الدائرية تلقائيًا ، ولكن يمكنك تغيير ذلك.

دورة تلقائية لصور الرف الدائري

في لوحة تحكم مسؤول WordPress ، انقر فوق رابط Smart Slider 3 وحدد خيار التحرير. اختر نمط "التشغيل التلقائي" واضغط على "تمكين". الوقت الافتراضي بين التبديل ثماني ثوان. الآن احفظ الإعداد المحدث من الزر Save على الجانب الأيمن من اللوحة.

استخدام الرف الدائري كأداة

يمكن أيضًا استخدام Smart Slider كصورة WordPress Slider. يمكن إضافة أشرطة التمرير هذه في أي مكان كأداة ، مثل الشريط الجانبي.

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

الصور أو عدم وجود صور هو السؤال الكبير

إن تصميم مواقع الويب وتطويرها أمر شخصي ، وما قد يجده الآخرون قد لا يكون جذابًا. يمر بعدة مراحل من التحديثات والتعديل ، وكانت مكتبة الصور ذات يوم من أكثر المتطلبات المطلوبة في مواقع الويب عندما بدأت الشركات في دمجها في كل مكان.

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

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

قراءة متعمقة

• كيفية تحسين حجم صورة المنتج؟
• أفضل ملحقات تكبير الصورة لـ WooCommerce
• نصائح ذكية لتحسين الصور