ظƒظ„ظ…ط© ط§ظ„ظپط±ظٹظ‚

ظپظٹ ط¹طµط±ظ†ط§ ظٹظˆط¬ط¯ ظ…ط¦ط§طھ ط§ظ„ط¢ظ„ط§ظپ ظ…ظ† ط§ظ„ظ…ط¯ظˆظ†ظٹظ† ظˆط§ظ„ظ…ط¯ظˆظ†ط§طھ ، ط§ظ„ط¨ط¹ط¶ ظٹط¹ظ…ظ„ ط¨ط´ط؛ظپ ظˆط­ط¨ ظˆط§ظ„ط¢ط®ط± ظٹط¹ظ…ظ„ ط¨ط´ظƒظ„ ط¥ظ†طھط§ط¬ظٹ ظ„ظ„ظƒط³ط¨ ظپظ‚ط· ! ط£ظ…ط§ ظ†ط­ظ† .. ظ†ط­ط¨ ظˆظ†ط¹ط´ظ‚ ظˆظ†ط¯ظˆظˆظˆط¨ ظپظٹ ط¯ط¨ط§ط¯ظٹط¨ ط§ظ„طھط¯ظˆظٹظ† ظˆظ†ط¤ظ…ظ† ط£ظ†ظ†ط§ ط³ظ†ظ‚ظˆظ… ط¨ط¥ط¶ط§ظپط© ظƒط¨ظٹط±ط© ظ„ظ„ظ…ط­طھظˆظ‰ ط§ظ„ط¹ط±ط¨ظٹ ظˆظ„ظˆ ط¨ط´ظٹط¦ ط¨ط³ظٹط· ، ظ†طھط¹ظ„ظ… ط¨ط´ظƒظ„ ظ…ط³طھظ…ط± ظ†ط´ط§ط±ظƒظƒظ… ط¨ظƒظ„ ط¬ط¯ظٹط¯ ، ظ†ط­ط§ظˆظ„ ط§ظ„ظ…ط³ط§ط¹ط¯ط© ظ†ط­ط¨ ط£طµط¯ظ‚ط§ط،ظ†ط§ ، ظ†ظ‡طھظ… ط¨ط¥ط³طھظپط³ط§ط±ط§طھظ‡ظ… ظƒظ…ط§ ظ„ظˆ ظƒط§ظ†طھ ظ…ظ„ظƒظ†ط§، ظپط±ظٹظ‚ظ†ط§ ظپط±ظٹظ‚ ظˆط§ط­ط¯ ط±ط؛ظ… ط£ظ†ظ‡ ظ…طھظƒظˆظ† ظ…ظ† ط´ط®طµ ظˆط§ط­ط¯ :) ظ„ظƒظ†ظ‡ ظٹط¹ظ…ظ„ ط¨ط¬ظ†ظˆظ†

[بلوجر] أضافة قائمة رأسية جانبية احترافية

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


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

مواضيع ذات صلة
[بلوجر] قائمة جانبية احترافية متجاوبة 2014
عمل قائمة جانبية لاقسام المدونة بلوجر
للمزيد من اضافات بلوجر 


