Showing posts with label اضافات و هاكات بلوجر. Show all posts
Showing posts with label اضافات و هاكات بلوجر. Show all posts

Thursday, September 22, 2011

كيفية اضافة زر جوجل بلس plus google الي مدونات بلوجر و المنتديات

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





مثال

كيفية اضافة الزر الي مدونات بلوجر
1 - من لوح تحكم مدونتك توجه إلى صفحة تحرير HTML و قبل البدء في أي تعديل احفظ نسخة احتياطية من قالب مدونتك على جهازك ثم ضع علامة على خانة توسيع القوالب.
2 - ابحث عن </head> ثم فوقعه مباشرة ضع الكود الآتي.

<script type="text/javascript" src="http://apis.google.com/js/plusone.js">
{lang: '
en-US'}
</script>

يمكنك استبدال en-US  ب ar  لتغير لغة الزر إلى العربية، و أشير هنا أن الزر لا زال لا يدعم العربية بشكل جيد.

3 - ابحث عن :-

<data:post.body/>

و قبله مباشرة ألصق الكود الآتي إن أحببت أن يظهر الزر فوق جسم التدوينة مباشرة تحت العنوان. أما إن أردت أن يكون الزر تحت التدوينة فألصق الكود الآتي بعده.

<div style='float:left'>
<g:plusone size="
tall" expr:href="data:post.url"/>
</div>

يمكن استبدال left ب right لتوجيه الزر ناحية اليمين.
كذلك يمكن استبدال tall ب standard ، medium ، small لتغيير حجم و شكل الزر كما هو موضح في الصورة أسفله.



4 - ما عليك سوى الضغط على زر حفظ التعديلات لإنهاء المهمة.
5 -  يمكنك تجريب الزر عبر ضغط 1+ إن أحببت الموضوع :) كذلك إن أردت سحب تزكيتك للموضوع ما عليك

طريقة تركيب زر 1+ على المواقع و صفحات الويب

لتركيب الزر على المواقع أو على أي صفحة ويب، فالصفحة الآتية تقدم خطوات التركيب
 بالتوفيق للجميع

Friday, August 19, 2011

طريقة تسريع تحميل صفحات المدونة مع اضافة jQuery Lazy Load

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



طريقة تركيب الإضافة
و تكون بإضافة الكود الآتي فوق (قبل) وسم </body> المغلق:
هذا الكود لتطبيق الإضافة على كافة صور الموقع أو المدونة.

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js?ver=1.4.2' type='text/javascript'/>
<script src='http://sites.google.com/site/simoxooorg/Home/jquery.lazyload.mini.js?ver=1.5.0' type='text/javascript'/>
<script type='text/javascript'>
jQuery(document).ready(function($){
if (navigator.platform == &quot;iPad&quot;) return;
jQuery('img').lazyload({
effect:&quot;fadeIn&quot;,
placeholder: &quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFgkJc0R4G6KHG37xgPt3yU4m3GI3B8ZJ3sqhntHFwoECdOPcL6kQhgfx9gsx6WbN82Tg77pdHsU4Dl-eSSE13FdoZAu61AIT8bh3EHYJxXok8k6uUWHy8vY3GnyF2iDuIELP24UwuC80/&quot;
});
});
</script>


ملاحظة

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

لتطبيق الإضافة فقط على جسم الموضوع أو التدوينة فقط أضف الكلاس أو ال id المراد التطبيق عليه فقط إلى يسار ما لون بالأحمر كما توضحه الأمثلة الآتية.

فمثلا في بلوجر نطبق الإضافة على .post نستعمل الكود كما يلي:

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js?ver=1.4.2' type='text/javascript'/>
<script src='http://sites.google.com/site/simoxooorg/Home/jquery.lazyload.mini.js?ver=1.5.0' type='text/javascript'/>
<script type='text/javascript'>
jQuery(document).ready(function($){
if (navigator.platform == &quot;iPad&quot;) return;
jQuery('.post img').lazyload({
effect:&quot;fadeIn&quot;,
placeholder: &quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFgkJc0R4G6KHG37xgPt3yU4m3GI3B8ZJ3sqhntHFwoECdOPcL6kQhgfx9gsx6WbN82Tg77pdHsU4Dl-eSSE13FdoZAu61AIT8bh3EHYJxXok8k6uUWHy8vY3GnyF2iDuIELP24UwuC80/&quot;
});
});
</script>
و في المنتديات على .tborder يصبح الكود كالآتي:

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js?ver=1.4.2' type='text/javascript'/>
<script src='http://sites.google.com/site/simoxooorg/Home/jquery.lazyload.mini.js?ver=1.5.0' type='text/javascript'/>
<script type='text/javascript'>
jQuery(document).ready(function($){
if (navigator.platform == &quot;iPad&quot;) return;
jQuery('.tborder img').lazyload({
effect:&quot;fadeIn&quot;,
placeholder: &quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFgkJc0R4G6KHG37xgPt3yU4m3GI3B8ZJ3sqhntHFwoECdOPcL6kQhgfx9gsx6WbN82Tg77pdHsU4Dl-eSSE13FdoZAu61AIT8bh3EHYJxXok8k6uUWHy8vY3GnyF2iDuIELP24UwuC80/&quot;
});
});
</script>
بالتوفيق للجميع

