مجموعة إضافات بلوجر لشهر رمضان المبارك

بسم الله الرحمن الرحيم، والصلاة والسلام على أشرف الخلق وخاتم المرسلين، وعلى آله وصحبه أجمعين.

قبل البدء بالمقال أحب أن أقول لكم: رمضان كريم، أعاده الله علينا جميعاً بالخير و الرزق و البركة و الصحة و العفو و العافية،

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

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

:: طريقة تركيب جميع الإضافات ::

إدخل إلى لوحة تحكم بلوجر ومن ثم اختار المدونة التي تريد وضع الإضافة بها، ومن ثم اضغط على زر التخطيط.

والآن قم بالضغط على زر إضافة أداة (في أي مكان لا يهم، لأنه بالنهاية الإضافة ستظهر بمكان آخر).

ومن ثم إختار أداة HTML/JavaScript.

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

:: الإضافة الأولى ::

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

كود الإضافة:

<!--  Ramadan Lantern By MyBloggerLab.com - Ma3refh.blogspot.com --><div align="center"><table border="0" width="900" cellspacing="0" cellpadding="0"><tr>
<td width="900" height="263"><div style="float:top right; position:absolute; overflow:visible; left:45px; top:0px; height:192px; width:144px z-index: 9999;">
<object classid="clsid:D27CDB6E-AE6D-11CF-96B8-444553540000" id="obj2" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" border="0" width="192" height="144"><param name="movie" value="http://mybloggerlab.com/Scripts/stardima.swf"/><param name="quality" value="High"/><param name="wmode" value="transparent"/><embed src="http://mybloggerlab.com/Scripts/stardima.swf" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" name="obj2" width="192" height="144" quality="High" wmode="transparent"></embed></object></div></td></tr></table></div>

:: الإضافة الثانية :: 

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

كود الإضافة:

<!--Ramadan Plug - Ma3refh.blogspot.com START -->   <div style="float:left;position:absolute;left:0px;top:0px"> <img src="http://upload.traidnt.net/upfiles/njq43325.gif" alt="رمضان كريم"/>   </div> <!--Ma3refh.blogspot.com END --> <!--Ma3refh.blogspot.com START -->   <div style="float:left;position:absolute;left:0px;top:82px"> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgeDAEwSilvgAb7gQmFkhi_FZk0pmyqrH69Oa8PmgiEP_TJ13wBVYzu-8X_5MKa9ZQEj2fbOVENIlig80JtV8Rt1uRn9Ubvf7xTqcbhe1cWcbSVC8MOwhpxZjK4FvB76wxsyngXLdiIr6M/s1600/fan-3.png" width="50,height="100" alt="رمضان كريم" title="رمضان مبارك سعيد" border="0"/>  </div> <!--Ma3refh.blogspot.com END --> <!--Ma3refh.blogspot.com START -->   <div style="float:left;position:absolute;left:0px;top:230px"> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhldF5qrv6xNbCXBmCtjJnQ2esN6I0kaOFFl0UvF7Mk5QDXJ2tjNBBG0wig9kEXDM9OrvFq0quxExzlgXGopMyz2Tjk1RRyMOCIEN71y7C6W4PGlnYLQphGy-Y7vya35SCBl0LDbEN-poc/s1600/fan-2.png" width="50,height="100" alt="رمضان كريم" title="رمضان مبارك سعيد" border="0"/> </div> <!--Ma3refh.blogspot.com END -->

:: الإضافة الثالثة ::

إضافة كلمة رمضان كريم في أسفل المدونة وهي مناسبة لمن لا يريدون الإضافات الملونة مثلاً.

كود الإضافة:

<!-- START --> <div style="float:left;position:absolute;left:0px;top:0px"><img src="http://upload.traidnt.net/upfiles/njq43325.gif" alt="رمضان مبارك"/> </div><!-- END -->

رمضان كريم و شهر مبارك مليء بالسعادة والخير والرزق الوفير للجميع إن شاء الله ...

اقرأ باقي الموضوع »

طريقة اضافة اداة معلومات جهاز و ip الزائر لمدونات بلوجر

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

طبعاً اذا دخلت على الرابط فستتفاجئ بعرض نظام جهازك الخاص ( الويندوز ) و علم بلدك و اسمها و رقم الآي بي الخاص بك و نوع المتصفح الذي تزور الموقع باستخدامه ! لكن لا داعي للقلق فانت الوحيد المطلع عليها و الذي بامكانه رؤيتها ^_^ وخير الكلام ما قل و دل فلنبدأ بالشرح و طريقة التركيب على الموقع ..

