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

حصريات
فوتوشوب
شروحات
إضافات
قوالب

الصفحة غير موجودة ، 404

الصفحة أو الكلمة التى تبحث عنها غير موجوده على المدونة أو تم حذفها

يمكنك التبليغ عن رابط لا يعمل من هذا الصفحة التبليغ عن رابط لا يعمل

ويمكنك طلب ما تريده من هذه الصفحة الدعم الفنى

أو يمكنك العودة للصفحة الرئيسية أو البحث عن الصفحةو من جديد

العودة للرئيسية

الخميس، 5 مايو، 2016

شريط أخر الأخبار المتحرك الأصدار التانى



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


شرح التركيب


1- قم بالبحث فى قالب مدونتك عن الوسم <head> ثم قم بوضع الكود التالى فوقة (قبلة)

<link href='http://cdn.jsdelivr.net/darfonts/0.1/tv-tha-tye-wide/stylesheet.css' rel='stylesheet'/>

2- قم بالبحث عن الوسم ]]></b:skin> ثم قم بوضع الكود التالى فوقة (قبلة)

.ticker {overflow: hidden;}
.ticker .title {float: right; width: 110px; height: 40px; line-height: 40px; text-align: center; color: #FFFFFF; background: #333333;}
.post-tag{display: inline-block;height: 20px;line-height: 20px;padding: 0px 5px;font-size: 13px;margin-left: 4px;color: #fff !important;font:13px/1.5em tahoma;background-color: #B565BE;}
.ticker .ticker-icon {float: right;margin-right: 10px;}
.ticker .ticker-icon i {margin-left: 10px;display: inline-block;font-size: 13px;}
.ticker .title h6 {text-align: right; line-height: 38px; font-size: 16px; font-weight: bold;   font-family: ge_ss_tvbold !important; color: #fff;  border-left: 1px solid #464646;border-top: 1px solid #464646;width: 115px;}
.ticker .tickercontainer {width: 91.4%;margin: 0;overflow: hidden;float: right;height: 40px;}
.ticker .tickercontainer .mask {position: relative;top: 8px;overflow: hidden;height: 40px;}
.ticker ul.newsticker {position: relative;right: 100px;list-style-type: none;margin: 0;padding: 0;height: 40px;}
.ticker ul.newsticker li {float: right;padding: 2px;height: 32px;margin-left: 15px;line-height: 20px;}
.ticker ul.newsticker a {white-space: nowrap;padding: 0 7px;color: #FFFFFF;font-size: 13px;font-weight:400;font:13px/1.5em tahoma;font-family: ge_ss_tvbold !important;}
a.post-tag {line-height: 21px;}
.newsticker li:nth-child(1) a.post-tag{background-color: #e5192c;}
.newsticker li:nth-child(2) a.post-tag{background-color: #e5192c;}
.newsticker li:nth-child(3) a.post-tag{background-color: #e5192c;}
.newsticker li:nth-child(4) a.post-tag{background-color: #e5192c;}
.newsticker li:nth-child(5) a.post-tag{background-color: #e5192c;}
.newsticker li:nth-child(6) a.post-tag{background-color: #e5192c;}
.newsticker li:nth-child(7) a.post-tag{background-color: #e5192c;}
.newsticker li:nth-child(8) a.post-tag{background-color: #e5192c;}
.newsticker .recent-title{display: inline-block;}
.ticker ul.newsticker span {margin: 0 0 0 10px;}
.ticker ul.newsticker .sep {display: inline-block;width: 6px;height: 7px;margin: 0 40px;}
.ticker-section {width: 95.5%; overflow: hidden;background-color: #333333;border-top: 1px solid #464646;margin-right: 30px;}
.jari { color: #fff; position: relative; right: 5px; }
@media only screen and (max-width:640px){
.ticker .title{display:none}
.ticker .tickercontainer {width: 95%;}}
.fa-globe:before {content: "\f1ea";}

3- قم بالبحث عن الوسم </body> ثم قم بوضع الكود التالى فوقة (قبلة)

<script src='https://googledrive.com/host/0B0LkZloPKBfWSkI0T0R5VkVMQ0U'/>
<script>
  //<![CDATA[
$(".ticker .jari").each(function () {
 var e = $(this).text();
 if (e.match("recent")) {
  $.ajax({
   url: "/feeds/posts/default?alt=json-in-script&max-results=6",
   type: "get",
   dataType: "jsonp",
   success: function (e) {
    var t = "";
    var n = "<ul>";
    for (var r = 0; r < e.feed.entry.length; r++) {
     for (var i = 0; i < e.feed.entry[r].link.length; i++) {
      if (e.feed.entry[r].link[i].rel == "alternate") {
       t = e.feed.entry[r].link[i].href;
       break
      }
     }
     var s = e.feed.entry[r].title.$t;
     var o = e.feed.entry[r].category[0].term;
     n += '<li><a href="/search/label/' + o + '" class="post-tag">' + o + '</a><h3 class="recent-title"><a href="' + t + '">' + s + "</a></h3></li>"
    }
    n += "</ul>";
    $(".ticker .jari").each(function () {
     $(this).html(n);
     $(this).prev("h2").prepend('<i class="fa fa-thumb-tack"></i>');
     $(this).removeClass("widget-content").addClass("layout-content");
     $(this).find("ul").webTicker();
     $("p.trans").each(function () {
      var e = $(this).text();
      var t = $(this).attr("data-tran");
      $("#pages-wrapper *").replaceText(e, t)
     })
    })
   }
  })
 } else {
  $.ajax({
   url: "/feeds/posts/default/-/" + e + "?alt=json-in-script&max-results=10",
   type: "get",
   dataType: "jsonp",
   success: function (e) {
    var t = "";
    var n = "<ul>";
    for (var r = 0; r < e.feed.entry.length; r++) {
     for (var i = 0; i < e.feed.entry[r].link.length; i++) {
      if (e.feed.entry[r].link[i].rel == "alternate") {
       t = e.feed.entry[r].link[i].href;
       break
      }
     }
     var s = e.feed.entry[r].title.$t;
     var o = e.feed.entry[r].category[0].term;
     n += '<li><a href="/search/label/' + o + '" class="post-tag">' + o + '</a><h3 class="recent-title"><a href="' + t + '">' + s + "</a></h3></li>"
    }
    n += "</ul>";
    $(".ticker .jari").each(function () {
     $(this).html(n);
     $(this).prev("h2").prepend('<i class="fa fa-thumb-tack"></i>');
     $(this).removeClass("widget-content").addClass("layout-content");
     $(this).find("ul").webTicker();
     $("p.trans").each(function () {
      var e = $(this).text();
      var t = $(this).attr("data-tran");
      $("#pages-wrapper *").replaceText(e, t)
     })
    })
   }
  })
 }
});
  //]]>
</script>

4- الأن مع الكود الخاص باظهار الشريط يمكنك وضع فى المكان الذى تريد ومن الممكن ان يتم وضعه أسفل القائمة العلوية كما فى المعاينة .

<div class='clear'/>
<div class='ticker ticker-section' id='ticker'>
   <div>
     <div>
<div class='content-wrap container-wrapper '>
  <div class='title second-color-bg '>
        <div class='ticker-icon'> <i class='fa fa-newspaper-o icon'/> </div>
        <h6>أخبار حصرية</h6>
      </div>
  <div class='jari'>
    recent
  </div>
       </div>
</div>
   </div>
 </div>

وهذا كل شئ فى موضوع اليوم اذا واجهتك اى مشكلة فى تركيب الإضافة او تريد التعديل على اى شئ ، فباب التعليقات مفتوح لا تتردد ! وادعمنا بمشاركة التدوينة ليستفيد منها الجميع :)


شارك الموضوع ليستفيد الجميع

مواضيع قد تهمك ايضا

هناك 25 تعليقًا:

اضافة جميل اخي ممكن تركيبها في مدونتي

شكرا لك اخى
تابع الشرح والتركيب سهل اخى

هل يتم إضافة الكود الأخير في التخطيط ؟؟

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

اخي لقد نزلت قالب مدونة المحترف واريد التعديل عليه مثل مدونتك ولكني لا اعرف هل تساعدني

اهلا بك اخى قالب المحترف تصميمه غير تصميم قالب المدونة الخاصه بنا
اطلب ما تريد المرة القادمة فى المكان المخصص له ( ركن الأسئلة )

ولكنه مشابهة لقالبك في بعض الاشياء هل تساعدني في تغيير بعض الاشياء

لا مشكلة اخى ولكن اطلب ما تريد المرة القادمة فى المكان المخصص له ( ركن الأسئلة )

أخي أين يمكن وضع الكود الاخير

أين هي القائمة العلوية في القالب

يمكنك وضع أما اسفل القائمة العلوية أما اسفل القائمة الرئيسية

هل انت لديك قائمةعلوية امالا

أنا عندي قالب المحترف 2017 اخر اصدار اين بالضبط أخي

لدي قالب المحترف الاصدار الاخير اين بالضبط أخي

القائمة العلوية باسم menu-top فى قالب المحترف

القائمة العلوية باسم menu-top فى قالب المحترف

تم تركيب الاكواد بنجاح لكن الشريط يظهر اسود فارغ ’ كيف يمكنني اضافة الاخبار التي اريده انت تمر فيه

ارجو الرد سريع يا اخواني

من الممكن اخى انك قمت بعمل شئ غلط
او ان شريط الأخبار لا يتوافق مع مدونتك

أخي انا لدي الاضافة في الاصل أتت مع القالب ولكن لا يتحرك كلام بها أو أي شئ
رابط المدونة للمعاينة alshabh4download.blogspot.com
اردت أن احذفها واضفها من جديد فقمت بالبحث عن الاكواد التي قمت بوضعها لاحذفها ولكني لم اجدها هل من حل أرجو الرد وشكرا

من الممكن اخى انها تعمل من التخطيط
واذا لم تحل معك المشكلة ارسل لى القالب اقوم بتجربته لانى لم اعمل هلى هذا القالب من قبل

شكرا أخي علي الرد انا قمت بتركيب هذا القالب علي مدونة أخري واشتغل معي ولكن علي هذه المدونة لم يعمل لا أعرف السبب واذا أردتني أن أرسله لك أرجو ان تخبرني بطريقة لارسله لاني لا استطيع ارساله هنا وشكرا لك

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

مرحبا اخي تواجهني مشكل عنده كتابت المدونه ثمه نشره في ايقونة مثلن الاندرويد لا تذهب الا هناك بل تذهب الا الصفحه الرئسيه ممكن الرد اخي

لم افهمك اخى ارجو التوضيح

يسعدنا تفاعلكم بالتعليق ولكن نرجو منكم أن يكون خاص بالموضوع
الأبتساماتأخفاء الأبتسامات

Mohon Aktifkan Javascript!Enable JavaScript

إتصل بنا

الإسم الكريم البريد الإلكتروني مهم الرسالة مهم
جميع الحقوق محفوظة لـ عالم المدون | قوالب بلوجر,اضافات بلوجر, دروس وشروحات بلوجر