متصفح مدونة المحترف للمعلومات الإصدار 1.1

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

                   الحمد لله رب العالمين والصلاة والسلام على أشرف الأنبياء والمرسلين ، نبينا محمد وعلى آله وصحبه أجمعين 

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

       

                                                         اليوم سويت متصفح جميل اسمه Speed Browser الأن إكتشفوه وأنفسكم 

                                                                                                    للتحميل

                                                                                 

                                                                           إضغط هنا

                                                                        

                                                                        أيقونة المتصفح

                                             اتمنى يعجبكم المتصفح والسلام عليكم ورحمة الله وبركاتة

وصلنا الى 100 تدوينة

السلام عليكم ورحمة الله وبركاتة طبعا اليوم وصلنا الى 100 تدوينة انشرو المدونة وسوف تتقدم المدونة إن شاء الله لقد طورت المدونة بشكل كبير جدا

1-غيرت قالب المدونة
2-أنشأت دومين للمدونة
3-الإعلانات
4-اللوجو غيرتة من حوالي 4 ايام
5-السليدشو
6-وأكثر

مدونة جميلة اسمها (اوسان) انشروها

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

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

                                                                      رابط المدونة
                                                         www.aosan2.blogspot.com

                         

ومؤسس المدونة (أحمد الشدادي)من اليمن 

اليمن-رداع

إضافة مربع البحث بشكل جميل

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

تركيب الإضافة أمر غاية في السهولة فكل ما عليك فعله هو

1- الدخول إلى لوحة التحكم الخاصة بمدونتك
2- الذهاب إلى خانة الإضافات
3- نسخ الكود التالي في أداة HTML/Javascript جديدة
                      

                                                                   طبعا هذا هو الكود

<div id='search-wrapper'><style type='text/css'> .form-wrapper { width: 290px; padding: 5px; margin: 10px auto; overflow: hidden; border-width: 1px; border-style: solid; border-color: #dedede #bababa #aaa #bababa; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; background-color: #f6f6f6; } .form-wrapper #search { width: 210px; height: 12px; padding: 10px 5px; float: right; font: bold 18px 'Arial', 'trebuchet MS', 'Tahoma'; border: 1px solid #ccc; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; } .form-wrapper #search:focus { outline: 0; border-color: #aaa; } .form-wrapper #search::-webkit-input-placeholder { color: #999; font-weight: normal; } .form-wrapper #search:-moz-placeholder { color: #999; font-weight: normal; } .form-wrapper #search:-ms-input-placeholder { color: #999; font-weight: normal; } .thumb{position:relative;left:4px;top:1px;} .form-wrapper #submit { float: left; border: 1px solid #00748f; height: 32px; width: 60px; padding: 0; cursor: pointer; font: bold 15px Arial, Helvetica; color: #fafafa; text-transform: uppercase; background-color: #0483a0; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; } .form-wrapper #submit:hover, .form-wrapper #submit:focus { background-color: #91bc1e; } .form-wrapper #submit:active { outline: 0; } .form-wrapper #submit::-moz-focus-inner { border: 0; } </style> <div class='rss'> <form action='/search' class='form-wrapper' method='get'> <input id='search' name='q' placeholder='' type='text'/> <input id='submit' type='submit' value='بحث'/> </form></div>

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

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

مميزات القالب

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

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

  معاينة وتنزيل القالب

۞  ◄معاينة القالب ۞  تحميل القالب▼

• 
  

لتغير لوجو المدونه قم بالبحث عن :

http://im38.gulfup.com/SlZ2d.png

واستبدله برابط شعار مدونتك

• تخصيص السلايد شو

لظهور السلايدرشو ابحث عن كلمة

  

حلقات

واستبدلها باسم قسم من اقسام مدونتك ليظهر بالسلايد شو

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

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

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

مثال :

                           
                                 

قبل تركيب الاداة قم بعمل نسخة احتياطية لتفادي المشاكل.

لتركيب هذه الاداة وجب عليك التوجه الى لوحة التحكم ثم اختيار قالب ومنها تختار تحرير HTML.

-تفعيل توسيع قوالب عناصر واجهة المستخدم.

-ابحث عن الكود ]]></b:skin> وقبله مباشرة ضع هذا الكود :

/* Start */
.postauthor {
    background: #F5F5F5; 
    border-top: 1px solid #e1e1e0; 
    border-bottom: 1px solid #e1e1e0; 
    overflow: hidden; 
    padding: 0.7em;
}
.postauthor img {
    border: 5px solid #e2dede; 
    float: right; 
    margin-left: 1em;
}
.postauthor h3 {
    color: #666; 
    font-size: 1.2em; 
    margin-bottom: 5px; 
    margin-top: 0;
}
.postauthor p {
    color: #515151; 
    font-size: 12px; 
    margin-bottom: 10px;
    margin-top: 0;
}
/* End */