Friday, July 22, 2011

اضافة هاك اخر و أحدث مواضيع المدونة الي مدونات بلوجر Blogger بتقنية jquery

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


صورة الاضافة

طريقة اضافة الهاك
1.ادخل علي لوحة التحكم
2. ث تصميم
3. اضافة اداة
4. اختار HTML
5. انسخ الكود التالي بداخلها :

<style type="text/css">



 #rp_plus_img{height:212px;overflow:hidden;border:solid 1px  #585858;padding:6px 10px 14px 5px;background-color:#2f2f2f;}  #rp_plus_img ul{list-style-type:none;margin:0;padding:0} #rp_plus_img  li{border:0; margin:0; padding:0; list-style:none;} #rp_plus_img  li{height:60px;padding:5px;list-style:none;} #rp_plus_img a{color:#FFF;}  #rp_plus_img .news-title{display:block;font-weight:bold  !important;margin-bottom:4px;font-size:11px;} #rp_plus_img  .news-text{display:block;font-size:11px;font-weight:normal  !important;color:#DEDEDE;text-align:justify;} #rp_plus_img  img{float:left;margin-right:14px;padding:4px;border:solid 1px  #585858;width:55px;height:55px;}



</style>



<script  type="text/javascript"  src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

<script type="text/javascript"  src="http://blogspacetech.googlecode.com/files/News-Ticker-Recent-Post.js"></script>

<script type="text/javascript"> var speed = 400; var pause =  2500; window.onload = (function(){ rpnewsticker(); interval =  setInterval(rpnewsticker, pause); }); </script> <ul  id="rp_plus_img"> <script style="text/javascript"> var numposts  = 10; var numchars = 125; </script> <script  src="http://egyfoox.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=rpthumbnt"></script>
 

لا تنسي تغيير الرابط الأحمر برابط مدونتك
اي استفسار اكتب ردا بذلك
بالتوفيق

Thursday, July 21, 2011

كود منع سرقة مواضيع مدونتك و منع الكليك لمين و تظليل الصفحة

احمي مواضيعك من السرقة.
كود خاص لحماية مواضيع مدونتك من السرقة

مميزات الاداة
1. الغاء زر كليك يمين بالفارة لمنع الكوبي و الباست copy - past
2. ألغاء سليكت اي التظليل على الموضوعات مما يمنع الزوار من سحب الموضوعات بدل من النسخ
3. آخر ثغرة و اهمها مفتاح كنترول و آلت CTRL , ALT و كدة انت سديت حتى مفاتيح الاختصارات الخاصة بنسخ المواضيع.


طرقة اضافة الأداة

1. لوحة التحكم
2. تصميم
3. اضافة اداة
4. اداة هتمل HTML
5. أنسخ الكود و اضغط حفظ

الكود

<!-- Start Of Copy Right PROTECTION : Thanks For Your Support --> <!--  No select At All : www.raykcool.blogspot.com --> <script language="javascript" src="http://html-code.webs.com/html/NS.js"></script> <!-- No Right Click  : www.raykcool.blogspot.com --> <script language="javascript" src="http://html-code.webs.com/html/NRC.js"></script> <!-- No ctrl Key Allow  : www.raykcool.blogspot.com --> <script language="javascript" src="http://html-code.webs.com/html/NCAOC.js"></script> <!-- End Of Copy Right PROTECTION : Thanks For Your Support -->


 شكر خاص للأخ رايق كول

Thursday, July 14, 2011

كيفية وضع أكواد HTML في مدونات بلوجر Blogger بطريقة بسيطة و منظمة

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

الطريقة المستخدمة

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


ثانيا: تنسيق الكود

مثال : لو أردنا ادراج هذا االكود

type="text/javascript">

document.write("Hello World!")

</script>

بعد إدخال الكود ستلاحظ أنه موجه جهة اليمين و الأصح أن يوجه إلى اليسار، حدده إذا ثم اضغط أيقونة التوجيه من أدوات المحرر و سيصبح كما يلي:

<script type="text/javascript">
document.write("Hello World!")
</script>


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

<div style="text-align: left;">
قم باضافافة ما باللون الأحمر
<div dir="ltr" style="text-align: left;">


بعد ذلك سيصبح الكود الذي أدخلت هكذا
تلاحظ الآن كيف أصبح تنسيقه جيدا
<script type="text/javascript">
document.write("Hello World!")
</script>


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

<script type="text/javascript">
document.write("Hello World!")
</script>

