كيفية إنشاء معاينة الارتباط المرئي في WordPress
نشرت: 2020-07-07إن إثراء صفحاتك ومشاركاتك في WordPress بمحتوى مثل الموارد المفيدة أو المنتجات ذات الصلة أو عبارات الحث على اتخاذ إجراء الترويجية أو القطع المنسقة المسلية يمكن أن يساعدك أو علامتك التجارية في تقديم قيمة أكبر لجمهورك. لن يقوم الرابط العادي دائمًا بقطعه ، على الرغم من ذلك - ما لم يكن نص الرابط والمشاعر المحيطة مقنعة بدرجة كافية ، فقد يتم مسح هذه الروابط مباشرةً. من خلال إنشاء روابط مرئية لموقعك على الويب ، مثل الروابط المحسّنة التي تراها على Facebook ، يمكنك إضافة محتوى تفاعلي وجذاب سينتبه إليه زوارك. يعد البرنامج المساعد Visual Link Preview لـ WordPress طريقة بسيطة لإضافة المزيد من المهارة إلى روابطك.

فيما يلي بعض الطرق التي يمكنك من خلالها استخدام هذا المكون الإضافي:
- أضف CTA إلى ارتباط تابع.
- دعم الادعاءات والحقائق والإحصاءات.
- تنظيم المحتوى من المواقع الأخرى.
- قم بتضمين موارد مفيدة للقراء لمعرفة المزيد.
- روّج لمنتجات متجر التجارة الإلكترونية الخاص بك.
أيضًا ، في أبسط أشكاله ، يعد المكون الإضافي Visual Link Preview طريقة أكثر جاذبية للربط بالمنشورات ذات الصلة وجعل الأشخاص يبقون على موقعك لفترة أطول.
يتيح لك المكون الإضافي إنشاء معاينة مرئية لأي رابط داخلي أو خارجي ، ويمكنك أيضًا إنشاء قالب مخصص بنمط يتناسب مع علامتك التجارية أو موقعك. بعد ذلك ، ضع مربع معاينة مبسط في أي مكان في المنشور أو الصفحة. دعنا ننتقل إلى كيفية إضافة مربع معاينة إلى WordPress في كل من Gutenberg والمحرر الكلاسيكي.
العثور على البرنامج المساعد Visual Link Preview وتثبيته
من المحتمل أنك تعرف بالفعل كيفية القيام بذلك ، ولكن في حالة حدوث ذلك ، إليك عرض سريع للغاية حول كيفية تثبيت مكون إضافي جديد في WordPress:
- سجّل الدخول إلى لوحة تحكم WordPress الخاصة بك.
- حدد الإضافات من الشريط الجانبي الأيسر.
- حدد إضافة جديد في القائمة الفرعية التي ستظهر أسفل المكونات الإضافية.
- اكتب "Visual Link Preview" في شريط البحث أعلى يمين الصفحة.
- انقر فوق التثبيت الآن في الجزء العلوي الأيمن من مربع معاينة المكون الإضافي.
- بمجرد التثبيت ، انقر فوق تنشيط.
بمجرد تنشيط المكون الإضافي ، ستتم إعادة توجيهك إلى صفحة المكون الإضافي الخاصة بك ، وسترى هذا الإشعار في الأعلى. (تأخذك وثائق "الشروع في العمل" إلى هذه الصفحة.)

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

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

هناك تخصيصات لما يلي:
- عرض الحاوية ولون الخلفية والحشو.
- نصف قطر الحدود والعرض والنمط (متصل ، متقطع ، منقط ، إلخ) ولون.
- موضع الصورة (يسار ، يمين ، أعلى أو أسفل) ، الحجم ونصف قطر الحدود.
- حجم ولون العنوان وخطوط الملخص.
معظم هذه الأشياء تشرح نفسها بنفسها ، ولكن هناك بعض الأشياء التي يجب معرفتها حول حجم الصورة. يمكنك إما تعيين حجم مصغر أو حجم مخصص. بالنسبة للصورة المصغرة ، فإن الأحجام القياسية هي "الصورة المصغرة" و "المتوسطة" و "الكبيرة" ، لذلك عليك فقط كتابة ما تريده في الحقل. أو يمكنك تعيين حجم مخصص بهذا التنسيق: العرض × الارتفاع (150 × 150 ، على سبيل المثال).
في الوقت الحالي ، سأترك كل شيء كما هو لأرى كيف يبدو مربع الارتباط الافتراضي. بعد ذلك ، سأعود لإجراء التعديلات.
استخدام البرنامج المساعد مع محرر كتلة جوتنبرج
ذهبت إلى مسودة منشور مدونة وأضفت كتلة أسفل فقرة. ستجد كتلة Visual Link Preview ضمن الأدوات ، أو يمكنك البحث عنها فقط في الجزء العلوي من منتقي الكتل.

هذا ما تبدو عليه مجموعة Visual Link Preview:

عند النقر فوق مربع تحديد منشور أو صفحة ، لن ترى قائمة منسدلة للمحتوى الخاص بك ؛ سيكون عليك البحث عما تريد. يمكنك أيضًا إضافة رابط إلى عنوان URL خارجي (سأتجاوز ذلك قليلاً).
اخترت منشور مدونة منشور. هذا ما يبدو عليه الأمر بدون أن أقوم بإجراء أي تخصيصات على النمط:

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

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

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

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

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