-بعد اتمام هذه الخطوة ابحث عن <data:post.body/> (اذا وجدت اثنين فالثانية هي التي تهمنا) وبعدها مباشرة الصق هذا الكود :

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='postauthor'>
 <img alt='' height='80' src='رابط الصورة الشخصية' width='80'/>
 <h3>بقلم <a href='Blog Link'> اسم الكاتب </a></h3>
 <p> فقرة تضم نبذة عن الكاتب </p>
</div>
</b:if>

 -أخيرا قم باستبدال ما يجب تغييره واحفظ العمل.

رابط لتحميل الكودات : هنا

ايقونات مواقع التواصل الاجتماعي على شكل الميترو

السلام عليكم ورحمة الله عليكم و بركاته اليوم انشاء الله سوف اشارك معكم كود html لايقونات المواقع الاجتماعية  على شكل الميترو لوندوز 8 فهذه اليقونات ليست كالتي طرحة المرة الفائة بعنوان صندوق مترو للإشتراك في مواقع التواصل الإجتماعي

لن اطيل عليكم اليكم طريقة تركيب الاداة و كود html

طريقة التركيب وهي طريقة سهلة جدا : 

1. نذهب إلى لوحة التحكم في بلوجر
2. ندخل إلى تخطيط
3. نختار المكان الذي سوف نضيف فيه الأداة ونضغط على إضافة أداة
4. نختار أداة HTML/JAVASCRIPT
5. ونضع هذا الكود
6. ثم حفظ

 7.لا تنسو إستبدال # بما يناسبك

الكود الخاص به :

<style>
#social {
margin:5px auto 0 auto;
text-align: center;
}

#social img {
margin-right: 2px;
margin-left: 0px;
width: 50px;
}

#social img:hover {
opacity: 0.6;
}
</style><br />
<div id="social">
<a href="#"><img alt="Twitter" src="http://img221.imageshack.us/img221/3171/twittericont.png" title="تابعنى على تويتر"></a><br />
<a href="#"><img alt="Feed" src="http://img521.imageshack.us/img521/3997/rssiconldl.png" title="الخلاصات"></a><br />
<a href="#"><img alt="Facebook" src="http://img707.imageshack.us/img707/5055/facebookiconq.png" title="تابعنى على الفيس بوك"></a><br />
<a href="#"><img alt="Google Plus" src="http://img9.imageshack.us/img9/6204/googleplusiconl.png" title="جوجل بلس"></a><br />
<a href="#"><img alt="Youtube" src="http://img835.imageshack.us/img835/1835/youtubeiconf.png" title="تابعنى على يوتيوب"></a><br />
<a href="http://www.7loll.blogger.com/"></a><br />
</div>
<div style="clear: both">
 <br />
 <br />
 <br />
</div>
><br />
</a> </div>

</di <br>

بقلم أحمد

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

صندوق مترو للإشتراك في مواقع التواصل الإجتماعي

السلام عليكم
اعود لكم اليوم بعد إطلاق مدونة المحترف للمعلومات بقالب جميل وبسيط أيضا اقدم اليكم عدة اكواد لاضافات ازرار المواقع الاجتماعية  على شكل مقدمة المترو (او الويندوز 8 ) الذي يتميز بطابع البساطة والتناسق.و التي سوف تمكين متابعي مدونتك او موقعك  من الإشتراك في حساباتك أو صفحاتك على المواقع التواصل الإجتماعي مثل :اليوتيوب، التويتر، الفيس بوك، والقائمة البريدية الخ..

إذا امر الآن إلى طريقة التركيب وهي طريقة سهلة جدا :

1. نذهب إلى لوحة التحكم في بلوجر
2. ندخل إلى تخطيط
3. نختار المكان الذي سوف نضيف فيه الأداة ونضغط على إضافة أداة
4. نختار أداة HTML/JAVASCRIPT
5. ونضع هذا الكود
6. ثم حفظ

 7.لا تنسو إستبدال الروابط  بما يناسبك

الشكل 1 :

الكود الخاص به :

