كيفية اضافة تغذية ال RSS احترافية للبلوجر

كيفية اضافة تغذية ال RSS احترافية للبلوجر
كيفية اضافة تغذية ال RSS احترافية للبلوجر



ان من اهم ابرز اضافات بلوجر هي اضافة روابط التغذية او ما يعرف بال rss فهي تعطي انطباعا جيدا للزائر فعندما يرى اضافة التغذية في مدونتك و يقوم بتقليب المواضيع التي تجدب انتباهه 
فهذه الاضافة مهمة جدا للسيو فهي تحافظ على بقاء الزائر في مدونتك و كدا تقوم بتخفيض نسبة البونس لمدونتك و بهذا فانك عندما تضيف هذه الاداة او الاضافة فستضمن تخفيض ترتيب موقعك في الكسا و كسب زوار جدد
الاضافة التي ساعرضها اليوم هي اضافة متطورة بالنسبة لسابقاتها في احترافية و جميلة و تناسب جميع المدونات مهما كان تخصصها
في الماضي كان رابط التغدية في المدونة عبارة عن جمل مربوطة بروابط و لكنها لا تفي بالغرض اما الان مع تطور المدونات اصبحت هذه الاضافة اكثر احترافية و جمال

يمكنك رؤية مثال للاضافة من هنا  :        http://les-jeux-pc-gratuit.blogspot.com/


لتركيب الاضافة او الاداة الى مدونتك يجب عليك اولا ان تسجل الدخول الى مدونتك 
ثم تذهب الى     اعدادات القالب >> تحرير ال html 
تبحث عن هذا الرمز ]]></b:skin>  و تضيف قبله مباشرة هذا الكود

.MBL-container-header h1{font-weight:300; font-size:48px; text-align:center;}
 .MBL-container-header h2{font-size:30px; text-align:center;}
     
  #MBLnewsticker1 ul { padding: 0px; }