ادخل على لوحة تحكم المدونة المراد تركيب الإضافة بها..

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

ثم قم بالضغط على تبويب HTML

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

 أما اذا كنت تريد اضافته للقالب فقم بالبحث عن :

<data:post.body/>

ثم قم باضافة الكود الآتي بعدها مباشرتاً لكي يظهر أسفل كل موضوع في المدونة

<p><span style="text-align:center; display: block;"><a href="http://ma3refh.blogspot.com/p/blog-page_3861.html"><img src="http://www.wieistmeineip.de/ip-address/?size=468x60" border="0" width="468" height="60" alt="IP" /></a><br /><small><a href="http://ma3refh.blogspot.com/p/blog-page_3861.html"></a></small></span></p>

وسيكون حجم الاضافة كالآتي :

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

ادخل الى تخطيط ثم اضافة اداة في المكان المراد وضع الاضافة به ثم قم بلصق الكود التالي ( يختلف عن الكود السابق )

<p><span style="text-align:center; display: block;"><a href="http://ma3refh.blogspot.com/p/blog-page_3861.html"><img src="http://www.wieistmeineip.de/ip-address/" border="0" width="125" height="125" alt="IP" /></a><br /><small><a href="http://ma3refh.blogspot.com/p/blog-page_3861.html"></a></small></span></p>

و سيكون حجم الإضافة كالآتي :

تم بحمد الله

اقرأ باقي الموضوع »

اضافة كود الألوان بلوجر

السلام عليكم ,, اليوم سنتعرف على طريقة اضافة كود الوان بلوجر ,, 

لرؤية مثال اضغط هنا

اولاً نقوم بالدخول للوحة تحكم المدونة المراد وضع كود الألوان بها ,,

ثم نقوم بالضغط على خيار الصفحات الموجود على يمين الصفحة 

 ومن ثم نقوم بعمل إضافة صفحة جديدة ونختار الخيار صفحة فارغة

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

:: الكود :: 


<div dir="rtl" style="text-align: right;" trbidi="on"> <center>
<object1 border="1" classid="clsid:D27CDB6E-AE6D-11CF-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" height="480" id="obj1" width="480"> <embed height="420" name="obj1" pluginspage="http://www.macromedia.com/go/getflashplayer" quality="High" src="http://www.2createawebsite.com/build/color.swf" type="application/x-shockwave-flash" width="420"></embed> </object1></center>
</div>

  وألف مبروك تركيب الإضافة الجديدة ^_^

اقرأ باقي الموضوع »

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

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

كل ما عليك هو ان تقوم بالتالي ~

1. الدخول الى لوحة تحكم المدونة
2. الضغط على زر التخطيط
3. اضافة اداة HTML/Javascript
4. نسخ الكود التالي بها :: 
  

<style>
img,a {
   border: 0;
}

#on {
   visibility: visible;
}

#off {
   visibility: hidden;
}

#facebook_div {
   width: 196px;
   height: 340px;
   overflow: hidden;
}

#twitter_div {
   width: 246px;
   height: 353px;
   overflow: hidden;
}

#google_plus_div {
   width: 152px;
   height: 97px;
   overflow: hidden;
   margin-left: 50px;
   margin-top: 10px;
}

#knfeedburner_div {
   width: 300px;
   height: 97px;
   overflow: hidden;
   margin-top: 5px;
   margin-left: -4px;
}

#kakinetwork_div {
   width: 300px;
   height: 97px;
   overflow: hidden;
}/* right side style */#facebook_right {
   z-index: 10005;
   border: 2px solid #3c95d9;
   background-color: #fff;
   width: 196px;
   height: 353px;
   position: fixed;
   right: -200px;
}

#facebook_right img {
   position: absolute;
   top: -2px;
   left: -35px;
}

#facebook_right iframe {
   border: 0px solid #3c95d9;
   overflow: hidden;
   position: static;
   height: 360px;
   left: -2px;
   top: -3px;
}

#twitter_right {
   z-index: 10004;
   border: 2px solid #6CC5FF;
   background-color: #6CC5FF;
   width: 246px;
   height: 353px;
   position: fixed;
   right: -250px;
}

#twitter_right_img {
   position: absolute;
   top: -2px;
   left: -35px;
   border: 0;
}