<style>
 .social-icone{ height:108px; background-image:url(http://www.tree4tc2.blogspot.com);}
.social-icone div{ margin: 8px 12px;}
.social-icone a{ text-decoration:none;}
.you-icone b, .twt-icone b,.face-icone b,.rss-icone b{ font:14px tahoma; color:#8c8b8b;}
.you-icone span,.twt-icone span,.face-icone span,.rss-icone span{font:11px tahoma; color:#a3a3a3; }
.you-icone{
width: 50px;
height: 32px;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgSBs-5fYcclvGpTz5vRvxEEGChqpyB9FQJMuOgwUmGWGVowNB7diPXUI-b3ueKhqC1PrYFU3onCc8Wal24fQPoHBv5bbxL1Ob7tp_HyfrYS9z9pWLcq_qmOhmmwhLRUP8vvNT4e2O5t0/s1600/youtube.png)top no-repeat;
text-align: center;
padding-top: 56px;
float:right;
}
.you-icone:hover{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzeLbcLHom1ibphz2hYxP-F9vHUTilEhArNUAtqr_ZkN0GmtyGEqXzIY1-6E0-BlsgrMyo02TrIlgRyimID8NEqKPHLxWXzHdejeKxNZmLPpbktLiOaATn3IJ-tUoOGiD9op0hijN-StE/s1600/youtube2.png)top no-repeat;}
.twt-icone{
width: 50px;
height: 32px;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEib8hGSYIvXGynP2JtZ_vUPbpUtiB_dmrwmcbrqX1aGkacf4JzubfgEiS-QzH0AKrRYhdaERozhQVUF56qEKHSXAEuqDLNbHJAyW1b0YHi6jGRNywGorL1Mgrz47DqH243UenB9DhVsSLg/s1600/twitter.png)top no-repeat;
text-align: center;
padding-top: 56px;
float:right;
}
.twt-icone:hover{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiM5G3Y4BuAjO4_Y5y_-6ya0IySNEss2BD0_aOZLJkRr-m_4WPrjYhsfmf-YCG0hvsNQzBZC2IX6aH6uw5PnHMG-hzWDjaKZC2RedXTmL_nXBpFPU20o-RTDNXUf9JoLrE5kWQ7GCrdYBE/s1600/twitter2.png)top no-repeat;}
.face-icone{
width: 50px;
height: 32px;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSFb22sIlE0WgTWZ9aFo2xnew5ckOkdHhAFyE10OAOSS1g-RXqTQTC9_872gE3C55ZjfNISL-IReExqW51xyMLFtADzzTqPXJYjXewNcSPtxFlzCd_0jQVZrdwRvso1avJNc-kujEXkbU/s1600/facebook.png)top no-repeat;
text-align: center;
padding-top: 56px;
float:right;
}
.face-icone:hover{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgRx266kFWyDJubivKJMTlGlXcYccFFMkgYQ-RLQ99FnKSsineluFar5LPw_pTh3qT-cBVuFjId8_Jh1LtstT20YiSdUKFuElMuyVfrMm1LfxRcCuVaXYGjbO3YeB4yHsnSJhQOkX0_PZQ/s1600/facebook2.png)top no-repeat;}
.rss-icone{
width: 50px;
height: 32px;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgC3_tvHvwKK7WLMcfHPjdEbpj-K68Fk775KR1Nhpa1KbVw7DGUDw-JnRxFOlxmGeURZ_LZEzDH80x6y-BGGFnbx541Ip2NBIKmomJBo2Hbi3CXw9u2An01Wz2ebox0qE303BYcfoWtqW4/s1600/RSS.png)top no-repeat;
text-align: center;
padding-top: 56px;
float:right;
}
.rss-icone:hover{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgAgalMILFs7y3hDOdCVJpfIePvvdd9_EQGMfYxVgxCuypTZSF3JU7yzp3-ZEybXgn7Dyi78lNdU6akBHTKkZ7VBNYGqWULMsIx_uBvYhtedJyu9bOYM0rzePDt7KIRWH-mrI_Hal_l_v8/s1600/RSS2.png)top no-repeat;}
.post-footer-line > * {
margin-left: 0;
}
</style>

<div class="social-icone">
<#/a href="http://www.youtube.com">
<div class="you-icone">
<b>#</b>
<span>مشترك</span>
</div>
</a>
<#/a href="http://www.twitter.com">
<div class="twt-icone">
<b>#</b>
<span>متابع</span>
</div>
</a>
<#/a href="https://www.facebook.com">
<div class="face-icone">
<b>250 ألف</b>
<span>معجب</span>
</div>
</a>
<#/a href="http://feeds.feedburner.com">
<div class="rss-icone">
<b>#</b>
<span>مشترك</span>
</div>
</a>
</div>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />

<br /></di

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

        رابط قناة اليوتوب :

1. #/http://www.youtube.com
2. # 
3. مشترك

رابط التويتر: 

1. #/http://www.twitter.com
2. #
3. متابع

 رابط الفيسبوك :

1. #/https://www.facebook.com
2. #
3. معجب

رابط التغدية : 

1. #/http://feeds.feedburner.com
2. #
3.  مشترك

الشكل 2:

الكود الخاص به :

<div class="metro-social">

<li><a class="fb" href="http://www.facebook.com/#"></a></li>

<li><a class="tw" href="http://twitter.com/#"></a></li>

<li><a class="gp" href="https://plus.google.com/#"></a></li>

<li><a class="fd" href="http://feeds.feedburner.com/#"></a></li>

</div>

<style>

