كيفية تضمين كتاب تفاعلي في WordPress

لماذا تضمّن كتابًا تفاعليًا على موقع WordPress؟

لا تنصف ملفات PDF الثابتة المدفونة خلف روابط التنزيل المحتوى الذي تقدمه. ينقر الزوار، وينتظرون تنزيل الملف، ويفتحونه في تطبيق منفصل، و— في أغلب الأحيان — لا يعودون إلى موقعك أبدًا. تضمين كتاب تفاعلي مباشرة على صفحة WordPress يغيّر اللعبة تمامًا.

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

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

إذا كنت جديدًا على تحويل ملفات PDF إلى كتب تفاعلية، فابدأ بدليلنا حول كيفية تحويل PDF إلى كتاب تفاعلي عبر الإنترنت أولًا، ثم عُد إلى هنا لتضمينه.

الحصول على كود التضمين من FlipLink

قبل أن تلمس WordPress، تحتاج إلى كود التضمين. إليك كيفية الحصول عليه:

1. سجّل الدخول إلى لوحة تحكم FlipLink على go.fliplink.me
2. افتح الكتاب التفاعلي الذي تريد تضمينه
3. اضغط زر مشاركة (Share)
4. حدّد تبويب تضمين (Embed)
5. انسخ كود iframe المعروض

سيبدو كود التضمين الخاص بك على هذا النحو:

<iframe
  src="https://go.fliplink.me/view/your-flipbook-id"
  width="100%"
  height="600"
  frameborder="0"
  allowfullscreen
></iframe>

هذا كل ما تحتاجه. يتولى FlipLink جانب المشاركة والتوزيع — ومهمتك ببساطة هي لصق هذا الكود في WordPress.

الطريقة ١: محرر القوالب في WordPress (Gutenberg)

محرر القوالب هو المحرر الافتراضي في WordPress، وهو أبسط طريقة لتضمين كتابك التفاعلي.

خطوة بخطوة

1. افتح الصفحة أو المنشور الذي تريد وضع الكتاب التفاعلي فيه
2. اضغط زر + لإضافة قالب جديد
3. ابحث عن HTML المخصص (Custom HTML) وحدّده
4. الصق كود iframe من FlipLink داخل القالب
5. اضغط معاينة (Preview) للتحقق من ظهوره بشكل صحيح
6. اضغط نشر (Publish) أو تحديث (Update)

هذا كل شيء. سيُعرض الكتاب التفاعلي مباشرة على صفحتك بكامل تفاعليته — تقليب الصفحات، والتكبير، وملء الشاشة، وكل شيء.

نصيحة احترافية

إذا أردت توسيط الكتاب التفاعلي مع بعض المساحة المريحة، لُفّه داخل div:

<div style="max-width: 900px; margin: 0 auto; padding: 20px 0;">
  <iframe
    src="https://go.fliplink.me/view/your-flipbook-id"
    width="100%"
    height="600"
    frameborder="0"
    allowfullscreen
  ></iframe>
</div>

الطريقة ٢: Elementor

يُعدّ Elementor من أشهر منشئي صفحات WordPress، ولا يستغرق تضمين كتاب تفاعلي فيه سوى نقرات قليلة.

خطوة بخطوة

1. افتح الصفحة في محرر Elementor المرئي
2. ابحث في لوحة الودجات عن HTML
3. اسحب ودجت HTML إلى القسم المطلوب
4. الصق كود iframe من FlipLink في حقل HTML
5. عدّل الهامش والحشو للودجت من تبويب متقدم (Advanced)
6. اضغط تحديث (Update) للحفظ

يُظهر Elementor الـ iframe مباشرة في المحرر، فترى تمامًا كيف سيبدو كتابك التفاعلي قبل النشر. استخدم عناصر التحكم المتجاوبة في Elementor لضبط الارتفاع لنقاط تكسير الجهاز اللوحي والهاتف عند الحاجة.

الطريقة ٣: المحرر الكلاسيكي

ما زلت تستخدم المحرر الكلاسيكي؟ لا مشكلة. العملية بنفس البساطة.

خطوة بخطوة

1. افتح صفحتك أو منشورك في المحرر الكلاسيكي
2. انتقل إلى تبويب نص (Text) (وليس مرئي) في شريط أدوات المحرر
3. ضع المؤشر في المكان الذي تريد ظهور الكتاب التفاعلي فيه
4. الصق كود iframe الخاص بالتضمين
5. عُد إلى تبويب مرئي (Visual) للتأكد من ظهوره
6. اضغط نشر (Publish) أو تحديث (Update)

