كلمة الفريق

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

كيفية تغيير صورة التعليق مجهول لمدونات بلوجر



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


لــن أطــوّل عـلـيــك ونــمـرّ مـبــاشـرة إلـى الــشـرح (سأضع طريقتان مختلفتان ...) :


مراحل تركيب الإضافة
  1. أدخل إلى لوحة تحكم المدونة في بلوجر.
  2. إختر قالب المدونة التي تود تطبيق الشرح فيها.
  3. إضغط على تحرير HTML ( قم بأخد نسخة إحتياطية للقالب ).
  4. إبحث عن الوسم </body> و أضف أحد الطريقتين فوقه :

الطريقة الأولى


بعد بحثك للوسم المذكور أعلاه، وكما أشرت ستضع الكود التالي فوقه مباشرة :
<script>
var oldSrc = '//lh3.googleusercontent.com/zFdxGE77vvD2w5xHy6jkVuElKv-U9_9qLkRYK8OnbDeJPtjSZ82UPq5w6hJ-SA=s35';
var newSrc = 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzRo6B9r4Lw7bvBqA_xFRvO8HHIZTAdDglaiiJD3zBwUxE7PUjXdqvgC8vdFrUxG8WL9jVeXsVAU74XpLE7Ni3uJXkzx9a7Q6V7vAEKPxk9dRi99KbQ2OED23N6WiJqlar8lrOA4eoc3A/s1600/blank-user-avatar.png';
$('img[src="' + oldSrc + '"]').attr('src', newSrc);
</script>

الطريقة الثانية


إليك الكود الخاص بالطريقة الثانية، مع اتباع نفس مراحل الطريقة السابقة :
<script>
  setTimeout(b4teq_loadnewimg, 10000)
  function b4teq_loadnewimg()
  {
    var imgs = document.getElementsByTagName("img");
    var oldSrc = 'lh3.googleusercontent.com/zFdxGE77vvD2w5xHy6jkVuElKv-U9_9qLkRYK8OnbDeJPtjSZ82UPq5w6hJ-SA';
    var newSrc = '3.bp.blogspot.com/-UNjtW9_9fcs/VrvrBJi_8CI/AAAAAAAABP4/jjFMkoCi6Ig/s1600/blank-user-avatar.png';
    for (var i = 0; i &lt; imgs.length; i++) {
      if (imgs[i].src.indexOf(oldSrc) > -1){
        imgs[i].setAttribute('src', newSrc);
      }
  }}
</script>

الآن نأتي لشرح الأكواد :

ملاحظات وتفسيرات:
  • المتغيران oldSrc و newSrc يتعلقان بالصور، فالأولى وكما هو واضح عن إسمها فهي خاصة بالصورة القديمة (الإفتراضية لبلوجر) المراد تغييرها، أما المتغير الثاني فهو للصور الجديدة التي تريدها أن تضهر مكان الصورة السابقة.
  • ستجد في السطر الثاني العدد 10000 (أي عشر ثوان) والذي هو الوقت المنتضر لبذأ تنفيد عملية تغيير الصور.
  • المتغير imgs (الموجود في الطريقة الثانية) دوره جلب جميع الصور الموجودة بالمودنة.
  • ثم تأتي عملية فرز الصور (الوسم img) عن طريق التحقق من إسم الصورة  (if...) والذي هو oldSrv

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

هناك 3 تعليقات:

يمكنك وضع تعليقك هنا

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