التخطي إلى المحتوى الرئيسي

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

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

و ألصق الكود الاتي قبله تماما
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<style type='text/css'>
#beakingnews{width:980px;margin:0 auto;line-height:37px;;overflow:hidden; margin-bottom: 20px; max-height: 37px; overflow: hidden;
background: #fff;
-moz-box-shadow: 0 1px 1px rgba(255, 255, 255, 0.3) inset, 0 -1px 1px rgba(0, 0, 0, 0.3) inset;
-webkit-box-shadow: 0 1px 1px rgba(255, 255, 255, 0.3) inset, 0 -1px 1px rgba(0, 0, 0, 0.3) inset;
box-shadow: 0 1px 1px rgba(255, 255, 255, 0.3) inset, 0 -1px 1px rgba(0, 0, 0, 0.3) inset;
background-clip: padding-box;border-left: none;max-height: 37px;}
#beakingnews .tulisbreaking{display:block;float:right;padding:0 7px;;color:#FCFCFC;background:#21b8ff;
-moz-box-shadow: 0 1px 1px rgba(255, 255, 255, 0.3) inset, 0 -1px 1px rgba(0, 0, 0, 0.3) inset;
-webkit-box-shadow: 0 1px 1px rgba(255, 255, 255, 0.3) inset, 0 -1px 1px rgba(0, 0, 0, 0.3) inset;
box-shadow: 0 1px 1px rgba(255, 255, 255, 0.3) inset, 0 -1px 1px rgba(0, 0, 0, 0.3) inset;
color: #FFF;font-family:GE SS Two Medium,droidkufi-bold;font-size: 14px;
line-height: 37px;padding-right: 10px;padding-left: 10px;font-weight: normal;
text-transform: uppercase;}
#recentpostbreaking{float:right;padding-right: 15px;}
#recentpostbreaking ul,#recentpostbreaking li{list-style:none;margin:0;padding:0}
#recentpostbreaking li a{color:#333; font-family:GE SS Two Medium,droidkufi-bold;font-size:14px;}
</style></b:if></b:if>



هدا الشريط لونه أزرق لكن ان أردت تغيير اللون
#21b8ff ابحث عن هدا لكود
و هو يعتبر لون بلغة برمجة المواقع لهدا عليك الدهاب الى هدا الموقع
و اختيار اللون الدي تريده و أخد الكود الخاص به و تغيير الكود السابق
بعد اختيار اللون الدي يعجبك أو ترك اللون كما هو
سنضع الشريط تحت الهيدر لأنه أنسب مكان له
سوف نقوم بالبحث عن الكود التالي
<div class='main-outer'>
ونلصق الكود التالي قبله تماما  فوقه
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div id='beakingnews'><span class='tulisbreaking'>أحدث الأخبار</span><!-- tag pembuka tempat Breaking News-->
<div id='recentpostbreaking'>Loading...</div><!-- tag tempat daftar Breaking News ditampilkan-->
</div><!-- tag penutup tempat Breaking News-->
<script type='text/javascript'>
//<![CDATA[
$(document).ready(function () {
var url_blog = 'http://www.dzprofessionale.blogspot.com/', // alamat blogmu contoh http://mkr-site.blogspot.com
numpostx     = 10; // Jumlah artikel yang di tampilkan
$.ajax({
url: '' + url_blog + '/feeds/posts/default?alt=json-in-script&max-results=' + numpostx + '',    type: 'get',    dataType: "jsonp", success: function(data) {        var posturl, posttitle, skeleton = '', entry = data.feed.entry; if (entry !== undefined) {skeleton = "<ul>";for (var i = 0; i < entry.length; i++) { for (var j=0; j < entry[i].link.length; j++)  { if (entry[i].link[j].rel == "alternate"){ posturl = entry[i].link[j].href;  break;  }              }             
posttitle = entry[i].title.$t;
skeleton += '<li><a href="' + posturl + '" target="_blank">' + posttitle + '</a></li>';
        }
skeleton += '</ul>';
$('#recentpostbreaking').html(skeleton);
// kode untuk efek pada breaking news
function tick(){
$('#recentpostbreaking li:first').slideUp( function () { $(this).appendTo($('#recentpostbreaking ul')).slideDown(); }); }
setInterval(function(){ tick () }, 5000); } else {
$('#recentpostbreaking').html('<span>No result!</span>');
        }  }, error: function() {
$('#recentpostbreaking').html('<strong>Error Loading Feed!</strong>');
       } }); });
