إضافة كود اداة"اقرأ أيضا" لمدونتك على بلوجر

 

إضافة كود اداة"اقرأ أيضا" لمدونتك على بلوجر


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

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

يتميز سكريبت "اقرأ أيضا" بسرعته في التحميل، حيث يعتمد على JavaScript مباشرة دون الحاجة إلى انتظار تحميل Jquery، ويستخدم مجموعة من الخوارزميات لتفادي تكرار المواضيع التي ستعرض على الأداة.

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

لتركيب هذه الأداة على مدونتك على بلوجر، يجب أولاً إضافة CSS و JavaScript إلى القالب. يمكنك القيام بذلك عن طريق البحث عن "</head>" وإضافة الكود التالي فوقها:


<b:if cond='data:blog.pageType != "index"'>

<style>

.readtoo{

direction:rtl;

text-align:right;

width:auto;

height:auto;

font-size:15px;

margin:10px 0;

padding:5px;

display:block;

border:solid 2px #ddd;

border-radius:3px;

border-right:solid 2px rgb(0,0,180);

padding-right:0;

font-weight:bolder

}

.titleofrt{

background-color:rgb(0,0,204);

color:#fff;

padding:0 3px;

border-radius:3px 0 0 0;

font-size:1.2em

}

.urlreadtoo{

padding:3px

}

.urlreadtoo a{

display:block;

text-decoration:none;

color:rgb(0,50,70)

}

.urlreadtoo a:hover{

color:blue

}

.urlreadtoo a:before{

content:"*";

padding:0 3px;

vertical-align:middle;

display:inline-block;

margin:2px 0 0 0;

color:rgb(0,0,209)

}

</style>

</b:if>


ثم يتم إضافة الكود التالي فوق "</body>":


<b:if cond='data:blog.pageType != "index"'>

<script>

//<![CDATA[

var numofposts = 5;

function readtooevent(e) {

    var cft = document.getElementsByClassName("readtoo").length;

    for (let t = 0; t < cft; t++) {

        var puu=[];

        varcurrentposturl = document.getElementsByClassName("urlreadtoo")[t].getElementsByTagName("a")[0].href;

        var allposts = document.getElementsByClassName("entry-title");

        for (let i = 0; i < allposts.length; i++) {

            if (puu.length == numofposts) {

                break;

            }

            if (allposts[i].getElementsByTagName("a")[0].href != currentposturl) {

                puu.push(allposts[i]);

            }

        }

        var readtooblock = document.getElementsByClassName("readtoo")[t];

        for (let i = 0; i < puu.length; i++) {

            var newpost = document.createElement("div");

            newpost.innerHTML = '<div class="titleofrt">' + puu[i].getElementsByTagName("a")[0].innerHTML + '</div><div class="urlreadtoo"><a href="' + puu[i].getElementsByTagName("a")[0].href + '">' + puu[i].getElementsByTagName("a")[0].href + '</a></div>';

            readtooblock.appendChild(newpost);

        }

    }

}

document.addEventListener("DOMContentLoaded", readtooevent);

//]]>

</script>

</b:if>


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

 يمكنك تعديل عدد المواضيع التي تعرضها الأداة عن طريق تغيير قيمة المتغير "numofposts" في الكود الذي تم إضافته إلى القالب.

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

إرسال تعليق

أحدث أقدم