رمضان مبارك على جميع الأمة الإسلامية :) أدخل الله علينا و عليكم هذا الشهر بالعز والتمكين و الأمن والإيمان و القرب من الرحمــن والعتق من النيران و جميع المسلمين اللهم آمين

الخميس، 20 يونيو 2013

اضافة مواضيع ذات صلة بطريقة مميزة وجذابة في مدونات بلوجر

اضافة مواضيع ذات صلة بطريقة مميزة وجذابة في مدونات بلوجر


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

الخطوة الاولى :
1- من لائحة تحكم بلوجر ..اذهب الى قالب ثم الى تحرير HTML

الخطوة الثانية :
2- ابحث عن الوسم الاتي (CTRL + F)
 </head>
الخطوة الثالثة : 
3- ثم الصق هذا الكود :
 <script type='text/javascript'>
//<![CDATA[
var relatedTitles = new Array();
var relatedUrls = new Array();
var relatedpSummary = new Array();
var relatedThumb = new Array();
var relatedTitlesNum = 0;

var relatedPostsNum = 4; // number of entries to be shown
var relatedmaxnum = 75; // the number of characters of summary
var relatednoimage = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjrgDstFMKAJKPHHhEslUB2Jz7oBGL-6bt2qJx79s9Qbt0nXGNAuJIPhyphenhyphen8eInQhcFznuNsfwVz-5NMHBiuUfLfWr9GIcny6l4o88ewlcl15NGfj49wD3uzSUdKlT6ARrNo3dj1H0twJ4ZFU/s1600/no_image.jpg"; // default picture for entries with no image

function readpostlabels(json) {
  var entry, postimg, postcontent, cat;
  for (var i = 0; i < json.feed.entry.length; i++) {
    entry = json.feed.entry[i];
    if (i==json.feed.entry.length) { break; }
    relatedTitles[relatedTitlesNum] = entry.title.$t;
    postcontent = "";
    if ("content" in entry) {
      postcontent = entry.content.$t;
    } else if ("summary" in entry) {
      postcontent = entry.summary.$t;
    }
    relatedpSummary[relatedTitlesNum] = removetags(postcontent,relatedmaxnum);
    if ("media$thumbnail" in entry) {
      postimg = entry.media$thumbnail.url;
    } else {
      postimg = relatednoimage;
    }
    relatedThumb[relatedTitlesNum] = postimg;
    for (var k = 0; k < entry.link.length; k++) {
      if (entry.link[k].rel == 'alternate') {
        relatedUrls[relatedTitlesNum] = entry.link[k].href;
        break;
      }
    }
    relatedTitlesNum++;
  }
}
function showrelated() {
  var tmp = new Array(0);
  var tmp2 = new Array(0);
  var tmp3 = new Array(0);
  var tmp4 = new Array(0);
  for(var i = 0; i < relatedUrls.length; i++) {
    if(!contains(tmp, relatedUrls[i])) {
      tmp.length += 1; tmp[tmp.length - 1] = relatedUrls[i];
      tmp2.length += 1; tmp2[tmp2.length - 1] = relatedTitles[i];
      tmp3.length += 1; tmp3[tmp3.length - 1] = relatedpSummary[i];
      tmp4.length += 1; tmp4[tmp4.length - 1] = relatedThumb[i];
    }
  }
  relatedTitles = tmp2; relatedUrls = tmp; relatedpSummary = tmp3; relatedThumb = tmp4;
  for(var i = 0; i < relatedTitles.length; i++){
    var index = Math.floor((relatedTitles.length - 1) * Math.random());
    var tempTitle = relatedTitles[i]; var tempUrls = relatedUrls[i];
    var tempResum = relatedpSummary[i]; var tempImage = relatedThumb[i];
    relatedTitles[i] = relatedTitles[index]; relatedUrls[i] = relatedUrls[index];
    relatedpSummary[i] = relatedpSummary[index]; relatedThumb[i] = relatedThumb[index];
    relatedTitles[index] = tempTitle; relatedUrls[index] = tempUrls;
    relatedpSummary[index] = tempResum; relatedThumb[index] = tempImage;
  }
  var somePosts = 0;
  var r = Math.floor((relatedTitles.length - 1) * Math.random());
  var relsump = r;
  var output;
  var dirURL = document.URL;

  while (somePosts < relatedPostsNum) {
    if (relatedUrls[r] != dirURL) {

      output = "<div class='relatedsumposts'>";
      output += "<a href='" + relatedUrls[r] + "' rel='nofollow'  target='_self' title='" + relatedTitles[r] + "'><img src='" + relatedThumb[r] + "' /></a>";
      output += "<h6><a href='" + relatedUrls[r] + "' target='_self'>" + relatedTitles[r] + "</a></h6>";
      output += "<p>" + relatedpSummary[r] + " ... </p>";
      output += "</div>";
      document.write(output);
     
      somePosts++;
      if (somePosts == relatedPostsNum) { break; }
    }
    if (r < relatedTitles.length - 1) {

      r++;
    } else {
     
      r = 0;
    }

    if(r==relsump) { break; }
  }
}
function removetags(text,length){
  var pSummary = text.split("<");
  for(var i=0;i<pSummary.length;i++){
    if(pSummary[i].indexOf(">")!=-1){
      pSummary[i] = pSummary[i].substring(pSummary[i].indexOf(">")+1,pSummary[i].length);
    }
  }
  pSummary = pSummary.join("");
  pSummary = pSummary.substring(0,length-1);
  return pSummary;
}
function contains(a, e) {
  for(var j = 0; j < a.length; j++) if (a[j]==e) return true;
  return false;
}
//]]>
</script>