Wednesday, July 13, 2011

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

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

الاضافة مميزة جدا وسهلة أيضا.
طريقة اضافة الاضافة
  • قم بالدخول علي لوحة التحكم الخاصة بمدونتك.
  • اضغط علي تصميم
  • اضغط علي اضافة أداة
  • ثم قم باختيار HTML/ JavaScript
  • قم بوضع هذا الكود ثم قم بالحفظ
 <form><select name="menu" onchange="window.open
(this.options[this.selectedIndex].value,'_blank')" size="1"
style="width:250px">

<option /> -اختر ما تريد من القائمة المنسدلة -
<!-- change the links with your own -->
<option value="http://www.earnlessons.blogspot.com/" />بث مباشر
<option value="http://egyfoox.blogspot.com/" />تحميل برامج

</select></form>

ملاحظة قم بتغير الروابط داخل الكود بما يناسب موقعك
بالتوفيق للجميع

Thursday, July 7, 2011

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

بمناسبة اقتراب شهر رمضان المبارك.
أضافة مميزة الي المواقع و المنتديات و المدونات.
الاضافة مطبقة علي مدونة EgyFoox في الجانب الأيمن من أعلي.

صورة الاداة بعد اضافتها
 

خطوات اضافة الاداة الي موقعك أو مدونتك
  • قم بالدخول الي هذه الصفحة.
  • اضغط علي كلمة INSTALLATION كما في الصورة في الاسفل.
  • بعد ذلك قم بالضغط علي Download the FREE Version
  • بعد ذلك اضغط علي Download FREE Version
  • أو يمكنك تحميلها من هنا وهو عبارة عن ملف Zip
  • قم بفك ضغط الملف و هو باسم originalThin
  • بعد فك الضغط ستجد 6 ملفات قم بفتح الملف المسمي sampleEmbedJavascript.html ببرنامج WordPad أو أي برنامج لتحرير HTML
  • اذا كنت تملك موقع قم برفع الملف OriginalThinMusicPlayer.swf  الي موقعك أما اذا كنت تملك مدونة قم بالدخول علي هذا الرابط  وقم بتسجيل الدخول بحساب جوجل الخاص بك ثم اضغط علي Create New Site و اكتب اسما لموقعك و اكمل البيانات و اضغط علي Create Site  بعد ذلك قم برفع الملف OriginalThinMusicPlayer.swf فيه بحيث يكون رابط الملف مثل هذا https://sites.google.com/site/earnlessons/OriginalThinMusicPlayer.swf .
  • الرابط السابق سيتم وضعه في الكود بدلا من كلمة OriginalThinMusicPlayer.swf
  •  قم بوضع أي رابط Mp3 بدلا من كلمة song.mp3 في الكود وليكن هذا الرابط http://download.quranicaudio.com/quran/muhammad_siddeeq_al-minshaawee/012.mp3
  • بعد ذلك قم بوضع الكود في موقعك أو مدونتك.
  • لاصحاب المدونات يتم وضع الكود عن طريق اضافة أداة java/HTML ثم الحفظ.
الصور

 

الشكل النهائي للكود بعد اضافة التغيرات
<!--
BEGIN JAVASCRIPT PLAYER EMBED CODE
More players and documentation at: www.premiumbeat.com/flash_media_players
-->

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
<div id="player-holder"></div>

<script type="text/javascript">
    var options = {};
    options.mediaPath = "http://download.quranicaudio.com/quran/muhammad_siddeeq_al-minshaawee/012.mp3";
   
    var params = {};
    params.allowScriptAccess = "always";
   
    swfobject.embedSWF("https://sites.google.com/site/earnlessons/OriginalThinMusicPlayer.swf", "player-holder", "250", "21", "9.0.0",false, options, params, {});
</script>