#google_plus_right {
   z-index: 10003;
   background-color: #F2F2F2;
   border: 2px solid #006ec9;
   border-top: 2px solid #0056a0;
   border-bottom: 2px solid #0056a0;
   border-right: 2px solid #0056a0;
   border-left: hidden;
   width: 152px;
   height: 97px;
   position: fixed;
   right: -154px;
}

#google_plus_right_img {
   position: absolute;
   top: -2px;
   left: -33px;
   border: 0;
}

#feedburner_right {
   z-index: 10003;
   background-color: #fefefe;
   border: 2px solid #5b5b5b;
   border-top: 2px solid #5b5b5b;
   border-bottom: 2px solid #5b5b5b;
   border-right: 2px solid #5b5b5b;
   border-left: hidden;
   width: 300px;
   height: 97px;
   position: fixed;
   right: -303px;
}

#feedburner_right_img {
   position: absolute;
   top: -2px;
   left: -33px;
   border: 0;
}

#kakinetwork_right {
   z-index: 10003;
   border: 2px solid #303030;
   background-color: #fff;
   width: 300px;
   height: 97px;
   position: fixed;
}

#kakinetwork_right img {
   position: absolute;
   top: -2px;
   left: -101px;
}/* left side style */#facebook_left {
   z-index: 10005;
   border: 2px solid #3c95d9;
   background-color: #fff;
   width: 196px;
   height: 353px;
   position: fixed;
   left: -200px;
}

#facebook_left img {
   position: absolute;
   top: -2px;
   right: -35px;
}

#facebook_left iframe {
   border: 0px solid #3c95d9;
   overflow: hidden;
   position: static;
   height: 360px;
   right: -2px;
   top: -3px;
}

#twitter_left {
   z-index: 10004;
   border: 2px solid #6CC5FF;
   background-color: #6CC5FF;
   width: 246px;
   height: 353px;
   position: fixed;
   left: -250px;
}

#twitter_left_img {
   position: absolute;
   top: -2px;
   right: -35px;
   border: 0;
}

#google_plus_left {
   z-index: 10003;
   background-color: #006ec9;
   border: 2px solid #006ec9;
   border-top: 2px solid #0056a0;
   border-bottom: 2px solid #0056a0;
   border-left: 2px solid #0056a0;
   border-right: hidden;
   width: 152px;
   height: 97px;
   position: fixed;
   left: -154px;
}

#google_plus_left_img {
   position: absolute;
   top: -2px;
   right: -33px;
   border: 0;
}

#feedburner_left {
   z-index: 10003;
   background-color: #fefefe;
   border: 2px solid #5b5b5b;
   border-top: 2px solid #5b5b5b;
   border-bottom: 2px solid #5b5b5b;
   border-left: 2px solid #5b5b5b;
   border-right: hidden;
   width: 300px;
   height: 97px;
   position: fixed;
   left: -303px;
}

#feedburner_left_img {
   position: absolute;
   top: -2px;
   right: -33px;
   border: 0;
}

#kakinetwork_left {
   z-index: 10003;
   border: 2px solid #303030;
   background-color: #fff;
   width: 300px;
   height: 97px;
   position: fixed;
}

#kakinetwork_left img {
   position: absolute;
   top: -2px;
   right: -101px;
}

.box-title1 {
   border: 1px solid #ddd;
/*border-radius*/
   -webkit-border-radius: 6px;
   -moz-border-radius: 6px;
   border-radius: 6px;
/*box-shadow*/
   -webkit-box-shadow: 5px 5px 5px #CCCCCC;
   -moz-box-shadow: 5px 5px 5px #CCCCCC;
   box-shadow: 5px 5px 5px #CCCCCC;
   padding: 10px;
   margin: 10px 0;
}

.enteryouremail {
   background: #fff !important;
   border: 1px solid #d2d2d2;
   padding: 0px 8px 0px 8px;
   color: #a19999;
   font-size: 12px;
   height: 25px;
   width: 165px;
/*border-radius*/
   -webkit-border-radius: 5px;
   -moz-border-radius: 5px;
   border-radius: 5px;
   margin: 0px;
}