الخطوة الرابعة : 
4- ابحث عن الكود التالي :
 <a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if>
الخطوة الخامسة
5- بعد الكود السابق الصق الكود التالي .
 <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=readpostlabels&amp;max-results=50&quot;' type='text/javascript'/>
  </b:if>
يجب ان تكون هكذا :
           <b:loop values='data:post.labels' var='label'>
            <a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
    <script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=readpostlabels&amp;max-results=50&quot;' type='text/javascript'/>
  </b:if>

          </b:loop>
الخطوة السادسة :
6- ابحث عن الكود التالي : 
 </b:includable>
<b:includable id='postQuickEdit' var='post'>
وفقط فوقها اضف الكود التالي : 
 <b:if cond='data:blog.pageType == &quot;item&quot;'>
  <div class='post-footer-line post-footer-line-4'>
    <div id='relatedpostssum'><div style='text-align: left; font-size: 15px; margin-bottom: 10px; font-weight: bold;'>RELATED POSTS</div>
      <script type='text/javascript'>showrelated();</script>
    </div>
    <div style='clear:both;'/>
  </div>
</b:if>
صورة توضيحية : 

الخطوة السابعة
6- ابحث عن الوسم الاتي : 
 ]]></b:skin>
و الصق هذا الكود فوقها : 
 .relatedsumposts {
  float: left;
  margin: 0px 5px;
  overflow: hidden;
  text-align: center;
  /* width and height of the related posts area */
  width: 120px;
  height: 210px;
}

.relatedsumposts:hover {
background-color: #F3F3F3; -webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}

.relatedsumposts img:hover {
-khtml-opacity:0.4;
-moz-opacity:0.4;
opacity:0.4;
}

.relatedsumposts a {
  /* link properties */
color: #linkcolor;
  display: inline;
  font-size: 10px;
  line-height: 1;
}
.relatedsumposts img {
  /* thumbnail properties */
margin-top: 2px;
  height: 82px;
  padding: 5px;
  width: 82px;
border: 1px solid #fff;
-webkit-border-radius: 100px;
-moz-border-radius: 100px;
border-radius: 100px;
-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .4);
-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .4);
box-shadow: 0 1px 2px rgba(0, 0, 0, .4);
}
.relatedsumposts h6 {
  /* title properties */
  display: table-cell;
  height: 5em;
  margin: 5px 0 0;
  overflow: hidden;
  padding-bottom: 2px;
  vertical-align: middle;
  width: 130px;
}

