حصريات
أضافة معلومات عن التدوينة في السايد بار لقوالب بلوجر

أضافة معلومات عن التدوينة في السايد بار لقوالب بلوجر

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


شرح طريقة التركيب
ادخل للمدونة » القالب » تحرير html » إبحث عن </body>
» ثم ضف الكود التالى فوقها

الكود

<script>
$(document).ready(function(){
        $("div.post-info2").replaceWith($("div.post-info"));
        $("div.blo1web-links2").replaceWith($("div.blo1web-links"));
});
</script>
<script src='https://cdn.firebase.com/v0/firebase.js' type='text/javascript'></script>
<script>
$.each($('a[name]'), function(i, e) {
 var elem = $(e).parent().find('#postviews,#blo1webviews').addClass('mbtloading');
 var blogStats = new Firebase("https://blo1web.firebaseio.com/pages/id/" + $(e).attr('name'));
 blogStats.once('value', function(snapshot) {
  var data = snapshot.val();
  var isnew = false;
  if (data == null) {
   data = {};
   data.value = 0;
   data.url = window.location.href;
   data.id = $(e).attr('name');
   isnew = true;
  }
  elem.removeClass('mbtloading').text(data.value);
  data.value++;
  if (window.location.pathname != '/') {
   if (isnew) {blogStats.set(data);}
   else
            blogStats.child('value').set(data.value);
  }
 });
});
</script>
<style>
#post_media_permalink_container {
  margin: -70px -10px 0px 0px;
  padding: 0;
  position: relative;
  width: 102%;
  height: 599px;
  background: #F9F9F9;
  overflow: hidden;
  background-repeat: no-repeat;
  background-size: cover;
}
.post_media_permalink {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover !important;
  opacity: 1;
  background-position: 0px 0px;
  background-repeat: no-repeat;
  position: relative;
}
.post_media_permalink img {
  filter: blur(10px);
  -webkit-filter: blur(6px);
  -moz-filter: blur(10px);
  -o-filter: blur(10px);
  -ms-filter: blur(10px);
  filter: url(https://googledrive.com/host/0BzhmjN6UOoj5MTV3d0NwaUJHVHc?dl=1#blur);
  filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius='10');
  background-repeat: no-repeat;
}
.demo:hover,.download1:hover,.download:hover {background:rgba(0, 0, 0, 0.6);text-shadow:0 0 1px #222;color:#fff;}
.button{float:right;list-style:none;text-align:center;width:95%;margin:10px;
padding:2px;font-size:14px;clear:both;-webkit-box-reflect:below -3px -webkit-gradient(linear,left top,left bottom,from(transparent),color-stop(75%,transparent),to(rgba(255,255,255,0.4)))}
.button ul {margin:0;padding:0}
.button li{display:inline;margin:0;padding:0}
.demo {opacity:1;padding:5px 14px!important;background:#9eb2c0;color:#fff!important;font-weight:400;font-size:14px;text-align:center;text-transform:uppercase;transition:background-color 1s 0s ease-out;text-decoration: none!important;}
.download {opacity:1;padding:5px 14px!important;background:#fe4e3f;color:#fff!important;font-weight:400;font-size:14px;text-align:center;text-transform:uppercase;transition:background-color 1s 0s ease-out;    text-decoration: none!important;}
.demo:before {content: '\f06e';display: inline-block;margin-left: 5px;width: 16px;height: 31px;line-height: 24px;color: #fff;font-family: fontawesome;transition: all 0.5s ease-in-out;padding: 3px;background: rgba(0, 0, 0, 0.2);margin-right: -14px;padding-bottom: 8px;padding-left: 20px;padding-right: 7px;}
.download:before {content:'\f019';display: inline-block;margin-left: 5px;width: 16px;height: 31px;line-height: 24px;color: #fff;font-family: fontawesome;transition: all 0.5s ease-in-out;padding: 3px;background: rgba(0, 0, 0, 0.2);margin-right: -14px;padding-bottom: 8px;padding-left: 20px;padding-right: 7px;}
.download1 {opacity:1;padding:5px 14px!important;background:#3FA2FE;color:#fff!important;font-weight:400;font-size:14px;text-align:center;text-transform:uppercase;transition:background-color 1s 0s ease-out;text-decoration: none!important;}
.download1:before {content:'\f019';display:inline-block;margin-left:5px;width:16px;height:31px;line-height:24px;color:#fff;font-family:fontawesome;transition:all 0.5s ease-in-out;padding:3px;background:rgba(0, 0, 0, 0.2)padding: 3px;background: rgba(0, 0, 0, 0.2);margin-right: -14px;padding-bottom: 8px;padding-left: 20px;padding-right: 7px;}
.blo1web-links {clear: both;margin-bottom: 15px;}
.blo1web-links a {display: block;overflow: hidden;margin-bottom: -15px;white-space: nowrap;text-align: center;position: relative;height: 60px;
line-height: 60px;padding: 0 30px;color: #fff;    text-transform: uppercase;font-weight: bold;text-decoration: none!important;border-radius: 2px!important;}
.blo1web-links a:before {display: inline;font: normal normal normal 14px/1 FontAwesome;vertical-align: middle;position: absolute;left: 50%;width: 20px;height: 20px;
margin-left: -10px;top: 50%;margin-top: -10px;opacity: 0;-webkit-transform: scale(10);-moz-transform: scale(10);-o-transform: scale(10);-ms-transform: scale(10);
color: #FFF;font-size: 20px;}
.blo1web-links a:hover:before {opacity: 1;-webkit-transform: scale(1);-moz-transform: scale(1);-o-transform: scale(1);-ms-transform: scale(1);transition: all .2s ease;-webkit-transition: all .2s ease;-moz-transition: all .2s ease;-o-transition: all .2s ease;-ms-transition: all .2s ease;}
a.download2 {background-color: #fe4e3f;}a.download3 {background-color:#3FA2FE;}a.demo1 {background-color: #9A9898;}a.buy {background-color: #FFCD3F;}a.link {
background-color: #6E7784;}
.blo1web-links .download2:hover{background-color: #F54C3E;color:#fff}
.blo1web-links .download2:before {content: '\f0ed';}
.blo1web-links .download3:hover{background-color: #4399CD;color:#fff}
.blo1web-links .buy:hover{background-color: #F9C83D;color:#fff}
.blo1web-links .link:hover{background-color: #616975;color:#fff}
.blo1web-links .download3:before {content: '\f0ed';}
.blo1web-links .link:before {content: '\f0c1';}
.blo1web-links .demo1:before {content: '\f135';}
.blo1web-links .buy:before {content: '\f09d';}
.blo1web-links .trial:before {content: "\f20a";}
.fa-cc:before {content: "\f20a";}
.blo1web-links a span {white-space: nowrap;overflow: hidden;display: block;}
.blo1web-links a:hover span {display: none;}
.blo1web-links a:hover {background-color: #848181;color: #FFF;}
.blo1web-links a:hover span {color: #FFF;}
.temp-ftr {position: relative;font-size: 13.5px;}
.temp-ftr ul{list-style:none;}.temp-ftr li{    white-space: nowrap;border: 1px solid #EAE9E9;padding: 10px;margin: 0;    border-bottom: none;}.temp-ftr li:last-child{border-top: 1px solid #EFEFEF; border-bottom: 1px solid #EFEFEF;}.temp-ftr li i{border-left: 1px solid #ddd;padding-left: 7px;margin-left: 5px;color: #ddd;width: 21px;text-align: center;}.temp-ftr li:hover{cursor:pointer;}.temp-ftr li:nth-child(2n+2){background-color:#f9f9f9;    border-bottom: none;}.temp-ftr li:hover .fa-check{color:#61a136;}.temp-ftr li:hover .fa-tasks{color:#e84c4a;}.temp-ftr a{line-height: 0!important;background: none!important;color: #448AFF;overflow: visible!important;padding: 0!important;margin: 0!important;text-align: initial;height: 0!important;font-weight: normal;display: inline-table;font-family: tahoma;}.temp-ftr li:hover .fa-copyright,.temp-ftr li:hover .fa-cc,.temp-ftr li:hover .fa-file-image-o,.temp-ftr li:hover .fa-folder-o {color: #ddd;}
.temp-ftr a:hover,.temp-ftr li:hover .fa-file-archive-o{color: #3F80EC;}
.post-info > div > span.post-tags, .post-info > div > span.post-author, .post-info > div > span.post-timestamp, .post-info > div > span.post-comment-cnt , .post-info > div > span.post-broken,.post-info > div > span.post-disqus-cnt{display: block;float: none;clear: both;min-height: 32px;margin-bottom: 4px;background: rgba(245, 244, 244, 0.7);font-size: 13px;}
.post-inf > div > span.post-tag, .post-inf > div > span.post-autho, .post-inf > div > span.post-timestam, .post-inf > div > span.post-comment-cn , .post-inf > div > span.post-broke {display: block;float: none;clear: both;min-height: 32px;margin-bottom: 4px;background: #EBEBEB;font-size: 13px;}
.post-inf > div a {color: #408696;}
.post-inf > div > span .fa {width: 32px;height: 32px;color: #FFF;text-align: center;font-size: 22px;margin-left: 10px;padding-top: 5px;vertical-align: middle;}
.post-inf > div > span .fa-file-archive-o {background: #E92648;}
.post-inf > div > span .fa-tachometer {background: orange;}
.post-inf > div > span .fa-copyright {background: #12ACE0;}
.post-inf > div > span .fa-toggle-off {background: #514069;}
.col-tag {display: none;}
.post-info > div a {color: #408696;}
.post-info > div > span .fa {width: 32px;height: 32px;color: #FFF;text-align: center;font-size: 22px;margin-left: 10px;padding-top: 5px;vertical-align: middle;}
.post-info > div > span .fa-calendar {background: #7F93A2;}
.post-info > div > span .fa-comment {background: orange;}
.post-info > div > span .fa-comment-o {background: #4d90fe;}
.post-info > div > span .fa-user {background: #E55048;}
.post-info > div > span .fa-tags {background: #81e058;}
.post-info > div > span .fa-eye {background: #0ebeff;}
.post-info > div > span .fa-link {background: #974EE5;}
.post-info > div > span .fa-chain-broken {background: #fcd000;}
#views-container{
  display: inline-block;
}
.post-timestamp {
  margin-right: 0em;
}
.blo1web-links a:hover {
    color: rgba(0, 0, 0, 0) !important;
}
.blo1web-links a:hover:before {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    transition: all .2s ease;
    -webkit-transition: all .2s ease;
    -moz-transition: all .2s ease;
    -o-transition: all .2s ease;
    -ms-transition: all .2s ease;
}
.blo1web-links .link:before {
    content: '\f0c1';
}
.blo1web-links a:before {
    display: inline;
    font: normal normal normal 14px/1 FontAwesome;
    vertical-align: middle;
    position: absolute;
    left: 50%;
    width: 20px;
    height: 20px;
    margin-left: -10px;
    top: 50%;
    margin-top: -10px;
    opacity: 0;
    -webkit-transform: scale(10);
    -moz-transform: scale(10);
    -o-transform: scale(10);
    -ms-transform: scale(10);
    color: #FFF;
    font-size: 20px;
}
blo1web-postinfo{background: #FFF;border: 1px solid #E7E7E7;color: #555;display: block;max-width: 47%;text-align: right;height: 250px;margin-top: 20px;margin-right: 7px;}
blo1web-postinfo {max-width: 100%;width:initial;margin-right:0;border: none;border-bottom: 1px solid #F5F5F5;}
</style>
الان ابحث عن كود السايد بار غالبا ما يكون بهذا الشكل <div id='sidebar-wrapper'>
واضف الكود التالى بعدة مباشرةً

الكود

<b:if cond='data:blog.pageType == &quot;item&quot;'>
  <b:section class='sideinfo' id='sideinfo' showaddelement='yes'>
    <b:widget id='HTML998' locked='false' title='post info' type='HTML'>
      <b:includable id='main'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
<div class='post-info2'/>
  </div>

  <b:include name='quickedit'/>
</b:includable>
    </b:widget>
    <b:widget id='HTML997' locked='false' title='post tools' type='HTML'>
      <b:includable id='main'>
  <!-- only display title if it's non-empty -->
  <div class='widget-content'>
    <div class='blo1web-links2'/>
  </div>

  <b:include name='quickedit'/>
</b:includable>
    </b:widget>
  </b:section>
    </b:if>
الان ابحث عن <div class='post-header'>
واضف الكود التالى بعدة مباشرةً

الكود

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div style="display:none;">
<div class='post-info' id='new-post-info'>
<div class='cl-item-page' id='fixe-blo1web'>
<span class='post-comment-cnt vcard'><i class='fa fa-comment'>
</i>التعليقات : <data:post.numComments/></span>
<span class='post-author vcard'>
<span class='fn' itemprop='author' itemscope='itemscope' itemtype='http://schema.org/Person'>
<i class='fa fa-user'>
</i>الكاتب : 
<span itemprop='name'><data:post.author/></span>
</span>
</span>
<span class='post-timestamp'>
<i class='fa fa-calendar'>
</i>
<data:post.timestamp/>
</span>
<span class='post-comment-link'>
</span>
<span class='post-tags'>
<i class='fa fa-tags'>
</i>
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<a class='first' expr:href='data:label.url + &quot;?max-results=8&quot;' rel='tag'><data:label.name/></a>
<b:if cond='data:label.isLast != &quot;true&quot;'>&#1548;</b:if>
</b:loop>
</b:if>
</span>
<span class='post-comment-cnt'><i class='fa fa-eye'/>
عدد المشاهدات : <div id='views-container'>
<span class='views-icon'/>
<div class='views-text'/>
  <span class='mbt-loading viewscount' id='postviews'/>
</div></span>
<span class='post-broken'><i class='fa fa-chain-broken'>
</i>قم بالابلاغ عن رابط معطوب<a href='http://en.blo1web.com/p/broken-link.html' style='color #F56C27;text-decoration: underline;padding: 3px;font-size: 11px;' target='_blank'>هنا</a></span>
<span class='post-instructions'><i class='fa fa-link'>
</i>سياسة الخصوصية <a href='http://en.blo1web.com/p/privacy-policy.html' style='color #F56C27;text-decoration: underline;padding: 3px;font-size: 11px;' target='_blank'>هنا</a></span>
<span class='post-icons'>
</span>
  </div></div></div>
</b:if>

لا تنسا ان تكن من أعضاء المدونة من هنا , إذا واجهتك اي مشكلة لا تترد فى ترك تعليق
خط نوار - NAWAR FONT

خط نوار - NAWAR FONT

السلام عليكم.....�� , اليوم اقدم لكم خط انيق ومميز �� و احترافي يسمى بخط " نوار - Nawar Font "يمكنكم استعماله في تصاميمكم المختلفة ❗ , سواء كان للشعارات او الصورة او البنرات إلخ , هذا الخط صمم خصيصا للإعلانات والنشر يدعم الأرقام.. سيضيف هذا الخط نظرة قوية على تصاميمك لذا احرص على ان تحسن استخدامه �� , كي لا طيل عليكم ⏰, سوف نتجة الان الي تحميل الخط .

لا تنسا ان تكن من أعضاء المدونة من هنا , إذا واجهتك اي مشكلة لا تترد فى ترك تعليق
بطاقة BUSINESS CARD احترافية PSD

بطاقة BUSINESS CARD احترافية PSD

السلام عليكم ..
مرحبا بكل زوار و متتبعي مدونة برو ويب ها قد اتينا لكم اليوم ببطاقة BUSINESS CARD احترافية
 في ملف مفتوح المصدر - PSD -
ومنها يمكنكم تصميم بطاقة خاصة بكم من تعديل المعلومات و تغييرها الى معلوماتكم
كي لا نطيل عليكم تفضلو بالتحميل

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

إضافة شريط آخر الأخبار بشكلين أحترافين لقوالب بلوجر


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


شرح طريقة التركيب

1. من القالب ابحث عن ]]></b:skin> وضع كود الشكل المختار فوقه


الشكل الأول

.ticker {overflow: hidden;}
.ticker .title {float: right; width: 130px; height: 40px; line-height: 40px; text-align: center; color: #FFFFFF; background: #269bd0;}
.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: 15px;display: inline-block;font-size: 18px;}
.ticker .title h6 {text-align: right; line-height: 40px; font-size: 13px; font-weight: bold; font-family: 'Droid Arabic Naskh',sans-serif; color: #fff;}
.ticker .tickercontainer {width: 84%;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: 40px;margin-left: 15px;}
.ticker ul.newsticker a {white-space: nowrap;padding: 0 7px;color: #FFFFFF;font-size: 13px;font-weight:400;font:13px/1.5em tahoma;}
a.post-tag {line-height: 21px;}
.newsticker li:nth-child(1) a.post-tag{background-color: #2C97DE;}
.newsticker li:nth-child(2) a.post-tag{background-color: #A557A5;}
.newsticker li:nth-child(3) a.post-tag{background-color: #1E73BE;}
.newsticker li:nth-child(4) a.post-tag{background-color: #DD3333;}
.newsticker li:nth-child(5) a.post-tag{background-color: #E94B35;}
.newsticker li:nth-child(6) a.post-tag{background-color: #1EBE65;}
.newsticker li:nth-child(7) a.post-tag{background-color: #F7B625;}
.newsticker li:nth-child(8) a.post-tag{background-color: #479123;}
.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: 100%; overflow: hidden; background: #414D58; box-shadow: inset 0 5px 0 rgba(0,0,0,0.04);}
.jari { color: #fff; position: relative; right: 5px; }

@media only screen and (max-width:640px){
.ticker .title{display:none}
.ticker .tickercontainer {width: 95%;}}

الشكل الثاني

/* CSS Breaking News */
#breakingnews {height: 42px; line-height: 29px; overflow: hidden; background: #FFFFFF; border: 1px solid #E6E4E4; width: 95%; margin: 20px auto;}
#breakingnews .breakhead {position:relative;background:none repeat scroll 0 0 #C03032;color:#fff;display:block;float:right;font-size:14px;font-weight:400;text-transform:uppercase;padding:6.5px 22px;    font-family: Droid Arabic Naskh;}
#adbreakingnews li a {font:13px/1.5em tahoma;font-weight:400;color:#666;margin-top:10px;transition:all 0.5s ease-in-out;}
#adbreakingnews li a:hover {color:#00AFAF;}
#adbreakingnews {float:right;margin-right:25px;margin-top:6px;}
#adbreakingnews ul,#adbreakingnews li{list-style:none;margin:0;padding:0}
i.fa.fa-youtube { color: #EC2423; }i.fa.fa-facebook { color: #4770C5; }i.fa.fa-google-plus { color: #F51518; }i.fa.fa-twitter { color: #269bd0; }
li.socright { float: left; padding: 5px 15px; line-height: 33px; margin: 0 0px; background-color:#F7F8F9; font-size: 18px; border-right: 1px solid #EFECEC; }

@media only screen and (max-width:640px){
#breakingnews {margin:20px 0 0 0;margin-right:0;}
#breakingnews .breakhead {padding:6.5px 14px;}
#adbreakingnews {margin-left:50px;}}
2. ضع الكود التالي فوق </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>

الشكل الثاني

<script type='text/javascript'>
//<![CDATA[
// Breaking News
$(document).ready(function(){var e="http://rissalat-i.blogspot.com/",t=20;$.ajax({url:""+e+"/feeds/posts/default?alt=json-in-script&max-results="+t,type:"get",dataType:"jsonp",success:function(e){function t(){$("#adbreakingnews li:first").slideUp(function(){$(this).appendTo($("#adbreakingnews ul")).slideDown()})}var n,r,s="",a=e.feed.entry;if(void 0!==a){s="<ul>";for(var l=0;l<a.length;l++){for(var o=0;o<a[l].link.length;o++)if("alternate"==a[l].link[o].rel){n=a[l].link[o].href;break}r=a[l].title.$t,s+='<li><a href="'+n+'" target="_blank">'+r+"</a></li>"}s+="</ul>",$("#adbreakingnews").html(s),setInterval(function(){t()},5e3)}else $("#adbreakingnews").html("<span>لا نتائج!</span>")},error:function(){$("#adbreakingnews").html("<strong>!خطأ في جلب التغذية</strong>")}})});
//]]>
</script>
3. نأتي للمرحلة الأخيرة وهي تخص كود HTML الذي يُظهر الشريط يمكنك وضعه بأي مكان يناسبك تحت الهيدر فوق القائمة إلخ أو يمكنك تجربته بوضعه في أداة Html/Javascript إذا كانت المساحة متواجدة

الشكل الأول

<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-globe'/> </div>
        <h6>آخر الصيحات</h6>
      </div>
  <div class='jari'>
    recent
  </div>
       </div>
</div>
   </div>
 </div>

الشكل الثاني

<div id='breakingnews'><span class='breakhead'><i class='fa fa-rss'/> آخر الأخبار </span>
<div id='adbreakingnews'>... جاري التحميل</div>
<ul>
<li class='socright'>
<a href='#' rel='nofollow' target='_blank'><i class='fa fa-facebook'/></a>
</li>
<li class='socright'>
<a href='#' rel='nofollow' target='_blank'><i class='fa fa-twitter'/></a>
</li>
<li class='socright'>
<a href='#' rel='nofollow' target='_blank'><i class='fa fa-youtube'/></a>
</li>
<li class='socright'>
<a href='#' rel='nofollow' target='_blank'><i class='fa fa-google-plus'/></a>
</li>
</ul>
</div>
التغييرات الأساسية
* في كود الشكل الثاني بالمرحلة 2 غير http://rissalat-i.blogspot.com/ برابط موقعك
* لتحكم في طول الشريط فالمقاسات محددة بالأخضر في كِلا الكودين بالمرحلة 1
* لتغيير لون مربع العنوان فهو محدد بالأزرق بالمرحلة 1
* إذا لم تظهر لك الأيقونات أضف الكود التالي فوق </head>

<link href='//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css'/>
لا تنسا ان تكن من أعضاء المدونة من هنا , إذا واجهتك اي مشكلة لا تترد فى ترك تعليق
أفضل المواقع بيج رانك 9 للحصول علي باك لينك دوفلو قوي

أفضل المواقع بيج رانك 9 للحصول علي باك لينك دوفلو قوي

السلام عليكم....
كما وعدناكم دأئماٌ بتقديم لكم الافضل في مجال السيو , ومازلنا نقدم لكم ألآفضل ! , اليوم معنا درس قوي في مجال السيو وبالأخص بالباك لينك , مما لا شك فيه ان الباك لينك عامل من عوامل تصدر نتائج البحث , وتسريع الارشفة ورفع الدومين اثوروتي والبيج رانك .
==> ولاكن كيف يمكننا الحصول على الباك لينك ؟
للحصول على الباك لينك يجب ان يكون من مواقع يترواح البيج رانك من 3 الى 9 لأكبر استفاده , واليوم انا جلبت لكم أفضل وأقوي المواقع بيج رانك 9 للحصول علي باك لينك دوفلو قوي , لتصدر نتائج البحث وتسريع الارشفة ورفع الدومين اثوروتي والبيج رانك.
هذه المواقع سوف تساعد موقعك بشكل ملحوظ جدا لتصدرة نتائج البحث ,

==> ولاكن لماذا انا جلبت لكم المواقع بيج رانك 9 فقط ؟
الجميع يعلم جيداٌ أن اضافة رابط واحد فى موقع بيج رانك 9 يعطى مصداقية لموقعك فى محرك البحث جوجل , وان رابط واحد فى موقع يتمتع ببيج رانك 9 يعادل 1000 رابط بالمقارنة مع المواقع التى تحمل بيج رانك 1.

* القائمة سوف تفيدك في الإتي :
  1. مسك كلمة مفتاحية عن طريقها
  2. تسلق محركات البحث وتصدرة
  3. رفع البيج رانك لموقعك او مدونتك
  4. تسريع الارشفه
  5. تحسن موقعك في نتائج البحث
  6. زيادة زوار موقعك
  7. الحصول على باك لينك جيد فى جوجل
  8. اكتساب بيج اثورتى و دومين اثورتى لموقعك
  9. والكثيير .............

المواقع

https://kdp.amazon.com
https://discussions.apple.com
http://www.studyabroad.com
http://www.plurk.com
https://delicious.com
https://www.flickr.com
https://getsatisfaction.com
http://www.brownpapertickets.com
https://community.linksys.com
https://www.ibm.com/developerworks
http://eterna.cmu.edu
http://www.everytrail.com
https://www.goodreads.com
http://pahma.berkeley.edu
https://www.scribd.com
https://www.codeplex.com
http://www.arboretum.umn.edu
http://www.studiopress.com
http://www.bookcrossing.com
http://omeka.org/forums
http://help-forums.adobe.com
https://www-secure.symantec.com
http://www.slideshare.net
http://ckeditor.com
https://www.zotero.org
http://www.ted.com
https://musicbrainz.org
http://www.chow.com
لا تنسا ان تكن من أعضاء المدونة من هنا , إذا واجهتك اي مشكلة لا تترد فى ترك تعليق
إضافه سلايد شو تلقائي احترافي لمدونات بلوجر V1

إضافه سلايد شو تلقائي احترافي لمدونات بلوجر V1

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

شرح طريقة التركيب

1. ابحث بإستعمال CTRL+F عن ]]></b:skin> أو ضعه بين <style> </style> فوق </head>
2. وضع الكود التالي فوقه

الكود

/*Slider V1 www.Pro7web.com */
#featuredSlider{ background: #fff; float: right; margin: 10px; padding: 0 0 10px; border: 1px solid #E4E3E3;width: 96.2%;height: 285px;position: relative; color: #666;direction: rtl; }
.featured-thumb {float: right; margin: 5px 0; padding: 0px; padding-left: 10px;}
#featuredSlider .container { margin:8px 10px 0 0;overflow:hidden; position:relative;}
.featuredTitle { padding-top: 15px; font: 16px droid arabic kufi, serif; text-align: right; font-weight: 700;}
.featuredTitle a{color:#FC4F3F}
.featuredTitle a:hover{color:#000}
p.text-ar1web { font: 12px/1.9em tahoma;}
a.readmore {float: right; border: 1px solid #BFBFBF; background: #FFF; display: block; font: bold 10px droid arabic kufi; margin: 10px 0 0 0; padding: 4px 10px; color: #383737;}
a.readmore:hover {color: #FC4F3F;border:1px solid #ABAAAA;}
.slides{width:100%!important;height:280px!important}
.navigation {float:left;overflow:hidden;position: relative;bottom:7px}
ul.pagination {list-style-type:none; margin:0 auto; padding:0;}
ul.pagination a { float:left; margin:0 5px; display:inline; }
ul.pagination a { display:block;width:12px; padding-top:12px; height:0; overflow:hidden; background-image:url(http://2.bp.blogspot.com/-j2T8LeJpjkY/UBfzfSqJGSI/AAAAAAAAIDE/jiGwQpYoRO4/s1600/slider+pagination.png); background-position:0 0; background-repeat:no-repeat; }
ul.pagination a:hover { background-position:0 -12px; }
ul.pagination a:hover { background-position:0 -12px; }
ul.pagination a.activeSlide { background-position:0 -12px }

/*
 * Droid Arabic Kufi (Arabic) http://www.google.com/fonts/earlyaccess
 */
@font-face {
  font-family: 'Droid Arabic Kufi';
  font-style: normal;
  font-weight: 400;
  src: url(//fonts.gstatic.com/ea/droidarabickufi/v6/DroidKufi-Regular.eot);
  src: url(//fonts.gstatic.com/ea/droidarabickufi/v6/DroidKufi-Regular.eot?#iefix) format('embedded-opentype'),
       url(//fonts.gstatic.com/ea/droidarabickufi/v6/DroidKufi-Regular.woff2) format('woff2'),
       url(//fonts.gstatic.com/ea/droidarabickufi/v6/DroidKufi-Regular.woff) format('woff'),
       url(//fonts.gstatic.com/ea/droidarabickufi/v6/DroidKufi-Regular.ttf) format('truetype');
}
@font-face {
  font-family: 'Droid Arabic Kufi';
  font-style: normal;
  font-weight: 700;
  src: url(//fonts.gstatic.com/ea/droidarabickufi/v6/DroidKufi-Bold.eot);
  src: url(//fonts.gstatic.com/ea/droidarabickufi/v6/DroidKufi-Bold.eot?#iefix) format('embedded-opentype'),
       url(//fonts.gstatic.com/ea/droidarabickufi/v6/DroidKufi-Bold.woff2) format('woff2'),
       url(//fonts.gstatic.com/ea/droidarabickufi/v6/DroidKufi-Bold.woff) format('woff'),
       url(//fonts.gstatic.com/ea/droidarabickufi/v6/DroidKufi-Bold.ttf) format('truetype');
}
3. ابحث عن </head> ثم ضع قبله الكود التالي

الكود

<script src='//cdn.rawgit.com/iHussam/ar1web/master/cycle.js' type='text/javascript'/>
<script src='//cdn.rawgit.com/iHussam/ar1web/master/slider2.js' type='text/javascript'/>
4. يتمثل الكود التالي في وضعه بالمكان المناسب لك وأفضل مكانه له هو فوق المواضيع كما بالمعاينة
لذا إن أردت وضعه هناك فابحث عن <b:section class='main' id='main' showaddelement='no'>
بعدها ضع الكود فوقه إن وجدت فوقه كود مثلا : <div id='main-wrapper'> فضع الكود فوقه

الكود

<b:if cond='data:blog.pageType == &quot;index&quot;'>
<div id='featuredSlider'>
<div class='container'>
 
<script>
document.write(&quot; &lt;script src=\&quot;/feeds/posts/default?max-results=&quot;+numposts+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts\&quot;&gt;&lt;\/script&gt;&quot;);
</script>
<div class='navigation'>
<ul class='pagination'/>            <script>
$(&#39;.slides&#39;).cycle({
  fx:     &#39;fade&#39;,
  speed:  &#39;slow&#39;,
  timeout: 2000,
  pager:  &#39;.pagination&#39;
  });
</script>
</div>
         </div> <!--end .container-->
</div> 
</b:if>

التغييرات الأساسية
1. لتعديل مقاس السلايدر فالرقم محدد بالأحمر في كود المرحلة 1
2. لتعديل توقيت سرعة المواضيع فالرقم محدد بالأزرق في كود المرحلة 4 إذا أردت تسريعه فعليك خفض الرقم مثلا من 2000 إلى 1000 والعكس إذا أردت تبطيئه
3. إن كنت تتوفر على خط Droid Arabic Kufi فقم بحذفه من الكود الأول هو محدد بالبرتقالي
إذا واجهتك اي مشكلة لا تترد فى ترك تعليق