//]]>
</script>
</b:if></b:if>
مع تغيير
http://www.dzprofessionale.blogspot.com/
برابط موقعك

تعليقات

  1. شكرا على الاضافة الرائعة

    ردحذف
  2. مبروك عليك قم اضافات بلوجر الجديد

    ردحذف
  3. شكرآآآ لك بالتوفيق انشاء الله

    ردحذف
  4. تم الاضافة ولكن لم يعطي معلومات سو Loading...

    ردحذف
    الردود
    1. الاضافة تعمل أخي ربما الربط غلط أو جرب اضافة موضوع جديد

      حذف
  5. الشكر لك
    شرفني بالزيارة
    http://www.fmed.bu.edu.eg
    http://www.fmed.bu.edu.eg/fmed/index.php/studentsunion

    ردحذف

إرسال تعليق

المشاركات الشائعة من هذه المدونة

طرق فعالة لتسريع التحميل ببرنامج التورنت "حصرية"

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



اختيار تورنت سريع للتحميل

الخطوة الاولي والاهم هي اختيار تورنت سريع ، والتورنت السريع هو ما يكون به Seeders او Leechers اكبر من الـ Peers ، فكلما زاد العدد كان افضل واسرع. فالـ Seeders هم الاشخاص الذين قاموا بتحميل الملف ويقومون بمساعدة الاخرين من خلال جهازهم للتحميل ، والـ Peers هم الاشخاص الذين يقومون بتحميل الملف الان. لذلك فحاول دائما اختيار ملف يحتوي علي Seeders اكبر من الـ Peers ، او علي الاقل بنسبة اكبر ، فتورنت يحتوي علي 30 Seeders و 70 Peers يعتبر افضل من تورنت يحتوي علي 100  و 700 Peers ، فحاول أن تكون النسبة عالية حتي يكون التورنت سريع.

السماح لبرنامج التورنت من خلال الجدار الناري
الجدار الناري هو جدار الحماية علي جهازك لحماية جهازك من الاختراق حيث يشكل جدار للاتصالات الواردة بجهازك والصادرة من جهازك. وبما أن برنامج التورنت يق…

دورة مطوري بلوجر في العالم العربي { ج2 }

أول مرة في العالم العربي . . . دورة مطوري بلوجر , أكواد البلوجر , الأكواد التي تحتاجها لتبدأ بتصميم قالبك من الصفر بكل التخصيصات و تطوير القالب على منصة البلوجر . . . دورة طويلة ستتعلم فيها كل ما يوجد من أكواد في منصة البلوجر
اليوم سنقدم لك كل المكتبات التي تحتاجها المكتبات المرفوعة على جوجل ( juqery ,Dojo .... etc ) 
Jquery <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Angular
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.4/angular.min.js"></script>Dojo <script src="//ajax.googleapis.com/ajax/libs/dojo/1.10.2/dojo/dojo.js"></script>Ext Core <script src="//ajax.googleapis.com/ajax/libs/ext-core/3.1.0/ext-core.js"></script>Jquery.ui <link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css" /><script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.j…

حماية الروابط بكلمة سر ( الدخول لرابط من موقعك بكلمة سر )

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



الاضافة سهلة فقط غيير ما باللون الأحمر و قم بنسخ الكود و لصقه في المشاركة في تبويب HTML في المكان الذي تريده
<script> function passWord() { var testV = 1; var pass1 = prompt('يرجى ادخال الرقم السري',' '); while (testV < 3) { if (!pass1)  history.go(-1); if (pass1.toLowerCase() == "كلمة السر هنا") { alert('تم قبول الرقم السري'); window.open('http://الرابط هنا'); break; }  testV+=1; var pass1 =  prompt('لا يمكن دخولك - الرقم السري خاطئ, يرجى إعادة المحاولة','ادخل هنا الرقم السري'); } if (pass1.toLowerCase()!="password" & testV ==3)  history.go(-1); return " "; }…