<!-- END PLAYER EMBED CODE -->
اي استفسار اكتب تعليقا بذلك.
بالتوفيق للجميع

    Monday, March 14, 2011

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

    السلام عليكم و رحمة الله و بركاته.
    أهلا بجميع زوار و أعضاء مدونة EarnLessons
    موضوع اليوم عن كيفية اضافة اعلانات في جوانب المدونة مثل الموجودة في مدونتي بدون استخدام أي هاكات و أو تعديل في قالب مدونتك


    الطريقة المستخمة هي باستخدم برنامج Front Page الشهير.
     شكل الاعلان سيكون بهذا الشكل.


    http://lh3.ggpht.com/_PQcPYfGhKuY/TX52C3Wt_JI/AAAAAAAABZQ/iP0DgRqKrlM/ADS%20Code.JPG


    الطريقة:-
    قم بالدخول الي تصميم ثم اضافة أداة ثم HTML/JavaScript

    <div align="center">

    <table border="1" height="217" width="266">
        <tbody><tr>
            <td height="125" width="125">
            <a href="رابط الاعلان 1" target="_blank">
            <img src="رابط صورة الاعلان 1" border="0" height="125" width="125" /></a></td>
            <td height="125" width="125">
            <a href="رابط الاعلان 2" target="_blank">
            <img src="رابط صورة الاعلان 2" border="0" height="125" width="125" /></a></td>
        </tr>
        <tr>
            <td height="125" width="125">
            <a href="رابط الاعلان 3" target="_blank">
            <img src="رابط صورة الاعلان 3" border="0" height="125" width="125" /></a></td>
            <td height="125" width="125">
            <a href="رابط الاعلان 4" target="_blank">
            <img src="رابط صورة الاعلان 4" border="0" height="125" width="125" /></a></td>
        </tr>
    <tr>
            <td height="125" width="125">
            <a href="رابط الاعلان 5" target="_blank">
            <img src="رابط صورة الاعلان 5" border="0" height="125" width="125" /></a></td>
            <td height="125" width="125">
            <a href="رابط الاعلان 6" target="_blank">
            <img src="رابط صورة الاعلان 6" border="0" height="125" width="125" /></a></td>
        </tr>
    </tbody></table>

    </div>

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

    ملاحظات هامة :-
    1- يوضع رابط الموقع المراد الاعلان عنه بدلا من كلمة " رابط الاعلان " في الكود السابق.
    2 - يوضع رابط البنر( صورة الاعلان ) بدلا من كلمة " رابط صورة الاعلان " في الكود السابق.
    3 - عدد الإعلانات التي يمكن عرضها في الكود السبق هي 6 اعلانات فقط. ويمكنك زيادة الاعلانات عن طريق تكرار الكود أو يمكنك   أن تحذف منه ما تشاء.
    4 - مقاس رابط البنر ( الإعلان ) لابد أن يكون 125*125 فقط ليناسب الكود.


    يمكنك أيضا مشاهدة هذا الموضوع أيضا.
    كيفية اضافة اعلاناتك أسفل هيدر المدونة بدون هاكات أو تعديل في قالب المدونة


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

    Saturday, October 9, 2010

    كيفية اضافة أداة مواضيع ذات صلة لمدونات بلوجر

    بسم الله الرحمن الرحيم
    كيفية اضافة أداة مواضيع ذات صلة لمدونات بلوجر
    http://oi51.tinypic.com/1671eys.jpg
    من تصميم ادخل علي تحرير HTML
    ثم توسيع العناصر

    لا تنسي أن تأخد نسخة إحتياطية لمدونتك قبل البدأ 

    اضغط علي (CTRL+F) وابحث عن الكود التالي :
    </head>

     ثم ضع فوقه الكود التالي

    <!--Related Posts with thumbnails Scripts and Styles Start-->
    <!-- remove --><b:if cond='data:blog.pageType == &quot;item&quot;'>
    <style type="text/css">
    #related-posts {
    float:center;
    text-transform:none;
    height:100%;
    min-height:100%;
    padding-top:5px;
    padding-left:5px;
    }

    #related-posts h2{
    font-size: 1.6em;
    font-weight: bold;
    color: black;
    font-family: Georgia, &#8220;Times New Roman&#8221;, Times, serif;
    margin-bottom: 0.75em;
    margin-top: 0em;
    padding-top: 0em;
    }
    #related-posts a{
    color:black;
    }
    #related-posts a:hover{
    color:black;
    }

    #related-posts a:hover {
    background-color:#d4eaf2;
    }
    </style>
    <script type='text/javascript'>
    var defaultnoimage="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjvBuBK7581fH97pl1NqeoonNCLUpSG3rJsygtcH5sJwWEuyfByPyB35AGjyYXuPwS3TEPl32tODMu083nkSdoRQsFdpeCVGvSwxLm2H6kzepcUxojBphpEKz5f0Tq8q0KnAmaO-cYLWk/s400/noimage.png";
    var maxresults=5;
    var splittercolor="#d4eaf2";
    var relatedpoststitle="مواضيع ذات صلة ";
    </script>
    <script src='http://sites.google.com/site/lightbox007/abuiyad/related-posts-with-thumbnails-for-blogger-pro.js.txt' type='text/javascript'/>
    <!-- remove --></b:if>
    <!--Related Posts with thumbnails Scripts and Styles End-->


    بعد ذلك قم  بالبحث عن الكود التالي :

     <div class='post-footer-line post-footer-line-1'>

    ثم قم بوضع الكود التالي تحت الكود السابق

     <!-- Related Posts with Thumbnails Code Start-->
    <!-- remove --><b:if cond='data:blog.pageType == &quot;item&quot;'>
    <div id='related-posts'>
    <b:loop values='data:post.labels' var='label'>
    <b:if cond='data:label.isLast != &quot;true&quot;'>
    </b:if>
    <script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels_thumbs&amp;max-results=6&quot;' type='text/javascript'/></b:loop>
    <script type='text/javascript'>
    removeRelatedDuplicates_thumbs();
    printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);
    </script>
    </div><div style='clear:both'/>
    <!-- remove --></b:if>
    <!-- Related Posts with Thumbnails Code End-->

     بعد ذلك قم بحفظ القالب ومبروك عليك الاضافة
    شكر خاص للأخ أبو اياد

    Friday, October 1, 2010

    أضف الشريط الاخباري لقناة العربية الي مدونتك أو موقعك

    بسم الله الرحمن الرحيم

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

    http://oi52.tinypic.com/2j5xu7s.jpg

    مميزات الشريط الاخباري المتحرك:

    عرض جميع الأخبار الحالية بتحديث مستمر من قناه العربية

    كيفية اضافة الشريط الاخباري

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

     <div width="600"><script src="http://www.alarabiya.net/ara_v_ticker.html"></script></div>

    لأصحاب المواقع والمنتديات

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

    أي استفسار أكتب تعليقا بذلك وسأرد عليك
    دمتم بود

    Wednesday, September 29, 2010

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

    بسم الله الرحمن الرحيم.

    أهلا بجميع زوار ومشتركي مدونة EarnLessons الكرام.
    درس جديد من دروس التدوين والمدونات وهو كيفية اضافاة أعلانات أسفل هيدر المدونة أو المنتدي.
    http://oi51.tinypic.com/mcst40.jpg
    الحل بسيط جدا ولا يحتاج الي أي مجهود 
    ملاحظة :

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

    الطريقة:-
    قم بالدخول الي تصميم ثم اضافة أداة ثم HTML/JavaScript 

     قم بنسخ الكود التالي:-
    <DIV align=center><A   href="1 رابط الاعلان"  target=_blank><IMG height=60   alt="وصف الاعلان 1" src="رابط  الصورة 1" width=150 border=0></A><A   href="رابط الاعلان 2"  target=_blank><IMG height=60   alt="وصف الاعلان 2" src="رابط  الصورة 2" width=150 border=0></A><A   href="رابط الاعلان 3"  target=_blank><IMG height=60   alt="وصف الاعلان 3" src="رابط  الصورة 3" width=150 border=0></A><A   href="رابط الاعلان 4"  target=_blank><IMG height=60   alt="وصف الاعلان 4" src="رابط  الصورة 4" width=150 border=0></A><A   href="رابط الاعلان 5"  target=_blank><IMG height=60   alt="وصف الاعلان 5" src="رابط  الصورة 5" width=150   border=0></A></DIV>

    ملاحظات هامة:-

    قم بنسخ الكود في ملف تكست وقم بالتعديل فيه كما شئت. 
    يمكنكم التحكم الكامل بعدد الاعلانات ( عدد الاعلانات في الكود 5 فقط ) يمكنك زيادة العدد كما شئت.
    يمكنك التحكم بطول وعرض الاعلان عن طريق تغيير القيم 150 - 60 الموجودة في الكود .
     أضف رابط الاعلان مكان كلمة رابط الاعلان في الكود.
    أضف رابط صورة الاعلان في الكود وهكذا.

    أي استفسار أكتب تعليقا بذلك
    دمتم بود

    Saturday, September 25, 2010

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

    بسم الله الرحمن الرحيم

    كيفية اضافة زر أعجبني من فيسبوك لمدونات بلوجر
    الفيسبوك من أهم المواقع علي شبكة الانترنت ويحتل الأن المرتبة الثانية عالميا بعد جوجل في تصنيف ألكسا Alexa
    للضغط علي هذا الزر يجب أن يكون لك حساب علي الفيسبوك كي تتمكن من الضغط عليه
    يمكنك إدراج هذه الأداة تحت كل موضوع أو في أسفل المدونة
    http://oi52.tinypic.com/iglrv6.jpg
    الطريقة الأولي

     من لوح تحكم مدونتك،إختر "تصميم" ،ثم "تحريرHTML " ثم ضع علامة في خانة توسيع قوالب عناصر واجهة المستخدم.
    قم بالبحث عن الكود التالي بالإستعانة بلوحة التحكم (CTRL+F).

     <data:post.body/>

      لإضافة الزر في آخرالمقال ألصق الكود التالي بعدها و ليظهرفي أول التدوينة ألصقه قبلها

     <b:if cond='data:blog.pageType == &quot;item&quot;'> <iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=tahoma&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:450px; height:40px;'/> </b:if>

     او يمكنك أن تضيف الكود السابق بعد الكود التالي
    <div class='post-footer-line post-footer-line-1'>

    يمكنك تغيير نوع الخط tohama لأي خط تحبه

    الطريقة الثانية

    ادراج الكود أسفل المدونة
    قم بالدخول في هذه الصفحة
     ستجد مثل هذه الصورة
    http://oi53.tinypic.com/343qjcn.jpg

     ضع رابط مدونتك في أول خانة من الجدول
    يمكنك تغير قيم الجدول كما تحب
    ثم اضغط علي Get Code

    من تصميم اختار اضافة أداة ثم HTML/JavaScript 
     وقم بنسخ الكود فيه وقم بالحفظ
    يمكنك نقل الأداة وتحريكها لأي مكان في المدونة

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

    أداة مواضيع جديدة مع صورة مصغرة

    بسم الله الرحمن الرحيم
    أهلا بجميع زوار مدونة EarnLessons الكرام
    درس جديد من دروس اضافات بلوجر
    نبدأ علي بركة الله
    كود اخر المواضيع معا عدد التعليقات معا ايقونة الموضوع , الاضافة جميلة وتستطيع استخدامها في عده اماكن في المدونة .. يمكنك عرض مواضيع اي مدونة اخري في مدونتك او العكس , كذلك بالإمكان التعديل علي حجم الاضافة وتعديل علي عدد ظهور المواضيع  
    http://oi55.tinypic.com/2mct9hu.jpg
    اضغط علي تصميم ثم  اضافة أداة ثم HTML/JavaScript 

    اضف هذا الكود
    <script language="JavaScript">

    imgr = new Array();


    imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";

    imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";

    imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";

    imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";

    imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
    showRandomImg = true;

    boxwidth = 298;

    cellspacing = 8;

    borderColor = "#ffffff";

    bgTD = "#000000";

    thumbwidth = 40;

    thumbheight = 40;

    fntsize = 12;

    acolor = "#666";

    aBold = true;

    icon = " ";

    text = "comments";

    showPostDate = false;

    summaryPost = 40;

    summaryFontsize = 10;

    summaryColor = "#666";

    icon2 = " ";

    numposts = 5;


    home_page = "http://earnlessons.blogspot.com/";

    </script>

    <script src="http://myblogtalk.com/bloggertemplates/js/recentposts_thumbnail.js" type="text/javascript"></script>

     التعديلات علي الكود
    ( boxwidth ) للتعديل علي حجم الاضافة  
    ( home_page ) عنوان المدونة
    ( thumbwidth & thumbheight ) العرض و الطول 
    ( fntsize ) حجم العنوان 
    ( acolor ) لون العنوان 
    ( numposts ) عدد المواضيع التي تريد ان تظهر

    ملاحظة
    قم بتغير رابط دونتي برابط مدونتك (earnlessons)
    اذا أردت عرض مواضيع مدونة أخري في مدونتك قم بتبديل رابط مدونتي بالمدونة التي تريد وضعها

    دمتم بود
    أي استفسار أكتب تعليقا وسأرد عليك      

    Sunday, September 19, 2010

    كيفية إضافة إقرأ المزيد او تابع القراءة لمدونات بلوجر

     الناتج النهائي سيكون مثل هذا


    --» قبل تحرير القالب يجب حفظ نسخة احتياطية منه لاستعادتها عند الضرورة.

    1 - الخطوة الأولى: من باب او قائمة " التخطيط" نختار "تحرير Html" و نوسع القالب عبر وضع علامة صح في المربع الصغير أعلى صندوق التحرير و نبحث عن


     </head>
    و مباشرة  فوقها نضع هذا الكود :
    <script type='text/javascript'>var thumbnail_mode = &quot;no-float&quot; ;
    summary_noimg = 500;
    summary_img = 450;
    img_thumb_height = 100;
    img_thumb_width = 120;
    </script>
    <script src='http://sites.google.com/site/simoxisite/Home/read-moreotomatis.js' type='text/javascript'/>

    » شرح الألوان:
    - الأحمر لتعديل طول مقتطف التدوينة التي لا تضم صورا.
    - الأزرق لطول مقتطف التدوينات التي بها صور.
    - الأخضر لتعديل أبعاد المصغرات ( الصور الصغيرة التي تبدو في الرئيسية ).
    - البرتقالي هو رابط ملف الجافاسكريبت يمكن إعادة رفعه و تحرير رابطه.
    ثانيا
    نبحث ( Ctrl+F ) على

    <data:post.body/>
    ونستبدله بالكود التالي:-

    <p><b:if cond='data:blog.pageType != &quot;item&quot;'> <div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div> <script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script> <span class='rmlink' style='float:right;padding-top:20px;'><a expr:href='data:post.url'> ...تابع القراءة</a></span> </b:if> <b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if></p>

    لجعل الصورة إلى جهة اليسار استبدل right ب left في الكود أعلاه .
    و أخيرا احفظ القالب و مبروك عليك!

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

     قم بعمل الأتي
    التخطيط ثم عناصر الصفحة ثم إضافة أداة واختر HTML/JAVASCRIPT


    قم بنسخ هذا الكود :


    <marquee behavior="scroll" direction="left" bgcolor="#99FFFF" onmouseover="this.stop()" onmouseout="this.start()" scrollamount="4">    <a href="url#1">LINK#1</a>  <a href="url#2">LINK#2</a>  <a href="url#3">LINK#3</a>  </marquee>

    قم بالحفظ
    وقم بنقل الاداة الي أي مكان في المدونة

    ملاحظات :

    لإضافة لون للشريط المتحرك قم بتغيير
    bgcolor="#99CCFF"
    لأي لون تحبه
    ------------------
    لتغير اتجاه حركة النص عليك بتغير كلمة left
    direction="left" (يسار)

    direction="right" (يمين)

    direction="up" (أعلى)

    direction="down" (أسفل)
    ---------------------------------
    اذا أردت سرعة أكبر فزد في قيمة scrollamount
    ---------------------------------
    لتغيير لون النص يمكنك ذلك بإضافة
    ضع الكود بأكملة بين 
    <span style=""color:#FF0000"">ضع الكود السابق هنا</span>

    ------------------
    لاضافة الروابط الي الشريط
     ما عليك الا وضع مكان Link#1,Link#2,Link#3 النص المراد أن يظهر و مكان url#1,url#2 و url#3 العناوين أو الروابط للنصوص التي اخترتها .
    -----------------
    ومبروك عليك الاضافة
    أي استفسار أكتب تعليقا أسفل الموضوع وسنرد عليك

    Thursday, September 16, 2010

    هاك حذف الأرقام من أقسام مدونات بلوجر

     





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

    لوحة التحكم نتوجه إلى باب "التصميم" ثم "تحرير Html"
    --» قبل تحرير القالب يجب حفظ نسخة احتياطية منه لاستعادتها عند الضرورة.
    ثم نبحث عن الكود التالي :

    data:label.count

    ثم نمسح الكود المحدد في الصورة التالية و الموجود بين وسمي span



    بعد ذلك احفظ القالب

    Tuesday, September 14, 2010

    كيفية ترقيم صفحات المدونة - خاص ببلوجر

    طريقة رائعة جدا لترقيم صفحات مدونتك الالكترونية مثل الصورة التالية . هذه الطريقة تسهل علي الزوار تتبع مواضيعك في المدونة بكل سهولة ويسر
    كيفية اضافة الأداة:-
    1. اذهب الى التخطيط  Layout
    2. عناصر الصفحة  Page Elements
    3.اضافة اداة  Add a Gadget
    4. HTML/JavaScript
    5. انسخ الكودCode HTML التالي :

    ستظهر الصفحات مثل هذا المثال


    الكود :

    <style>
    .showpageArea a {
    text-decoration:underline;
    }
    .showpageNum a {
    text-decoration:none;
    border: 1px solid #ccc;
    margin:0 3px;
    padding:3px;
    }
    .showpageNum a:hover {
    border: 1px solid #ccc;
    background-color:#ccc;
    }
    .showpagePoint {
    color:#333;
    text-decoration:none;
    border: 1px solid #ccc;
    background: #ccc;
    margin:0 3px;
    padding:3px;
    }
    .showpageOf {
    text-decoration:none;
    padding:3px;
    margin: 0 3px 0 0;
    }
    .showpage a {
    text-decoration:none;
    border: 1px solid #ccc;
    padding:3px;
    }
    .showpage a:hover {
    text-decoration:none;
    }
    .showpageNum a:link,.showpage a:link {
    text-decoration:none;
    color:#333;
    }

    </style>



    <script type="text/javascript">

    function showpageCount(json) {
    var thisUrl = location.href;
    var htmlMap = new Array();
    var isFirstPage = thisUrl.substring(thisUrl.length-14,thisUrl.length)==".blogspot.com/";
    var isLablePage = thisUrl.indexOf("/search/label/")!=-1;
    var isPage = thisUrl.indexOf("/search?updated")!=-1;
    var thisLable = isLablePage ? thisUrl.substr(thisUrl.indexOf("/search/label/")+14,thisUrl.length) : "";
    thisLable = thisLable.indexOf("?")!=-1 ? thisLable.substr(0,thisLable.indexOf("?")) : thisLable;
    var thisNum = 1;
    var postNum=1;
    var itemCount = 0;
    var fFlag = 0;
    var eFlag = 0;
    var html= '';
    var upPageHtml ='';
    var downPageHtml ='';


    var pageCount=5;
    var displayPageNum=3;
    var firstPageWord = 'First';
    var endPageWord = 'Last';
    var upPageWord ='Previous';
    var downPageWord ='Next';



    var labelHtml = '<span class="showpageNum"><a href="/search/label/'+thisLable+'?&max-results='+pageCount+'">';

    for(var i=0, post; post = json.feed.entry[i]; i++) {
    var timestamp = post.published.$t.substr(0,10);
    var title = post.title.$t;
    if(isLablePage){
    if(title!=''){
    if(post.category){
    for(var c=0, post_category; post_category = post.category[c]; c++) {
    if(encodeURIComponent(post_category.term)==thisLable){
    if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
    if(thisUrl.indexOf(timestamp)!=-1 ){
    thisNum = postNum;
    }

    postNum++;
    htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;
    }
    }
    }
    }//end if(post.category){

    itemCount++;
    }

    }else{
    if(title!=''){
    if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
    if(thisUrl.indexOf(timestamp)!=-1 ){
    thisNum = postNum;
    }

    if(title!='') postNum++;
    htmlMap[htmlMap.length] = '/search?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;
    }
    }
    itemCount++;
    }
    }

    for(var p =0;p< htmlMap.length;p++){
    if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
    if(fFlag ==0 && p == thisNum-2){
    if(thisNum==2){
    if(isLablePage){
    upPageHtml = labelHtml + upPageWord +'</a></span>';
    }else{
    upPageHtml = '<span class="showpage"><a href="/">'+ upPageWord +'</a></span>';
    }
    }else{
    upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';
    }

    fFlag++;
    }

    if(p==(thisNum-1)){
    html += '&nbsp;<span class="showpagePoint"><u>'+thisNum+'</u></span>';
    }else{
    if(p==0){
    if(isLablePage){
    html = labelHtml+'1</a></span>';
    }else{
    html += '<span class="showpageNum"><a href="/">1</a></span>';
    }
    }else{
    html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +' </a></span>';
    }
    }

    if(eFlag ==0 && p == thisNum){
    downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';
    eFlag++;
    }
    }//end if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
    }//end for(var p =0;p< htmlMap.length;p++){

    if(thisNum>1){
    if(!isLablePage){
    html = '<span class="showpage"><a href="/">'+ firstPageWord +' </a></span>'+upPageHtml+' '+html +' ';
    }else{
    html = ''+labelHtml + firstPageWord +' </a></span>'+upPageHtml+' '+html +' ';
    }
    }

    html = '<div class="showpageArea"><span style="padding: 2px 4px 2px 4px;margin: 2px 2px 2px 2px;border: 1px solid #333; background-" class="showpage">Page '+thisNum+' of '+(postNum-1)+': </span>'+html;

    if(thisNum<(postNum-1)){
    html += downPageHtml;
    html += '<span class="showpage"><a href="'+htmlMap[htmlMap.length-1]+'"> '+endPageWord+'</a></span>';
    }

    if(postNum==1) postNum++;
    html += '</div>';

    if(isPage || isFirstPage || isLablePage){
    var pageArea = document.getElementsByName("pageArea");
    var blogPager = document.getElementById("blog-pager");

    if(postNum <= 2){
    html ='';
    }

    for(var p =0;p< pageArea.length;p++){
    pageArea[p].innerHTML = html;
    }

    if(pageArea&&pageArea.length>0){
    html ='';
    }

    if(blogPager){
    blogPager.innerHTML = html;
    }
    }

    }
    </script>

    <script src="/feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" type="text/javascript"></script>
    <div style="text-align:right;font-size:10px;color:000000;margin-top:15px;display:none;"> <a href="http://www.techieblogger.com/2008/07/page-navigation-hack-for-blogger.htm">Grab this Widget ~ Blogger Accessories</a></div>

    -------------------------

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

    أي استفسار أنا متواجد
    فقط أكتب تعليقا بذلك وسنرد عليك فورا
    بالتوفيق للجميع

    Sunday, September 12, 2010

    كيفية فتح الراوبط الخارجية في صفحة جديدة



    أفضل الطرق فلن تكون مضطرا لتعديل كل الروابط في المدونة ولن تسبب إزعاجا للزائر عدا عن بساطتها وسهولة تطبيقها، فقط كل ما عليك فعله هو إضافة كود جي كويري jQuery حيث يقوم بتفحص جميع الروابط الخارجية الموجودة في الصفحة وإضافة target=_blank لها بشكل تلقائي و يمكنك تركيبها كالآتي.
    من لوح تحكم مدونتك توجه إلى صفحة التصميم ثم تحرير Html.
    نبحث ( Ctrl+F ) عن</body> ونضيف هذا الكود فوقه مباشرة .
    ملاحظة : إن كنت تستعمل مكتبة جي كويري في موقعك او مدونتك فلا داع لإضافة أول سطرين من الكود. و اكتف بما بعده.

    الكود :
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    <script type="text/javascript">
    //<![CDATA[
    jQuery('a').each(function() {
    // Let's make external links open in a new window.
    var href = jQuery(this).attr('href');

    if (typeof href != 'undefined' && href != "" && (href.indexOf('http://') != -1 || href.indexOf('https://') != -1) && href.indexOf(window.location.hostname) == -1) {
    jQuery(this).attr("target", "_blank");
    }
    });
    //]]>
    </script>

    و أخيرا نضغط على زر حفظ القالب.
     

    beautiful scenery/2012 © 2006 is Designed by Yuril