.submitbutton {
   background: #F2F2F2;
   border: 1px solid #F66303;
/*box-shadow*/
   -webkit-box-shadow: 3px 3px 3px #666;
   box-shadow: 3px 3px 3px #666;
   font: bold 12px Arial, sans-serif;
   color: #000000;
   height: 25px;
   padding: 0 12px 0 12px;
   margin: 0 0 0 5px;
/*border-radius*/
   -webkit-border-radius: 5px;
   border-radius: 5px;
   cursor: pointer;
}
</style><script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script><br />
<br />
<script type="text/javascript" src="http://apis.google.com/js/plusone.js"></script><br />
<br />
<script type="text/javascript">jQuery(document).ready(function(){ jQuery("#facebook_right").hover(function(){ jQuery(this).stop(true,false).animate({right: 0}, 500); },function(){ jQuery("#facebook_right").stop(true,false).animate({right: -200}, 500); }); jQuery("#twitter_right").hover(function(){ jQuery(this).stop(true,false).animate({right: 0}, 500); },function(){ jQuery("#twitter_right").stop(true,false).animate({right: -250}, 500); }); jQuery("#google_plus_right").hover(function(){ jQuery(this).stop(true,false).animate({right: 0}, 500); },function(){ jQuery("#google_plus_right").stop(true,false).animate({right: -154}, 500); }); jQuery("#feedburner_right").hover(function(){ jQuery(this).stop(true,false).animate({right: 0}, 500); },function(){ jQuery("#feedburner_right").stop(true,false).animate({right: -303}, 500); }); });</script><br />
<br />
<div id="on"><div id="facebook_right" style="top: 18%;"><div id="facebook_div"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjewGz42zyGKTo6NB2Yx3WttwtX8-somCkeEj6nUZ21Mp0ct8RScSbP_m7HN6nMAGfW2vOtHQW02LtIxELh7oke_KTdo-HzNOK9RGbjTO5i9zAtrYoX9_-lMIm5S75a4C-P6hg-wR8BSa8/s1600/helperblogger.com-facebook-icon.png" alt=""/><br />
<br />
<iframe src="//www.facebook.com/plugins/likebox.php?href=ضع هنا رابط الفيس بوك الخاص بك&width=200&height=346&colorscheme=light&show_faces=true&border_color&stream=false&header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:200px; height:346px;" allowtransparency="true"><br />
<br />
</iframe><br />
<br />
</div></div></div><br />
<br />

 

 ولا تنسى وضع رابط صفحة الفيسبوك الخاصة بك في المكان المكتوب فيه ضع هنا رابط الفيسبوك الخاص بك ..

ومبروك عليكم الاضافة !

اقرأ باقي الموضوع »

طريقة عمل أجمل شكل لتعليقات بلوجر

السلام عليكم

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

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

ونقوم بحفظ الاعدادات 

والآن نقوم بالدخول الى تبويبة القالب ونقوم بالضغط على تحرير HTML و نقوم بتوسيع القوالب و من ثم نقوم بالبحث عن الكود التالي و قد تجد اكثر من واحد و يجب استبدالهم جميعاً

<b:include data='post' name='comments'/>

و نقوم باستبدالها جميعها بالكود التالي 

<b:if cond='data:post.showThreadedComments'>
<b:include data='post' name='threaded_comments'/>
<b:else/>
<b:include data='post' name='comments'/></b:if> 

 والآن نقوم بالبحث مره أخرى عن الكود الآتي 

]]></b:skin>

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