/*Metro UI Social Profile Widget v2.0 by Tech Prevue Labs

Web link to gadget code: http://www.m3infos.blogspot.com/search/label/%D8%A8%D9%84%D9%88%D8%AC%D8%B1?max-results=8

Distributed under license CC BY-NC-ND 3.0 INT

Please keep license information intact while using this widget*/

.metro-social{width:285px}

.metro-social li{position:relative;cursor:pointer;padding:0;list-style:none}

.metro-social .fb,.tw,.gp,.fd{z-index:7;float:left;margin:1px;position:relative;display:block}

.metro-social .fb{background:url(//goo.gl/6xmUk) no-repeat center center #1f69b3;width:140px;height:141px}

.metro-social .tw{background:url(//goo.gl/oyiFK) no-repeat center center #43b3e5;width:140px;height:70px}

.metro-social .gp{background:url(//goo.gl/oT0kF) no-repeat center center #da4a38;width:140px;height:69px}

.metro-social .fd{background:url(//goo.gl/ncoLY) no-repeat center center #e9a01c;width:282px;height:69px}

.metro-social li:hover .fb{background:url(//goo.gl/MH8AP) no-repeat center center #1f69b3}

.metro-social li:hover .tw{background:url(//goo.gl/hHRHv) no-repeat center center #43b3e5}

.metro-social li:hover .gp{background:url(//goo.gl/wva4B) no-repeat center center #da4a38}

.metro-social li:hover .fd{background:url(//goo.gl/JFGqn) no-repeat center center #e9a01c}

</style>

<br>

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br /></div>

</div

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

 http://www.facebook.com/#

http://twitter.com/#

https://plus.google.com/#

http://feeds.feedburner.com/#

الشكل 3 :

الكود الخاص به :

<div class="metro-social">

<li><a class="fb" href="http://www.facebook.com/#"></a></li>

<li><a class="tw" href="http://twitter.com/#"></a></li>

<li><a class="gp" href="https://plus.google.com/#"></a></li>

<li><a class="pi" href="http://pinterest.com/#"></a></li>

<li><a class="in" href="https://www.linkedin.com/in/#"></a></li>

<li><a class="yt" href="http://www.youtube.com/#"></a></li>

<li><a class="fd" href="http://feeds.feedburner.com/#"></a></li>

</div>

<style>

/*Metro UI Social Profile Widget v3.0 by Tech Prevue Labs

Web link to gadget code: http://www.m3infos.blogspot.com/search/label/%D8%A8%D9%84%D9%88%D8%AC%D8%B1?max-results=8

Distributed under license CC BY-NC-ND 3.0 INT

Please keep license information intact while using this widget*/

.metro-social{width:285px}

.metro-social li{position:relative;cursor:pointer;padding:0;list-style:none}

.metro-social .fb,.tw,.gp,.pi,.in,.yt,.fd{z-index:7;float:left;margin:1px;position:relative;display:block}

.metro-social .fb{background:url(//goo.gl/6xmUk) no-repeat center center #1f69b3;width:140px;height:141px}

.metro-social .tw{background:url(//goo.gl/oyiFK) no-repeat center center #43b3e5;width:68px;height:70px}

.metro-social .gp{background:url(//goo.gl/oT0kF) no-repeat center center #da4a38;width:69px;height:70px}

.metro-social .pi{background:url(//goo.gl/7olxx) no-repeat center center #d73532;width:68px;height:69px}

.metro-social .in{background:url(//goo.gl/PhFhj) no-repeat center center #0097bd;width:69px;height:69px}

.metro-social .yt{background:url(//goo.gl/zcwjB) no-repeat center center #e64a41;width:140px;height:69px}

.metro-social .fd{background:url(//goo.gl/lhBP1) no-repeat center center #e9a01c;width:140px;height:69px}

.metro-social li:hover .fb{background:url(//goo.gl/MH8AP) no-repeat center center #1f69b3}

.metro-social li:hover .tw{background:url(//goo.gl/hHRHv) no-repeat center center #43b3e5}

.metro-social li:hover .gp{background:url(//goo.gl/wva4B) no-repeat center center #da4a38}

.metro-social li:hover .pi{background:url(//goo.gl/IORvy) no-repeat center center #d73532}

.metro-social li:hover .in{background:url(//goo.gl/2zHrm) no-repeat center center #0097bd}

.metro-social li:hover .yt{background:url(//goo.gl/I1c4a) no-repeat center center #e64a41}

.metro-social li:hover .fd{background:url(//goo.gl/CjzDP) no-repeat center center #e9a01c}

</style>

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br />

<br /></div>

</div>

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

http://www.facebook.com/#

http://twitter.com/#

https://plus.google.com/#

http://pinterest.com/#

https://www.linkedin.com/in/#

http://www.youtube.com/#

http://feeds.feedburner.com/#

                                    اتمنى تكون الإضافة عجبتكم