Demo
click to view


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

    • في البداية قم بالذهاب الى لوحة تحكم بلوجر 
    • ثم اظغط على قالب  
    • ثم قم بالبحث عن  </head>
    • وضع الكود الاتي فوقة / قبلة
    <link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet"/>
    •  بعد ذلك قم بالبحث عن </body>
    • وضع فوقة الكود الاتي 
    <div class="menu-right almtwr" style="height: 2681px;">
    <ul>
    <li>
    <a class="ss hom" href="http://www.almtwr.net/">
    <i class="ka fa fa-home"></i>
    <span class="na">الرئيسية </span>
    </a>
    </li>
    <li>
    <a class="ss win" href="http://www.almtwr.net/search/label/%D8%A7%D9%84%D9%88%D9%8A%D9%86%D8%AF%D8%B2">
    <i class="ka fa fa-windows"></i>
    <span class="na">الويندوز </span>
    </a>
    </li>
    <li>
    <a class="ss cog" href="http://www.almtwr.net/search/label/%D8%A7%D9%84%D8%A8%D8%B1%D9%85%D8%AC%D8%A9">
    <i class="ka fa fa-cogs"></i>
    <span class="na">البرمجة</span>
    </a>
    </li>
    <li>
    <a class="ss goo" href="http://www.almtwr.net/search/label/%D8%A7%D9%84%D8%B3%D9%8A%D9%88">
    <i class="ka fa fa-google-plus"></i>
    <span class="na">السيو</span>
    </a>
    </li>
    <li>
    <a class="ss des" href="http://www.almtwr.net/search/label/%D9%81%D9%88%D8%AA%D9%88%D8%B4%D9%88%D8%A8">
    <i class="ka fa fa-desktop"></i>
    <span class="na">التصميم</span>
    </a>
    </li>
    <li>
    <a class="ss unl" href="http://www.almtwr.net/search/label/%D8%A7%D9%84%D8%AD%D9%85%D8%A7%D9%8A%D8%A9">
    <i class="ka fa fa-unlock-alt"></i>
    <span class="na">الحماية </span>
    </a>
    </li>
    <li>
    <a class="ss che" href="http://www.almtwr.net/search/label/%D8%A7%D9%84%D8%AD%D9%84%D9%82%D8%A7%D8%AA?max-results=8">
    <i class="ka fa fa-check-square"></i>
    <span class="na">شروحات عامة </span>
    </a>
    </li>
    <li>
    <a class="ss thu" href="http://www.almtwr.net/search/label/%D9%85%D9%88%D8%A7%D9%82%D8%B9">
    <i class="ka fa fa-thumbs-o-up"></i>
    <span class="na">مواقع مفيدة </span>
    </a>
    </li>
    <li>
    <a class="ss des" href="http://www.almtwr.net/search/label/%D9%85%D9%88%D8%A7%D9%82%D8%B9%20%D8%A7%D9%84%D8%AA%D9%88%D8%A7%D8%B5%D9%84%20%D8%A7%D9%84%D8%A7%D8%AC%D8%AA%D9%85%D8%A7%D8%B9%D9%8A">
    <i class="ka fa fa-desktop"></i>
    <span class="na">مواقع أجتماعية</span>
    </a>
    </li>
    <li>
    <a class="ss che" href="http://www.almtwr.net/search/label/%D8%A7%D9%84%D9%85%D9%82%D8%A7%D9%84%D8%A7%D8%AA">
    <i class="ka fa fa-check-square"></i>
    <span class="na">المقالات </span>
    </a>
    </li>
    <li>
    <a class="ss dow" href="http://www.almtwr.net/search/label/%D8%A8%D9%84%D9%88%D8%AC%D8%B1">
    <i class="ka fa fa-cloud-download"></i>
    <span class="na">بلوجر</span>
    </a>
    </li>
    <li><a class="ss arc" href="http://www.almtwr.net/p/blog-page_6.html">
    <i class="ka fa fa-archive"></i>
    <span class="na">الارشيف </span>
    </a>
    </li>
    <li>
    <a class="ss exc" href="/404">
    <i class="ka fa fa-exclamation-triangle"></i>
    <span class="na">خطا 404 </span>
    </a>
    </li>
    </ul>
    </div>

    • ثم قم بالبحث ]]></b:skin>
    • وضع فوقة الكود الاتي 
    .menu-right{top:226px;}}
    /**/.menu-right{background:none repeat scroll 0 0 #fff;border-left:1px solid #F0F0F0;top:166px;width:41px;position:absolute;z-index:9999999;}.menu-right ul li{border-bottom:1px solid #EBEBEB;box-shadow:0 1px 0 0 #FFFFFF;}.menu-right .na{/**/width:0;right:41px;padding:0;position:absolute;overflow:hidden;/**/font-family:droid arabic kufi;font-size:16px;font-weight:bold;letter-spacing:0.6px;white-space:nowrap;line-height:39px;/**/-webkit-transition:0.25s;/**/-moz-transition:0.25s;transition:0.25s;}.menu-right.ss:hover .ka{color:#FFFFFF;}.menu-right .ss{display:block;height:39px;text-align:center;position:relative;width:41px;z-index:99999;/**/}/**/.menu-right .ss:hover .na{width:auto;padding:0 20px;overflow:visible;}/**/.menu-right .hom:hover{background:none repeat scroll 0 0 #00BAC7;}.menu-right .hom .na{background:none repeat scroll 0 0 #00BAC7;}.fa-home{color:#00BAC7;}/**/.menu-right .win:hover{background:none repeat scroll 0 0 #8F8898;}.menu-right .win .na{background:none repeat scroll 0 0 #8F8898;}.fa-windows{color:#8F8898;}/**/.menu-right .cog:hover{background:none repeat scroll 0 0 #43AF95;}.menu-right .cog .na{background:none repeat scroll 0 0 #43AF95;}.fa-cogs{color:#43AF95;}/**/.menu-right .goo:hover{background:none repeat scroll 0 0 #F3594D;}.menu-right .goo .na{background:none repeat scroll 0 0 #F3594D;}.fa-google-plus{color:#F3594D;}/**/.menu-right .des:hover{background:none repeat scroll 0 0 #5792B2;}.menu-right .des .na{background:none repeat scroll 0 0 #5792B2;}.fa-desktop{color:#5792B2;}/**/.menu-right .unl:hover{background:none repeat scroll 0 0 #F6C231;}.menu-right .unl .na{background:none repeat scroll 0 0 #F6C231;}.fa-unlock-alt{color:#F6C231;}/**/.menu-right .che:hover{background:none repeat scroll 0 0 #C61F89;}.menu-right .che .na{background:none repeat scroll 0 0 #C61F89;}.fa-check-square{color:#C61F89;}/**/.menu-right .thu:hover{background:none repeat scroll 0 0 #F75940;}.menu-right .thu .na{background:none repeat scroll 0 0 #F75940;}.fa-thumbs-o-up{color:#F75940;}/**/.menu-right .dow:hover{background:none repeat scroll 0 0 #4aa3df;}.almtwr {margin-top: 0;position: fixed;top: 0!important;z-index: 9999999;}.menu-right .dow .na{background:none repeat scroll 0 0 #4aa3df;}.menu-right .fa-cloud-download{color:#4aa3df;}/**/.menu-right .arc:hover{background:none repeat scroll 0 0 #34495e;}.menu-right .arc .na{background:none repeat scroll 0 0 #34495e;}.arc .fa-archive{color:#34495e;}/**/.menu-right .exc:hover{background:none repeat scroll 0 0 #f1c40f;}.menu-right .exc .na{background:none repeat scroll 0 0 #f1c40f;}.fa-exclamation-triangle{color:#f1c40f;}/**/.menu-right .plu:hover{background:none repeat scroll 0 0 #9b59b6;}.menu-right .plu .na{background:none repeat scroll 0 0 #9b59b6;}.fa-plus{color:#9b59b6;}.fa-minus{color:#9b59b6;}/**/.menu-right .ka{font-size:21px;line-height:36px;transform:rotate(0deg);transition:all 0.5s ease 0s;}.menu-right .na{color:#FFFFFF;}.menu-right .ss:hover .ka{color:#FFFFFF;transform:rotate(360deg);transition:all 0.5s ease 0s;}


    ط¹ظ†ظˆط§ظ† ط§ظ„طھط¯ظˆظٹظ†ط©: [بلوجر] أضافة قائمة رأسية جانبية احترافية
    طھظ‚ظٹظٹظ… : 10 ظ…ظ† 10 ظ…ط±طھظƒط² ط¹ظ„ظ‰ 24 طھظ‚ظٹظٹظ….
    ط§ظ„ظƒط§طھط¨ : ط£ط­ظ…ط¯ ط£ط¨ظˆط¹ط¨ظٹظ„ط© ظ…ط¯ظٹط± ظ…ظˆظ‚ط¹ ط§ظ„ظ…ط·ظˆط± .ظ†طھ
    ط¹ط¯ط¯ ط§ظ„ظ…ط´ط§ظ‡ط¯ط§طھ :

    * ط¨ط¥ظ…ظƒط§ظ†ظƒ ط¥ط¯ط±ط§ط¬ ط§ظ„ط£ظƒظˆط§ط¯ ط§ظ„ط؛ظٹط± ظ‚ط§ط¨ظ„ط© ظ„ظ†ط´ط± ط¨طھط­ظˆظٹظ„ظ‡ ط¹ط¨ط± ظ…ط­ظˆظ„ ط§ظ„ط£ظƒظˆط§ط¯

    طھط­ظˆظٹظ„ ط§ظ„ط£ظƒظˆط§ط¯ط¥ط؛ظ„ط§ظ‚ ط§ظ„طھط¹ط¨ظٹط±ط§طھط¥ط®ظپط§ط،

    ط´ظƒط±ط§ ظ„طھط¹ظ„ظٹظ‚ظƒ
    ظ‚ط§ظ„ط¨ ط¨ط¯ط§ظٹط© .. ظ†ظ‚ط·ط© .