.comments {
clear: both;
margin-top: 10px;
margin-bottom: 0px;
line-height: 1em;
}
.comments .comments-content {
font-size: 14px;
margin-bottom: 16px;
font-family: Verdana;
font-weight: normal;
text-align:right;
line-height: 1.4em;
}
.comments .continue a, .comments .comment .comment-actions a {
display:inline;
font-family:Arial, Helvetica, sans-serif;
font-size:13px;
padding: 2px 5px;
text-decoration: none;
text-shadow:0 1px 1px rgba(0,0,0,.3);
color:#FFF;
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
box-shadow: 0 1px 2px rgba(0,0,0,.2);
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
margin-right: 10px;
border: 1px solid #3079ED;
background: #0066FF;
background: -webkit-gradient(linear, left top, left bottom, from(#0099FF), to(#009999));
background: -moz-linear-gradient(top, #0099FF, #009999);
filter: progid:DXImageTransform.Microsoft.gradient(startCo lorstr='#0099FF', endColorstr='#009999');
}
.comments .continue a:hover, .comments .comment .comment-actions a:hover {
text-decoration: none;
background:#0099FF;
background: -webkit-gradient(linear, left top, left bottom, from(#009999), to(#0099FF));
background: -moz-linear-gradient(top, #009999, #0099FF);
filter: progid:DXImageTransform.Microsoft.gradient(startCo lorstr='#009999', endColorstr='#0099FF');
}
.comments .continue a:active, .comments .comment .comment-actions a:active {
position: relative;
top:1px;
background: -webkit-gradient(linear, left top, left bottom, from(#0066FF), to(#0099CC));
background: -moz-linear-gradient(top, #0066FF, #0099CC);
filter: progid:DXImageTransform.Microsoft.gradient(startCo lorstr='#0066FF', endColorstr='#0099CC');
}
.comments .comments-content .comment-thread ol {
list-style-type: none;
padding: 0;
text-align: none;
}
.comments .comments-content .inline-thread {
padding: 0.5em 1em 0 1em;
}
.comments .comments-content .comment-thread {
margin: 8px 0px 0px 0px;
}
.comments .comments-content .comment-thread:empty {
display: none;
}
.comments .comments-content .comment-replies {
margin-top: 1em;
margin-left: 40px; font-size:12px;
}
.comments .comments-content .comment {
padding-bottom:8px;
margin-bottom: 0px
}
.comments .comments-content .comment:first-child {
padding-top:16px;
}
.comments .comments-content .comment:last-child {
border-bottom:0;
padding-bottom:0;
}
.comments .comments-content .comment-body {
position:relative;
}
.comments .comments-content .user {
font-style:normal;
font-weight:bold;
}
.comments .comments-content .user a {
color: #444;
}
.comments .comments-content .user a:hover {
text-decoration: none;
color: #555;
}
.comments .comments-content .icon.blog-author {
width: 18px;
height: 18px;
display: inline-block;
margin: 0 0 6px -4px;
}
.comments .comments-content .datetime {
margin-left:6px;
color: #999;
font-style: italic;
font-size: 12px;
float: left;
}
.comments .comments-content .comment-content {
font-family: Arial, sans-serif;
font-size: 15px;
line-height: 19px;
}
.comments .comments-content .comment-content {
font-family: Arial, sans-serif;
font-size: 15px;
line-height: 19px;
text-align:none;
margin: 15px 0 15px;
}
.comments .comments-content .owner-actions {
position:absolute;
right:0;
top:0;
}
.comments .comments-replybox {
border: none;
height: 250px;
width: 100%;
}
.comments .comment-replybox-single {
margin-top: 5px;
margin-left: 48px;
}
.comments .comment-replybox-thread {
margin-top: 5px;
}
.comments .comments-content .loadmore a {
display: block;
padding: 10px 16px;
text-align: center;
}
.comments .thread-toggle {
cursor: pointer;
display: inline-block;
}
.comments .comments-content .loadmore {
cursor: pointer;
max-height: 3em;
margin-top: 3em;
}
.comments .comments-content .loadmore.loaded {
max-height: 0px;
opacity: 0;
overflow: hidden;
}
.comments .thread-chrome.thread-collapsed {
display: none;
}
.comments .thread-toggle {
display: inline-block;
}
.comments .thread-toggle .thread-arrow {
display: inline-block;
height: 6px;
width: 7px;
overflow: visible;
margin: 0.3em;
padding-right: 4px;
}
.comments .thread-expanded .thread-arrow {
background:  url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAc  AAAAHCAYAAADEUlfTAAAAG0lEQVR42mNgwAfKy8v/48I4FeA0AacVDFQBAP9wJkE/KhUMAAAAAElFTkSuQmCC")  no-repeat scroll 0 0 transparent;
}
.comments .thread-collapsed .thread-arrow {
background:  url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA  AcAAAAHCAYAAADEUlfTAAAAJUlEQVR42mNgAILy8vL/DLgASBKnApgkVgXIkhgKiNKJ005s4gDLbCZBiSxfygAAAAB  JRU5ErkJggg==") no-repeat scroll 0 0 transparent;
}
.comments .avatar-image-container {
float: right;
overflow: hidden;
}
.comments .avatar-image-container img {
width: 36px;
}
.comments .comment-block {
margin-right: 48px;
position: relative;
padding: 20px 15px 20px 15px;
background: #F7F7F7;
border: 1px solid #E4E4E4;
overflow: hidden;
border-radius: 4px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-image: initial;
}

ومبروك عليك ^_^ الآن نظام التعليقات في مدونتك نفس نظام التعليقات الموجود في مدونتي .. في أمان الله

اقرأ باقي الموضوع »

كيفية اضافة فانوس رمضان لمدونة بلوجر

السلام عليكم ورحمة الله وبركاته

 اليوم ان شاء الله سأقوم بسرد طريقة اضافة فانوس رمضان إلى مدونات بلوجر

والفانوس فلاشي يتحرك فوق المدونة على اليسار ويضيف لمسة جمالية للمدونة

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

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

ونبدأ باسم الله ,, أولاً ندخل للوحة تحكم المدونة ثم ندخل إلى التخطيط و نقوم بإضافة اداة في اي مكان فالصفحة لا تفرق

ونقوم باختيار الاداة HTML و نقوم باضافة الكود الآتي :~

======================================================
<!--  Ramadan Lantern By MyBloggerLab.com - Ma3refh.blogspot.com -->
<div align="center">
<table border="0" width="900" cellspacing="0" cellpadding="0">
<tr>

<td width="900" height="263">
<div style="float:top right; position:absolute; overflow:visible; left:45px; top:0px; height:192px; width:144px z-index: 9999;">

<object classid="clsid:D27CDB6E-AE6D-11CF-96B8-444553540000" id="obj2" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" border="0" width="192" height="144"><param name="movie" value="http://mybloggerlab.com/Scripts/stardima.swf"/><param name="quality" value="High"/><param name="wmode" value="transparent"/><embed src="http://mybloggerlab.com/Scripts/stardima.swf" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" name="obj2" width="192" height="144" quality="High" wmode="transparent"></embed></object>
</div>
</td>
</tr>
</table>
</div>
=============================================================

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

اقرأ باقي الموضوع »

طريقة عمل موقع تعريف شخصي خاص بك مجانا

السلام عليكم ورحمة الله وبركاته

اليوم سأقوم بشرح تفصيلي لكيفية عمل موقع تعريف شخصي مجاني مثل هوية الكترونية وممكن استخدامها كصفحة من نحن كما افعل أنا في مدونة المعرفة :)  اضغط هنا لرؤية مثال حي

قبل البدء يجب تحميل الملف الآتي :: اضغط هنا

الخطوة الأولى هي التسجيل في جوجل واذا لا كنت تعرف الطريقة اتفضل //

اضغط هنا

ثم قم بتعبئة المعلومات و اضغط على الخطوة التاليه وأكمل حتى النهاية وانتهينا ^_^

الخطوة الثانية هي التسجيل في بلوجر من خلال الضغط هنا و الضغط على متابعة إلى Blogger

الخطوة الثالثة تضغط على مدونة جديدة

الخطوة الرابعة نضع اسم النموذج أي اسم المدونة ولتكن مثلاً من نحن و نضع العنوان أي رابط المدونة مثل ma3refh.blogspot.com  ثم نضغط على إنشاء المدونة

الخطوة الخامسة ( مصورة )

ثم نختار قالب 

الخطوة السادسة ( مصورة )

 

حالياً يجب تكون النتيجة التي ظهرت معك مثل موقع من نحن انقر هنا للمعاينة

مبروك عليكم موقع التعريف الشخصي لكــن لم ننتهي بعد

لأن المعلومات خاصة بي و يجب تغييرها و الطريقة كالآتي

نبحث بالضغط على زر Ctrl مع زر الحرف F في نفس الوقت فيظهر صندوق البحث

ونبحث عن محمود النواس و تضغ بدلاًُ منه اسمك

ثم نبحث عن مدون و مطور و مصمم مواقع على الإنترنت ونضع بدلاً منها معلومات خاصة بك او بعملك

ثم تجد أسفلها كلمة مدونة المعرفة تغيرها لإسم موقعك و موقع العاب بنات لإسم موقعك الآخر و الايميل الخاص بي لإيميلك الشخصي مع تغيير العناوين ( Links ) 

ومن ثم نقوم بتغيير الصورة الشخصية بتغيير رابط صورتي ابحث عن الآتي ::

 https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjakwWHlJdaALFQ-qxOTDovsNFWeA9eik6U1p7AmvimJw3qbKqzP9Ph3i3Hkn230KpaGP4d38zO_IM1amnkhM6stB2R7Qo86E-wVBDNW2gLHUQCvr2CgEyhMbbh3LHJ-r9dwBY0hehAqA/s1600/Untitlegggggd-1.png

ثم قم بتغييره الى رابط صورتك الشخصية الخاصة بك 

و تغيير روابط الجوجل و اليوتيوب و التويتر عن طريق البحث عن الروابط الآتيه وتغييرها للروابط الخاصة بك

http://www.youtube.com/elyb7boglbak

http://twitter.com/MrNawas

https://plus.google.com/u/0/109595971586157833431/posts

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

السلام عليكم

اقرأ باقي الموضوع »

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

السلام عليكم ورحمة الله و بركاته

اليوم إخواني الكرام سنتحدث عن كيفية تهيئة مدونتك لتصبح معشوقة محركات البحث و تتصدر المراتب الأولى في أشهر محركات البحث مثل Google و Bing و yahoo وغيرها .. 

بسم الله نبدأ ..

لوحة التحكم الرئيسية ومن بعدها الي التخطيط وبعدها الي تحريرHTML ثم نوسع القالب وبعدها نبحث عن :

<title><data:blog.pageTitle/></title>

نمسحها ونضع مكانها :

<b:if cond='data:blog.pageType == &quot;index&quot;'> <title><data:blog.title/></title> <b:else/> <title><data:blog.pageName/> | <data:blog.title/></title> </b:if> 

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

<head>

ثم نضع بعده مباشرتاً ( ملاحظه // اذا وجدت الأكواد عدلها فقط ولا تضفها مره أخرى ) :

<meta content='العنوان' name='title'/>
<meta content='الوصف' name='description'/>
<meta content='كلمات مفتاحية' name='keywords'/>   

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

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

اقرأ باقي الموضوع »

أضف خدمة محول أكواد بلوجر لمدونتك

السلام عليكم ورحمة الله و بركاته 

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

مثال على النتيجة النهائية

المهم نبدأ في طريفة التركيب دون إطالة أكثر من هكذا ,,

وكما يقول محترفي التدوين ( الصورة تعبر عن ألف كلمة )

ولأعبر لحضراتكم عن آلاف الكلمات بصورة

قلت أعمل الشرح مصور لتسهيل العملية ,,

أولاً ندخل للوحة تحكم بلوجر ثم نضغط على قائمة الصفحات وأكمل مع الصور ,,

بعد ذلك ولا أقولك ,, كمل مع الصور أسهلك ههههه

مثل ماهو موضح 1 عنوان الصفحه و 2 الكود الموجود بالأسفل ثم نضغط على نشر

:: كود صفحة محول الأكواد :: 

<style type="text/css">
.cbt{text-align:center;display:block; Width:200px; margin-top:10px;color:#000;background: #DAD8D9;background: -moz-linear-gradient(top,  #F0F0F0 , #DAD8D9 );background: -webkit-linear-gradient(top,  #F0F0F0 ,#DAD8D9 );font-size:14px;line-height:16px;text-decoration:none;border:1px solid #BEBEBE;padding:4px 10px;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;}
.cbtn{margin-top:10px;color:#222;background: #D1E0E5;background: -moz-linear-gradient(top,#EEF3F6,#D1E0E5);background: -webkit-linear-gradient(top,#EEF3F6,#D1E0E5);text-decoration:none;border:1px solid #BEBEBE;cursor:pointer;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;}
</style>
<div align="center">
<div dir="ltr" style="float: center;" trbidi="on">
<span class="google-src-text" style="direction: ltr; text-align: left;"><span class="Apple-style-span" style="color: black;"><span class="Apple-style-span" style="font-family: 'trebuchet ms'; font-size: 13px; line-height: 20px;"><script type="text/javascript">
function convert(){var ele1 = document.getElementById("somewhere");var replaced;replaced = ele1.value;replaced = replaced.replace(/&/ig, "&amp;");replaced = replaced.replace(/</ig, "&lt;");replaced = replaced.replace(/>/ig, "&gt;");replaced = replaced.replace(/"/ig, "&quot;");replaced = replaced.replace(/±/ig, "&plusmn;");replaced = replaced.replace(/©/ig, "&copy;");replaced = replaced.replace(/®/ig, "&reg;");replaced = replaced.replace(/ya'll/ig, "ya'll");ele1.value = replaced;}
</script></span></span></span><br />
<table border="0" cellpadding="0" cellspacing="0" style="width: 400px;"><tbody>
<tr> <td valign="top" width="400"><div align="center">
<textarea cols="50" id="somewhere" rows="15" style="background: none repeat scroll 0% 0% rgb(248, 248, 248); border: 2px solid rgb(204, 204, 204);"></textarea><input class="cbt" onclick="convert();" onmouseout="this.className='cbt'" onmouseover="this.className='cbt cbtn'" type="button" value="إضغط هنا لتحويل الكود" /></div>
</td> </tr>
</tbody></table>
</div>
</div>

اقرأ باقي الموضوع »

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

السلام عليكم و رحمة الله وبركاته

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

1. ادخل لحسابك في جوجل أدسنس و قم بعمل وحدة إعلانية جديدة و انسخ الشيفرة الخاصة به.
2. الآن يجب تحويل الشيفرة لكود ,, اضغط هنا ثم الصق شيفرة جوجل بالفراغ الموجود بالأعلى في الموقع ثم اضغط على PRASE.
3. انسخ الكود الذي ظهر والذي يوجد به الكثير من هذا الرمز - لمييزه - & .. 
4. ادخل إلى لوحة تحكم بلوجر و ادخل إلى قائمة قالب ثم اضغط على تعديل HTML ثم اضغط على توسيع القالب.
5. ابحث عن هذا السطر <div class='post-header-line-1'/> وقم بوضع الكود الذي نسخناه تحت هذا السطر.
6. اضغط على حفظ النموذج و سيبدأ الإعلان بالظهور مباشرتأً إن شاء الله ,, إنتهى.

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

و ان شاء الله تكونوا استفدتوا .. أي استفسار اتفضلوا بكتابته في التعليقات ~

اقرأ باقي الموضوع »

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

السلام عليكم, بمناسبة قرب الربيع الذي سيجعل الكرة الأرضية تفرح بزهور الربيع

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

وللمعاينة إضغط هنا .. كما رأيت إنها اضافة جميلة جداً ولا تعيق المقالات والتدوينات والآن نأتي لطريقة التركيب ::

:: طريقة الإضافة لمدونات بلوجر ::

1- ادخل للوحة التحكم واختر المدونة التي تريد التعديل عليها 

2- اذهب إلى القالب ثم اختار تحرير HTML 

3- اضغط على Ctrl+F وابحث عن </head> واضف فوقه مباشرة هذا الكود ::

<script src='http://supportivehandsjs.googlecode.com/files/springflower.js' type='text/javascript'>

</script>

4- اضغط على حفظ النموذج.

ومبروك عليك تركيب الإضافة و إذهال زوار مدونتك بها.

:: طريقة الإضافة لمدونات ووردبريس ::

1- ادخل للوحة تحكم مدونتك على الرابط الآتي (BLOGNAME.com/wp-admin/)

2- مرر الماوس فوق خيار المظهر Appearance ثم اضغط على تعديل Edit

3- الآن سترى أمامك خيارات عديدة في القالب اختر منها الترويسة . header.php واضغط عليها

4- اضغط على Ctrl+F وابحث عن </head> واضف فوقه مباشرة هذا الكود ::

<script src='http://supportivehandsjs.googlecode.com/files/springflower.js' type='text/javascript'>

</script>

5- الآن اضغط على تحديث الملف أو تحديث القالب و مبروك عليك التركيب و ابهار زوار بالإضافة الجديدة

:: طريقة التركيب للمواقع او لصفحات الـhtml عادية ::

اذا كنت تمتلك موقع او صفحة html عادية تريد إضافة هذه الزهور لها فلا تقلق بل إفرح لأن العمليه أسهل بكثير فقط كل ما عليك هو البحث عن <head> ثم اضافة الكود الموجود بالأعلى أسفلها ومبروك ! .

تم بحمد الله و ان شاء الله تكونوا استفدتوا و استمتعوا .. السلام عليكم

اقرأ باقي الموضوع »

كيفية تفعيل خيار التعليق باستخدام الاسم/عنوان

السلام عليكم ورحمة الله وبركاته

اليوم سأقدم لكم طريقة تفعيل خيار التعليق باستخدام الاسم/عنوان في بلوجر وهو عبارة عن خيار يتيح لزوار مدونتك بالرد دون التسجيل بجوجل ويستطيع فقط ادخال اسمه و عنوان موقعه او حتى دون ادخالهم يمكنه التعليق بخيار مجهول دون تعبئة أي معلومات حفاظاً على خصوصيتهم لربما !

وأرفقت لكم الصورة أعلاه لتوضح لكم ما أقصده او تبين لكم ان هذا الموضوع هو الموضوع الذي تبحثون عنه بحق ^_^

و الطريقة سهلة جداً و هي ببساطة الدخول إلى لوحة التحكم الخاصة بالمدونة ثم

 النقر على إعدادات ثم النقر على مشاركات و تعليقات

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

ثم ننقر على حفظ الإعدادات و يعطيك العافيه. ^_^

و أنا أضفت لكم الطريقة على شكل صورة لتسهيل العملية عليكم و للسرعه أيضاً ..

و ان شاء الله تكونوا استفدتوا و أي استفسار أو شرح عن أي شيء تريدوه أنا جاهز و متابع ردودكم على المقالات.

اقرأ باقي الموضوع »