مهم: الصق دائمًا أكواد التضمين في تبويب نص (Text). فقد يُجرّد التبويب المرئي كود HTML أو يعدّله، مما قد يكسر التضمين.

نصائح للأحجام المتجاوبة

ينبغي أن يبدو كتابك التفاعلي رائعًا على كل جهاز. إليك بعض النصائح العملية للتضمين المتجاوب.

استخدم العرض بالنسبة المئوية

اضبط دائمًا width="100%" على الـ iframe بحيث يملأ الحاوية. يضمن هذا أن يتكيّف الكتاب التفاعلي مع أي حجم شاشة تلقائيًا.

اضبط ارتفاعًا منطقيًا

ارتفاع ثابت بالبكسل بين 500 و700 يعمل جيدًا لمعظم الكتب التفاعلية على سطح المكتب. للحصول على نهج أكثر تجاوبًا، استخدم خدعة نسبة العرض إلى الارتفاع:

<div style="position: relative; width: 100%; padding-bottom: 75%; height: 0; overflow: hidden;">
  <iframe
    src="https://go.fliplink.me/view/your-flipbook-id"
    style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;"
    frameborder="0"
    allowfullscreen
  ></iframe>
</div>

يحافظ هذا على نسبة عرض إلى ارتفاع ٤:٣ بصرف النظر عن عرض الشاشة. عدّل padding-bottom لتغيير النسبة — استخدم 56.25% لنسبة ١٦:٩ أو 100% لشكل مربع.

اختبر على الهاتف

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

استخدام التضمين بصورة قابلة للنقر كبديل

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

بدلًا من iframe، تحصل على صورة برابط. هذا مثالي لـ:

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

يمكنك الحصول على كود التضمين بصورة قابلة للنقر من نفس مربع المشاركة في لوحة تحكم FlipLink. يُحمَّل أسرع من iframe ويمنحك تحكمًا كاملًا في مظهر الصورة المصغّرة من خلال خيارات العلامة التجارية والتصميم في FlipLink.

استكشاف المشكلات الشائعة وإصلاحها

الكتاب التفاعلي لا يظهر

• تأكد من لصق الكود في وضع نص/HTML، وليس المحرر المرئي
• تحقق من أن قالب WordPress لا يجرّد الـ iframe (بعض إضافات الحماية تحجبها)
• تحقق من أن الكتاب التفاعلي منشور وليس في وضع المسودة داخل FlipLink

الكتاب التفاعلي صغير جدًا أو كبير جدًا

• عدّل قيمة height في كود iframe
• استخدم حاوية div المتجاوبة المعروضة أعلاه لحجم متّسق
• تحقق مما إذا كانت منطقة المحتوى في قالبك تحتوي على max-width يقيّد التضمين

الكتاب التفاعلي يعمل على سطح المكتب لكن ليس على الهاتف

• تأكد من ضبط width="100%" (وليس عرضًا ثابتًا بالبكسل)
• تحقق من وجود overflow: hidden في عناصر CSS الأبوية التي قد تقصّ الـ iframe
• يتعامل عارض FlipLink مع إيماءات الهاتف بشكل أصلي، فالمشكلة دائمًا تقريبًا في تخطيط الصفحة

WordPress يحذف كود التضمين

قد تقوم بعض إضافات الحماية (مثل Wordfence أو iThemes Security) أو إعدادات القوالب بترشيح وسوم iframe. إذا اختفى كود التضمين بعد الحفظ:

• تحقق من إعدادات إضافة الحماية لقواعد ترشيح iframe
• أضف go.fliplink.me إلى مصادر iframe المسموح بها
• جرّب استخدام قالب HTML مخصص بدلًا من اللصق المضمَّن

اعتبارات SEO

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

للاطلاع بعمق أكبر على خيارات التضمين خارج WordPress، راجع دليلنا الكامل حول كيفية تضمين PDF على موقع إلكتروني.

ابدأ بتضمين كتبك التفاعلية على WordPress اليوم

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

هل أنت مستعد للبدء؟ أنشئ حسابك المجاني في FlipLink وحوّل أول ملف PDF لك إلى كتاب تفاعلي قابل للتضمين. مع صفقة FlipLink مدى الحياة التي تبدأ من $١٢٩ مقابل ١٠٠ إصدار نشط، تحصل على تضمين غير محدود عبر جميع صفحات WordPress الخاصة بك وما بعدها.

اطّلع على صفحة الأسعار للعثور على الخطة المناسبة لاحتياجاتك.