.relatedsumposts p {
  /* summary properties */
border-top: 1px dotted #777777;
border-bottom: 1px dotted #777777;
color: #summarycolor;
  font-size: 10px;
  height: 4em;
  line-height: 1;
  margin: 5px 0 0;
  overflow: hidden;
  padding: 5px 0 15px 0;
  text-align: left;
}
الخطوة الثامنة :
8- اضغط حفظ وتمتع بالاضافة 

اي سؤال او اي استفسار الرجاء ترك تعليق اسفل الموضوع 
والسلام عليكم
- See more at: http://www.computer-com.com/2013/06/blog-post_17.html#sthash.dbgSrGJs.dpuf
شــارك الـمـوضـوع مـع أصـدقـائــك ؟

الفيسبوك يسمح برفع الصور في التعليقات


الفيسبوك يسمح برفع الصور في التعليقات



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

الأحد، 26 مايو 2013

ثم اضف الكود التالي الي اداة HTML/JavaScript



بسم الله والحمدلله والصلاة والسلام على رسول الله ، اعزائي زوار متابعي مدونة بلوجر فيس العرب اليوم وبعد طول غياب اتينا لكم اليوم بإضافة جداً جميله الا وهيا إضافة ازرار تابعني على شكل شاحنات لمدونات البلوجر  نشرح الان كيفية تركيبها.

لتركيب الاضافه

  • اذهب الي لوحة التحكم
  • تخطيط 
  • إضافة اداه
  • ثم اضف الكود التالي الي اداة HTML/JavaScript

<div style="position: fixed; z-index: 65535; left: 0px; bottom: -3px; width:100%;"> <marquee><a href="http://www.facebook.com/Blogger.Face.alarab" target="blank"> <abbr title="Follow us at Facebook"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMRLYbj9rBLae9430G4zkHFP_qC6S9L-C-_GkWI8sJvVSS-lajTekUwjvE__1dEguOfnMA2O0oWylujLmHjxrN7jKjiwuJpe34iQ0uvpn2mxo2U918t61gcvhwHkTSTTuxepcWNSJbU7Gy/s1600/Social-Truck_fb2.png" width="120px" height="100px"/> </abbr> </a> <a href="http://feeds.feedburner.com/face-alarab" target="blank"> <abbr title="Subscribe Our Feeds"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEicpmf4rSa7_ndVHjMK6Bol4EPmEFSzOEpMhA7JUX9YPFZdi_7p5uk1QVQsFN2Kkpy0WJTUfsdGYmEP8SW6tOMPPRmVwGE-98g0blEdH7ylPchTRAqKGFT9_TkfM1OCevz3S6v43TqM1-Fv/s1600/Social-Truck_rss.png" width="120px" height="100px"/> </abbr> </a><a href="http://twitter.com/face_alarab" target="blank"> <abbr title="Follow Us on Twitter"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiK4l79S2MN8Fqf8I5lBsXsYtG83crpomTLQ5c6MyIWb6sawlJG8RFES21ENyhssFnq2JzGzuKk4EEy89DPpFP9xBFG7wgeQwP4MbclIt_CH6kPpoiPDpWzwY2b4Zn6s43qO2WBZbdpiUI4/s1600/Social-Truck_twi.png" width="120px" height="100px"/> </abbr> </a> </marquee></div>
 ولاتنسي تغيير
Blogger.Face.alarab

face-alarab

face_alarab

بما يلزم

الي هنا انتهى شرحنا والي اللقاء في تدوينه جديده

شــارك الـمـوضـوع مـع أصـدقـائــك ؟

قالب المحترف 2013



السلام عليكم ورحمة الله وبركاته اهلن بكم زوار ومتابعي مدونة بلوجر فيس العرب اليوم اتينا لكم بقالب المحترف 2013 ندخل في صلب الموضوع . 




لتغيير محرك البحث ابحث عن العباره التاليه ( محرك البحث هنا )

لضهور السلايدرشو ابحث عن

label1 = &quot;المحترف &quot;; 

وغير المحترف باسم القسم الذي تريده ان يضهر في السلايدرشو
شــارك الـمـوضـوع مـع أصـدقـائــك ؟