سيظهر هذا المربع:

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

إضافة رابط خارجي باستخدام المحرر الكلاسيكي
هذه المرة ، سأضيف رابطًا خارجيًا. هذه هي حقول الارتباط الخارجي:

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

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

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

يمكنك قضاء الكثير من الوقت في اكتشاف التخصيصات الصحيحة ، ويجب عليك ذلك ، خاصة وأنك ستتمكن فقط من إنشاء قالب مخصص واحد.
معاينة تخصيصات النموذج الخاص بك
لا يمكنك مشاهدة معاينة مباشرة عندما تقوم بتخصيص القالب. يجب أن يتم فتح المنشور أو الصفحة في نافذة جديدة ، وإجراء التغييرات على صفحة تخصيص القالب ، ثم النقر مرة أخرى على المنشور أو الصفحة. قم بالتبديل بين خياري القالب المنسدلين (تذكر أنهما لا يختلفان عن بعضهما البعض) - يؤدي هذا إلى تحديث المربع حتى تتمكن من رؤية أحدث التغييرات.
كيفية استعادة النمط الافتراضي
لنفترض أنك أجريت مجموعة من التغييرات ، ثم أدركت أنك تفضل النمط الافتراضي. إذا تركت مفتاح تبديل استخدام النمط المخصص قيد التشغيل في إعدادات القالب ، فسيتم تطبيق إعداداتك المخصصة عندما تعود إلى صفحتك أو منشورك ، سواء اخترت استخدام الافتراضي من الإعدادات أو بسيط من القائمة المنسدلة للقالب (كما قلت ، مربك).
إذا كنت تريد العودة إلى الإعدادات الافتراضية للمكون الإضافي ، فيمكنك الانتقال إلى صفحة إعدادات القالب وإيقاف تشغيل زر استخدام النمط المخصص. ستكون جميع التخصيصات الخاصة بك موجودة إذا كنت تريد تبديلها مرة أخرى في النهاية ، ولكن هذا سيسمح لك باستخدام الإعدادات الافتراضية للمكون الإضافي إذا كنت تفضل الطريقة التي تبدو بها.
عيوب البرنامج المساعد Visual Link Preview
يعد المكون الإضافي Visual Link Preview مكونًا إضافيًا بسيطًا ومباشرًا يقوم بما يقول أنه سيفعله ، ومن السهل جدًا تعلم استخدامه. ومع ذلك ، نظرًا لأنها أساسية جدًا ، فهي تفتقر أيضًا إلى بعض المجالات التي يمكن أن تستخدم التحسينات.
لا توجد قائمة منسدلة بكل المحتوى الخاص بك. أردت هذا الخيار بدلاً من الاضطرار إلى تذكر اسم منشور أو صفحة مدونة لإضافتها كرابط.
لا يمكنك مشاهدة معاينة مباشرة للقالب المخصص. من الصعب جدًا الانتقال ذهابًا وإيابًا بين المنشور وصفحة إعدادات القالب في كل مرة تريد معرفة ما إذا كان هذا هو المقدار المثالي من المساحة المتروكة أو نوع الحدود التي يجب استخدامها.
يمكنك فقط إنشاء نموذج مخصص واحد. هذا هو أكبر عيب في البرنامج المساعد. لا يمكنك إنشاء عدة قوالب ثم اختيار واختيار النموذج الذي تستخدمه لمطابقة صفحة معينة أو منشور مدونة أو نوع ارتباط. لا يمكنك أيضًا تعيين بعض مربعات المعاينة لاستخدام القالب المخصص الخاص بك والبعض الآخر لاستخدام الإعدادات الافتراضية للمكون الإضافي - إنها واحدة أو أخرى.
تغليف
الكل في الكل ، على الرغم من عيوبه ، أحببت البرنامج المساعد Visual Link Preview. يعد الإعداد والاستخدام أمرًا غاية في السهولة ، بغض النظر عن المحرر الذي تفضل العمل معه - Gutenberg أو Classic. وهذه بالتأكيد طريقة أكثر جمالية وجذابة لإضافة الروابط ، والتي يمكن أن تذهب بعيدًا إذا كنت منخرطًا في التسويق بالعمولة أو تريد الارتباط بصفحاتك المقصودة. في الوقت الحالي ، نظرًا لأنه لا يمكنك إنشاء أكثر من قالب واحد ، فمن الأفضل لمواقع الويب ذات المظهر القياسي عبر جميع المنشورات والصفحات. لذلك ، إذا كان لديك عدد من الصفحات المقصودة المختلفة في مجموعة متنوعة من الأنماط ، فستجد صعوبة في إنشاء قالب مربع معاينة واحد يناسب أي مكان يتم وضعه فيه. بخلاف ذلك ، هذا مكون إضافي خفيف الوزن يؤدي وظيفته بشكل جيد.
قد تعجبك أيضًا هذه المقالة التي تحتوي على خمسة أشياء رائعة يمكنك القيام بها في Divi باستخدام روابط الربط.
