صفحة 1 من 4 123 ... الأخيرةالأخيرة
النتائج 1 إلى 10 من 33
  1. تكبير الخط تصغير الخط
    بتاريخ : 10-02-2019 الساعة : 09:51 PM رقم #1

    افتراضي أضف الصور المتحركة إلى موقعك على طريقة الفيس بوك



    نائب المدير العام


    الصورة الرمزية نسائم الرحمن

    • بيانات نسائم الرحمن
      رقم العضوية : 6009
      عضو منذ : Jan 2012
      المشاركات : 5,178
      بمعدل : 1.16 يوميا
      معدل تقييم المستوى : 64
      التقييم : Array



  2. أضف الصور المتحركة إلى موقعك على طريقة الفيس بوك

    بسم الله الرحمن الرحيم

    والصلاة والسلام على أشرف المرسلين

    سيدنا محمد وعلى آله وصحبه أجمعين

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




    طريقة نشر الصور المتحركة GIF على موقعك بخاصية Click to preview

    أولًا: إستخدمت فى هذه التدوينة إضافة مفتوحة المصدر jqGifPreview للإستفادة من ميزة Click to preview إضغط هنا للمعاينة

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

    ثالثًا: إذا كنت تستخدم الصور المتحركة فى معظم موضوعات موقعك إتبع الخطوات:

    1. إذهب إلى لوحة تحكم بلوجر ثم تبويب قالب ( قم بالإحتفاظ بنسخة إحتياطية من القالب).

    2. إبحث عن الكود التالى بإستخدام لوحة المفاتيح Ctrl+F

    </head>

    3. ثم أنسخ الكود التالى وقم بإضافته فوق الكود السابق مباشرة

    <!--www.condaianllkhir.com-->
    <****** src="https://code.jquery.com/jquery-1.12.0.min.js"></******>
    <link href="https://cdn.rawgit.com/DrRO/jqGifPreview/46d8d1dd/jqGifPreview/jqGifPreview.css" rel="stylesheet"></link>
    <****** src="https://cdn.rawgit.com/DrRO/jqGifPreview/46d8d1dd/jqGifPreview/jqGifPreview.js"></******>

    4. ثم إحفظ القالب

    5. توجه إلى تبويب HTML للتدوينة وقم بإضافة الكود التالى:

    <img class="myImg" src="sample_first_frame.png" data-gif="sample_giphy.gif" />
    **********
    $(function() {
    $(".myImg").jqGifPreview();
    });
    </******>

    ملاحظات :

    إذا كان لديك مكتبة JQuery بالقالب ، فلا داعى لإضافة السطر الأزرق بالكود .

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




    منقول

    يمكنك مشاهدة توقيعي بالنقر على زر التوقيع

    نسائم الرحمن غير متواجد حالياً
    • توقيع نسائم الرحمن






  3. رد مع اقتباس
  4. تكبير الخط تصغير الخط
    بتاريخ : 11-02-2019 الساعة : 12:42 PM رقم #2
    كاتب الموضوع : نسائم الرحمن


    شاملى فضى


    • بيانات yassin
      رقم العضوية : 95
      عضو منذ : Jul 2008
      المشاركات : 547
      بمعدل : 0.10 يوميا
      معدل تقييم المستوى : 21
      التقييم : Array


  5. بارك الله فيكم

    yassin غير متواجد حالياً
    رد مع اقتباس
  6. تكبير الخط تصغير الخط
    بتاريخ : 13-02-2019 الساعة : 05:36 PM رقم #3
    كاتب الموضوع : نسائم الرحمن


    شاملى ماسى


    الصورة الرمزية ثريا حامد

    • بيانات ثريا حامد
      رقم العضوية : 6111
      عضو منذ : Feb 2012
      المشاركات : 1,240
      بمعدل : 0.28 يوميا
      معدل تقييم المستوى : 25
      التقييم : Array


  7. شكرا على الموضوع والافادات القيمة

    ثريا حامد غير متواجد حالياً
    رد مع اقتباس
  8. تكبير الخط تصغير الخط
    بتاريخ : 14-02-2019 الساعة : 10:21 AM رقم #4
    كاتب الموضوع : نسائم الرحمن


    شاملى ماسى


    الصورة الرمزية زرقاء اليمامة

    • بيانات زرقاء اليمامة
      رقم العضوية : 31918
      عضو منذ : Jun 2015
      المشاركات : 1,005
      بمعدل : 0.31 يوميا
      معدل تقييم المستوى : 19
      التقييم : Array


  9. شكرا على الموضوع والافادات القيمة

    زرقاء اليمامة غير متواجد حالياً
    رد مع اقتباس
  10. تكبير الخط تصغير الخط
    بتاريخ : 15-02-2019 الساعة : 04:56 PM رقم #5
    كاتب الموضوع : نسائم الرحمن


    شاملى مميز


    • بيانات ابو زيد الراوى
      رقم العضوية : 32040
      عضو منذ : Aug 2015
      المشاركات : 136
      بمعدل : 0.04 يوميا
      معدل تقييم المستوى : 10
      التقييم : Array


  11. مشكوووووووورة الاخت الفاضلة نسائم

    ابو زيد الراوى غير متواجد حالياً
    رد مع اقتباس
  12. تكبير الخط تصغير الخط
    بتاريخ : 16-02-2019 الساعة : 01:59 PM رقم #6
    كاتب الموضوع : نسائم الرحمن


    شاملى مميز


    الصورة الرمزية الدمشقي

    • بيانات الدمشقي
      رقم العضوية : 33087
      عضو منذ : Feb 2019
      المشاركات : 166
      بمعدل : 0.09 يوميا
      معدل تقييم المستوى : 7
      التقييم : Array


  13. بارك الله فيكم ونفع بكم

    الدمشقي غير متواجد حالياً
    رد مع اقتباس
  14. تكبير الخط تصغير الخط
    بتاريخ : 17-02-2019 الساعة : 02:24 PM رقم #7
    كاتب الموضوع : نسائم الرحمن


    شاملى فضى


    • بيانات مروى السرحاني
      رقم العضوية : 32969
      عضو منذ : Feb 2018
      المشاركات : 358
      بمعدل : 0.16 يوميا
      معدل تقييم المستوى : 10
      التقييم : Array


  15. شكرا على المعلومات والافادة

    مروى السرحاني غير متواجد حالياً
    رد مع اقتباس
  16. تكبير الخط تصغير الخط
    بتاريخ : 18-02-2019 الساعة : 07:56 PM رقم #8
    كاتب الموضوع : نسائم الرحمن


    مراقب


    الصورة الرمزية جيهان

    • بيانات جيهان
      رقم العضوية : 39
      عضو منذ : Jul 2008
      المشاركات : 3,361
      بمعدل : 0.59 يوميا
      معدل تقييم المستوى : 49
      التقييم : Array


  17. مشكورة بارك الله فيك

    جيهان غير متواجد حالياً
    رد مع اقتباس
  18. تكبير الخط تصغير الخط
    بتاريخ : 21-02-2019 الساعة : 08:40 PM رقم #9
    كاتب الموضوع : نسائم الرحمن


    شاملى ذهبى


    الصورة الرمزية زين العسيرى

    • بيانات زين العسيرى
      رقم العضوية : 131
      عضو منذ : Aug 2008
      المشاركات : 722
      بمعدل : 0.13 يوميا
      معدل تقييم المستوى : 23
      التقييم : Array


  19. بارك الله فيكم ونفع بكم

    زين العسيرى غير متواجد حالياً
    رد مع اقتباس
  20. تكبير الخط تصغير الخط
    بتاريخ : 22-02-2019 الساعة : 03:39 PM رقم #10
    كاتب الموضوع : نسائم الرحمن


    شاملى ذهبى


    الصورة الرمزية سلسبيل

    • بيانات سلسبيل
      رقم العضوية : 32460
      عضو منذ : Jul 2016
      المشاركات : 923
      بمعدل : 0.33 يوميا
      معدل تقييم المستوى : 17
      التقييم : Array


  21. شكرا وجزاكم الله كل خير على المواضيع القيمة

    سلسبيل غير متواجد حالياً
    رد مع اقتباس



معلومات الموضوع

الأعضاء الذين يشاهدون هذا الموضوع

الذين يشاهدون الموضوع الآن: 1 (0 من الأعضاء و 1 زائر)

     

المفضلات

المفضلات

ضوابط المشاركة

  • لا تستطيع إضافة مواضيع جديدة
  • لا تستطيع الرد على المواضيع
  • لا تستطيع إرفاق ملفات
  • لا تستطيع تعديل مشاركاتك