إدراج بانرات عشوائية داخل رسائل المدونة أو القائمة الجانبية

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

إدراج البانرات العشوائية داخل رسائل المدونة

• استعرض “ تحرير القالب “  | أو “ تحرير HTML “ إذا كنت تستخدم لوحة التحكم الإفتراضية |
• ضع علامة صح بجانب الخيار “ توسيع قوالب عناصر واجهة المستخدم  “.
• ابحث عن:

<data:post.body/>

• الصق فوقه مباشرة كود الإضافة:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
    <script type="text/javascript">
    var images= new Array()
    images[0]= "<a href = 'عنوان الرابط الأول'><img src='رابط صورة البانر الأول' alt='النص البديل اختياري'/></a>";
    images[1]= "<a href = 'عنوان الرابط الثاني'><img src='رابط صورة البانر الثاني' alt='النص البديل اختياري'/></a>";
    images[2]= "<a href = 'عنوان الرابط الثالث'><img src='رابط صورة البانر الثالث' alt='النص البديل اختياري'/></a>";
    images[3]= "<a href = 'عنوان الرابط الرابع'><img src='رابط صورة البانر الرابع' alt='النص البديل اختياري'/></a>";
    var random=Math.floor(4*Math.random());
    document.write(images[random]);
    </script>
    </b:if>

• الآن! احفظ وجرب.

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

إدراج البانرات العشوائية في القائمة الجانبية

• توجه إلى “ تخطيط “
• ثم في الموضع المطلوب أضف أداة HTML/JavaScript.
• الصق فيها هذا الكود:

<style>
    #banner img { max-width:95%;} /* لمنع انسياب الصور */
    </style>
    <div id="banner">
    <script type="text/javascript">
    var images= new Array()
    images[0]= "<a href = 'عنوان الرابط الأول'><img src='رابط صورة البانر الأول' alt='النص البديل اختياري'/></a>";
    images[1]= "<a href = 'عنوان الرابط الثاني'><img src='رابط صورة البانر الثاني' alt='النص البديل اختياري'/></a>";
    images[2]= "<a href = 'عنوان الرابط الثالث'><img src='رابط صورة البانر الثالث' alt='النص البديل اختياري'/></a>";
    images[3]= "<a href = 'عنوان الرابط الرابع'><img src='رابط صورة البانر الرابع' alt='النص البديل اختياري'/></a>";
    var random=Math.floor(4*Math.random());
    document.write(images[random]);
    </script>
    </div>

• احفظ وجرب!

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

تحياتي  

المصدر : مدونة البلوقر