.MBLnewsticker {
    width: 100%;
    overflow: hidden;
    height: 440px;
    position: relative;
    padding: 0 5px;
    box-sizing: border-box;
    margin: 0 auto;
    text-align:center;
}
.MBLnewsticker>ul {
    padding: 0;
    margin: 0;
    list-style-type: none;
    position: relative;
}
.MBLnewsticker>ul>li {
    display: none;
    width: 100%;
    height: 100px;
    background: #FFF;
    position: absolute;
    overflow: hidden
}
.MBLnewsticker>ul>li>.MBL-content {
    position: absolute;
    top: 0;
    bottom: 30px;
    left: 0;
    right: 0;
    box-sizing: border-box;
    padding: 5%;
    overflow: hidden;
}
.MBLnewsticker>ul>li>.MBL-content a {
    text-decoration: none;
}
.MBLnewsticker>ul>li>.MBL-content a:hover {
    text-decoration: underline;
}
.MBLnewsticker>ul>li>.MBL-info {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 20px;
    padding: 5px;
    border-top: solid 1px #DDD;
}
.MBLnewsticker>ul>li>.MBL-info a {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: #0F0;
    opacity: 0.2;
    cursor: pointer;
}
.MBLnewsticker>ul>li>.MBL-info a:hover {
    opacity: 1;
}
.MBLnewsticker>ul>li>.MBL-info a.MBL-facebook-black {
    background: url(http://4.bp.blogspot.com/-WE0hDxrPTis/VJPDaZrLeLI/AAAAAAAAFQ8/ugZy43TAqa8/s1600/buttons-black.png) 0 0 no-repeat;
    float: left;
    margin-right: 5px;
}
.MBLnewsticker>ul>li>.MBL-info a.MBL-twitter-black {
    background: url(http://4.bp.blogspot.com/-WE0hDxrPTis/VJPDaZrLeLI/AAAAAAAAFQ8/ugZy43TAqa8/s1600/buttons-black.png) -20px 0 no-repeat;
    float: left;
    margin-right: 5px;
}
.MBLnewsticker>ul>li>.MBL-info a.MBL-google-black {
    background: url(http://4.bp.blogspot.com/-WE0hDxrPTis/VJPDaZrLeLI/AAAAAAAAFQ8/ugZy43TAqa8/s1600/buttons-black.png) -40px 0 no-repeat;
    float: left;
}
.MBLnewsticker>ul>li>.MBL-info a.MBL-link-black {
    background: url(http://4.bp.blogspot.com/-WE0hDxrPTis/VJPDaZrLeLI/AAAAAAAAFQ8/ugZy43TAqa8/s1600/buttons-black.png) -60px 0 no-repeat;
    float: right;
}
.MBLnewsticker>ul>li>.MBL-info a.MBL-facebook-white {
    background: url(http://2.bp.blogspot.com/-TiC0VyY5nhk/VJPDlyCRo8I/AAAAAAAAFRE/DpgrjTXsHqA/s1600/buttons-white.png) 0 0 no-repeat;
    float: left;
    margin-right: 5px;
}
.MBLnewsticker>ul>li>.MBL-info a.MBL-twitter-white {
    background: url(http://2.bp.blogspot.com/-TiC0VyY5nhk/VJPDlyCRo8I/AAAAAAAAFRE/DpgrjTXsHqA/s1600/buttons-white.png) -20px 0 no-repeat;
    float: left;
    margin-right: 5px;
}
.MBLnewsticker>ul>li>.MBL-info a.MBL-google-white {
    background: url(http://2.bp.blogspot.com/-TiC0VyY5nhk/VJPDlyCRo8I/AAAAAAAAFRE/DpgrjTXsHqA/s1600/buttons-white.png) -40px 0 no-repeat;
    float: left;
}
.MBLnewsticker>ul>li>.MBL-info a.MBL-link-white {
    background: url(http://2.bp.blogspot.com/-TiC0VyY5nhk/VJPDlyCRo8I/AAAAAAAAFRE/DpgrjTXsHqA/s1600/buttons-white.png) -60px 0 no-repeat;
    float: right;
}
.MBLnewsticker>ul>li>.MBL-info span {
    position: absolute;
    left: 80px;
    right: 30px;
    text-align: center;
    opacity: 0.4;
    z-index: 0;
    font-size: 13px;
    cursor: default;
}
.MBLnewsticker>div {
    width: 50px;
    height: 30px;
    cursor: pointer;
    position: absolute;
    opacity: 0.3;
}
.MBLnewsticker>div:hover {
    opacity: 1;
}
.MBLnewsticker>div.MBL-top-arrow {
    top: 0;
    background: url(http://3.bp.blogspot.com/-lITqIhqOgXc/VJPESRoZK4I/AAAAAAAAFRM/MloiTyBZg8Y/s1600/arrows-black.png) top no-repeat;
}
.MBLnewsticker>div.MBL-bottom-arrow {
    bottom: 0;
    background: url(http://3.bp.blogspot.com/-lITqIhqOgXc/VJPESRoZK4I/AAAAAAAAFRM/MloiTyBZg8Y/s1600/arrows-black.png) bottom no-repeat;
}
.MBLnewsticker .MBL-top0 {
    -ms-transform: scale(0.80);
    -webkit-transform: scale(0.85);
    transform: scale(0.85);
    opacity: 0.85;
    top: 0;
    z-index: 1;
    display: block;
}
.MBLnewsticker .MBL-top1 {
    -ms-transform: scale(0.87);
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
    opacity: 0.9;
    top: 20px;
    z-index: 2;
    display: block;
}
.MBLnewsticker .MBL-top2 {
    -ms-transform: scale(0.95);
    -webkit-transform: scale(0.95);
    transform: scale(0.95);
    opacity: 0.95;
    top: 45px;
    z-index: 3;
    display: block;
}
.MBLnewsticker .MBL-active {
    -ms-transform: scale(1);
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
    top: 75px;
    z-index: 10;
    display: block;
}
.MBLnewsticker .MBL-bottom2 {
    -ms-transform: scale(0.95);
    -webkit-transform: scale(0.95);
    transform: scale(0.95);
    opacity: 0.95;
    top: 105px;
    z-index: 6;
    display: block;
}
.MBLnewsticker .MBL-bottom1 {
    -ms-transform: scale(0.87);
    -webkit-transform: scale(0.90);
    transform: scale(0.90);
    opacity: 0.9;
    top: 130px;
    z-index: 5;
    display: block;
}
.MBLnewsticker .MBL-bottom0 {
    -ms-transform: scale(0.80);
    -webkit-transform: scale(0.85);
    transform: scale(0.85);
    opacity: 0.85;
    top: 150px;
    z-index: 4;
    display: block;
}
.MBL-easing2 {
    transition: .25s linear;
    -moz-transition: .25s linear;
    -webkit-transition: .25s linear;
}
.MBL-easing li {
    transition: .5s ease-out;
    -moz-transition: .5s ease-out;
    -webkit-transition: .5s ease-out;
}
.MBL-radius li {
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
.MBL-radius2 li {
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}
.MBL-shadow li {
    -webkit-box-shadow: 0px 0px 10px 0px rgba(100,100,100,0.3);
    -moz-box-shadow: 0px 0px 10px 0px rgba(100,100,100,0.3);
    box-shadow: 0px 0px 10px 0px rgba(100,100,100,0.3);
}
.MBL-shadow-big {
    -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5) !important;
    -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5) !important;
    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5) !important;
}





ثم تبحث مجددا عن هذا الرمز </head>  و تضيف قبله هذا الكود 

<script type='text/javascript'>
/*<![CDATA[*/
(function(e) {
    $.fn.MBLnewsticker = function(e) {
        var t = {
            width: "100%",
            modulid: "MBLnewsticker",
            autoplay: true,
            timer: 3e3,
            itemheight: 130,
            infobarvisible: true,
            btnfacebook: true,
            btntwitter: true,
            btngoogleplus: true,
            btnlinkbutton: true,
            btnlinktarget: "_blank",
            pagecountvisible: true,
            buttonstyle: "black",
            pagenavi: true,
            pagenavistyle: "black",
            feed: false,
            feedcount: 100
        };

        var e = $.extend(t, e);
        return this.each(function() {
            function o() {
                function o() {
                    $(e.modulid + ">div").css({
                        left: ($(e.modulid).width() - 30) / 2
                    })
                }
                function u() {
                    $(e.modulid + " ul li").eq(r[0]).addClass("MBL-top0");
                    $(e.modulid + " ul li").eq(r[1]).addClass("MBL-top1");
                    $(e.modulid + " ul li").eq(r[2]).addClass("MBL-top2");
                    $(e.modulid + " ul li").eq(r[3]).addClass("MBL-active");
                    $(e.modulid + " ul li").eq(r[4]).addClass("MBL-bottom2");
                    $(e.modulid + " ul li").eq(r[5]).addClass("MBL-bottom1");
                    $(e.modulid + " ul li").eq(r[6]).addClass("MBL-bottom0")
                }
                function a() {
                    t--;
                    if (t < 0) t = n;
                    l()
                }
                function f() {
                    t++;
                    if (t == n + 1) t = 0;
                    l()
                }
                function l() {
                    $(e.modulid + " ul li").attr("class", "");
                    if (t == 0) {
                        r[0] = n - 2;
                        r[1] = n - 1;
                        r[2] = n;
                        r[3] = t;
                        r[4] = t + 1;
                        r[5] = t + 2;
                        r[6] = t + 3
                    } else if (t == 1) {
                        r[0] = n - 1;
                        r[1] = n;
                        r[2] = t - 1;
                        r[3] = t;
                        r[4] = t + 1;
                        r[5] = t + 2;
                        r[6] = t + 3
                    } else if (t == 2) {
                        r[0] = n;
                        r[1] = t - 2;
                        r[2] = t - 1;
                        r[3] = t;
                        r[4] = t + 1;
                        r[5] = t + 2;
                        r[6] = t + 3
                    } else if (t == n) {
                        r[0] = n - 3;
                        r[1] = n - 2;
                        r[2] = n - 1;
                        r[3] = t;
                        r[4] = 0;
                        r[5] = 1;
                        r[6] = 2
                    } else if (t == n - 1) {
                        r[0] = n - 4;
                        r[1] = n - 3;
                        r[2] = n - 2;
                        r[3] = t;
                        r[4] = t + 1;
                        r[5] = 0;
                        r[6] = 1
                    } else if (t == n - 2) {
                        r[0] = n - 5;
                        r[1] = n - 4;
                        r[2] = n - 3;
                        r[3] = t;
                        r[4] = t + 1;
                        r[5] = t + 2;
                        r[6] = 0
                    } else {
                        r[0] = t - 3;
                        r[1] = t - 2;
                        r[2] = t - 1;
                        r[3] = t;
                        r[4] = t + 1;
                        r[5] = t + 2;
                        r[6] = t + 3
                    }
                    u()
                }
                $(e.modulid + " ul li").css({
                    height: e.itemheight,
                    background: e.itembgcolor,
                    border: "solid 1px " + e.bordercolor,
                    color: e.titlecolor,
                    "font-size": e.titlefontsize
                });
                $(e.modulid + " ul li").each(function(t, r) {
                    if (e.infobarvisible) {
                        i = '<div class="MBL-info" style="background:' + e.infobgcolor + "; border-color:" + e.bordercolor + ';">';
                        if (e.btnfacebook) i = i + '<a data-type="facebook" data-url="' + $(this).find(".MBL-content").attr("data-link") + '" data-text="' + $(this).find(".MBL-content").text() + '" class="MBL-easing2 MBL-facebook-' + e.buttonstyle + '"></a>';
                        if (e.btntwitter) i = i + '<a data-type="twitter" data-url="' + $(this).find(".MBL-content").attr("data-link") + '" data-text="' + $(this).find(".MBL-content").text() + '" class="MBL-easing2 MBL-twitter-' + e.buttonstyle + '"></a>';
                        if (e.btngoogleplus) i = i + '<a data-type="google" data-url="' + $(this).find(".MBL-content").attr("data-link") + '" data-text="' + $(this).find(".MBL-content").text() + '" class="MBL-easing2 MBL-google-' + e.buttonstyle + '"></a>';
                        if (e.pagecountvisible) i = i + "<span>" + ($(this).index() + 1) + " / " + (n + 1) + "</span>";
                        if (e.btnlinkbutton) i = i + '<a href="' + $(this).find(".MBL-content").attr("data-link") + '" class="MBL-easing2 MBL-link-' + e.buttonstyle + '" target="' + e.btnlinktarget + '"></a>';
                        i = i + "</div>"
                    }
                    $(this).append(i)
                });
                $(e.modulid + " ul li .MBL-content").find("a").css({
                    color: e.contentlinkcolor
                });
                $(e.modulid + " ul li").find(".MBL-info").find("a").click(function(e) {
                    if ($(this).attr("data-type") == "facebook") {
                        window.open("http://www.facebook.com/sharer.php?u=" + encodeURIComponent($(this).attr("data-url")) + "&t=" + encodeURIComponent($(this).attr("data-text")), "sharer", "toolbar=0,status=0,width=626,height=436");
                        return false
                    } else if ($(this).attr("data-type") == "twitter") {
                        window.open("http://twitter.com/share?text=" + $(this).attr("data-text") + "&url=" + $(this).attr("data-url"), "sharer", "toolbar=0,status=0,width=626,height=436");
                        return false
                    } else if ($(this).attr("data-type") == "google") {
                        window.open("https://plus.google.com/share?url=" + $(this).attr("data-url") + "&title=" + $(this).attr("data-text"), "sharer", "height=550,width=525,left=100,top=100,menubar=0");
                        return false
                    }
                });
                $(e.modulid + " ul li").click(function(e) {
                    t = $(this).index();
                    l()
                });
                if (e.pagenavi) {
                    $(e.modulid).append('<div class="MBL-top-arrow"></div><div class="MBL-bottom-arrow"></div>');
                    $(e.modulid).css({
                        height: e.itemheight + 200,
                        padding: "20px 10px",
                        width: e.width
                    })
                } else {
                    $(e.modulid).css({
                        height: e.itemheight + 160,
                        padding: "0px 10px",
                        width: e.width
                    })
                }
                o();
                $(window).resize(function(e) {
                    o()
                });
                u();
                $(e.modulid + ">div").click(function(e) {
                    if ($(this).attr("class") == "MBL-top-arrow") a();
                    else f()
                });
                if (e.autoplay) {
                    s = setInterval(function() {
                        f()
                    }, e.timer);
                    $(e.modulid).hover(function() {
                        clearInterval(s)
                    }, function() {
                        s = setInterval(function() {
                            f()
                        }, e.timer)
                    })
                }
            }
            function u() {
                $.ajax({
                    type: "GET",
                    url: document.location.protocol + "//ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=" + e.feedcount + "&callback=?&q=" + encodeURIComponent(e.feed),
                    dataType: "json",
                    async: false,
                    success: function(i) {
                        veri = i.responseData.feed.entries;
                        news = "";
                        $(veri).each(function(e, t) {
                            if (e == 0) news = news + '<li class="MBL-active"><div class="MBL-content" data-link="' + veri[e].link + '"><a href="' + veri[e].link + '">' + veri[e].title + "</a></div></li>";
                            else if (e == 1) news = news + '<li class="MBL-bottom2"><div class="MBL-content" data-link="' + veri[e].link + '"><a href="' + veri[e].link + '">' + veri[e].title + "</a></div></li>";
                            else if (e == 2) news = news + '<li class="MBL-bottom1"><div class="MBL-content" data-link="' + veri[e].link + '"><a href="' + veri[e].link + '">' + veri[e].title + "</a></div></li>";
                            else if (e == 3) news = news + '<li class="MBL-bottom0"><div class="MBL-content" data-link="' + veri[e].link + '"><a href="' + veri[e].link + '">' + veri[e].title + "</a></div></li>";
                            else if (e == veri.length - 1) news = news + '<li class="MBL-top2"><div class="MBL-content" data-link="' + veri[e].link + '"><a href="' + veri[e].link + '">' + veri[e].title + "</a></div></li>";
                            else if (e == veri.length - 2) news = news + '<li class="MBL-top1"><div class="MBL-content" data-link="' + veri[e].link + '"><a href="' + veri[e].link + '">' + veri[e].title + "</a></div></li>";
                            else if (e == veri.length - 3) news = news + '<li class="MBL-top0"><div class="MBL-content" data-link="' + veri[e].link + '"><a href="' + veri[e].link + '">' + veri[e].title + "</a></div></li>";
                            else news = news + '<li><div class="MBL-content" data-link="' + veri[e].link + '"><a href="' + veri[e].link + '">' + veri[e].title + "</a></div></li>"
                        });
                        $(e.modulid + " ul").html("");
                        $(e.modulid + " ul").append(news);
                        n = veri.length - 1;
                        r = [n - 2, n - 1, n, t, t + 1, t + 2, t + 3];
                        o()
                    },
                    error: function() {
                        $(e.modulid + " ul").html('<li class="MBL-active"><div class="MBL-content">Error! Please try again later...</div></li>')
                    }
                })
            }
            e.modulid = "#" + $(this).attr("id");
            var t = 0;
            var n = $(e.modulid + " ul li").length - 1;
            var r = [n - 2, n - 1, n, t, t + 1, t + 2, t + 3];
            var i = "";
            var s = e.modulid;
            if (e.feed != false) {
                $(e.modulid + " ul").html("");
                $(e.modulid + " ul").append('<li class="MBL-active"><div class="MBL-content">Rss Feed Loading...</div></li>');
                u()
            } else {
                o()
            }
        })
    }
})(jQuery)
/*]]>*/
</script>



و من بعد ذلك تقوم بحفظ القالب مع التغيرات

و في الاخير تذهب الى اضافة اداة في اعدادات مدونتك و تظيف فيها الكود التالي

<div class="MBLnewsticker MBL-radius MBL-shadow MBL-easing" id="MBLnewsticker1">
<ul> <li>
 <div class="MBL-content" data-link="http://mybloggerlab.com">Powered by MyBloggerLab (Don't remove or Widget will not work).</div>
</li></ul>
 </div>
   
   
<script>
 $(document).ready(function(){
  $("#MBLnewsticker1").MBLnewsticker({
feed:"http://feeds.feedburner.com/motamayizon",
width:"100%",
contentlinkcolor: "#766D6D",
timer:5000,
titlecolor: "#333",
titlefontsize: "16px",
itembgcolor: "#FFF",
contentlinkcolor: "#766D6D",
infobgcolor: "#f2f2f2",
bordercolor: "#DDD"
});
  });
</script>


1) قم بتغيير http://feeds.feedburner.com/motamayizon برابط تغدية مدونتك
2) قم بتغيير 100% اذا كنت تريد تكبير او تضغيير حجم الاضافة
3) قم بتغيير #FFF  لاي لون تريده

 
و بعد حفظ الاداة قم بالاستمتاع بمميزاتها الرائعة و ان وجدت اي استفسار ارجو طرحه و ساجيب عليه باذن الله




commentaires 0

ليست هناك تعليقات على : كيفية اضافة تغذية ال RSS احترافية للبلوجر

أضف تعليق: تذكر قوله تعالى: (( مَا يَلْفِظُ مِنْ قَوْلٍ إِلَّا لَدَيْهِ رَقِيبٌ عَتِيدٌ))