الصفحة غير موجودة ، 404

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

يمكنك التبليغ عن رابط لا يعمل من هذا الصفحة التبليغ عن رابط لا يعمل

ويمكنك طلب ما تريده من هذه الصفحة الدعم الفنى

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

العودة للرئيسية

الاثنين، 25 أبريل، 2016

إضافة أداة مكتبة أكواد الألوان فى بلوجر


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



تركيب الإضافة

الإَضافة سهلة التركيب وهى عبارة عن كود واحد فقط وهذا الكود يتم وضعه فى وضع الـHTML  فى صفحة جديده على مدونتك .

<div dir="rtl" style="text-align: right;" trbidi="on">
<div id="flatuarlina">
<ul class="flatui">
<li style="background: #5C97BF;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #5C97BF</span>
</li>
<li style="background: #4B77BE;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #4B77BE</span>
</li>
<li style="background: #1F3A93;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #1F3A93</span>
</li>
<li style="background: #2574A9;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #2574A9</span>
</li>
<li style="background: #67809F;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #67809F</span>
</li>
<li style="background: #34495E;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #34495E</span>
</li>
<li style="background: #3A539B;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #3A539B</span>
</li>
<li style="background: #1E8BC3;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #1E8BC3</span>
</li>
<li style="background: #6BB9F0;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #6BB9F0</span>
</li>
<li style="background: #22313F;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #22313F</span>
</li>
<li style="background: #336E7B;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #336E7B</span>
</li>
<li style="background: #19B5FE;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #19B5FE</span>
</li>
<li style="background: #89C4F4;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #89C4F4</span>
</li>
<li style="background: #2C3E50;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #2C3E50</span>
</li>
<li style="background: #3498DB;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #3498DB</span>
</li>
<li style="background: #22A7F0;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #22A7F0</span>
</li>
<li style="background: #94E0EE;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #94E0EE</span>
</li>
<li style="background: #52B3D9;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #52B3D9</span>
</li>
<li style="background: #59ABE3;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #59ABE3</span>
</li>
<li style="background: #26A65B;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #26A65B</span>
</li>
<li style="background: #1E824C;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #1E824C</span>
</li>
<li style="background: #00B16A;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #00B16A</span>
</li>
<li style="background: #2ABB9B;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #2ABB9B</span>
</li>
<li style="background: #4DAF7C;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #4DAF7C</span>
</li>
<li style="background: #03A678;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #03A678</span>
</li>
<li style="background: #26C281;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #26C281</span>
</li>
<li style="background: #019875;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #019875</span>
</li>
<li style="background: #3FC380;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #3FC380</span>
</li>
<li style="background: #16A085;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #16A085</span>
</li>
<li style="background: #2ECC71;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #2ECC71</span>
</li>
<li style="background: #C5EFF7;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #C5EFF7</span>
</li>
<li style="background: #C8F7C5;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #C8F7C5</span>
</li>
<li style="background: #049372;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #049372</span>
</li>
<li style="background: #36D7B7;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #36D7B7</span>
</li>
<li style="background: #66CC99;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #66CC99</span>
</li>
<li style="background: #1BA39C;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #1BA39C</span>
</li>
<li style="background: #1BBC9B;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #1BBC9B</span>
</li>
<li style="background: #65C6BB;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #65C6BB</span>
</li>
<li style="background: #BFBFBF;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #BFBFBF</span>
</li>
<li style="background: #ABB7B7;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #ABB7B7</span>
</li>
<li style="background: #DADFE1;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #DADFE1</span>
</li>
<li style="background: #95A5A6;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #95A5A6</span>
</li>
<li style="background: #C5DCE2;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #C5DCE2</span>
</li>
<li style="background: #BDC3C7;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #BDC3C7</span>
</li>
<li style="background: #EEEEEE;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #EEEEEE</span>
</li>
<li style="background: #D2D7D3;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #D2D7D3</span>
</li>
<li style="background: #F0E2C5;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #F0E2C5</span>
</li>
<li style="background: #EB9532;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #EB9532</span>
</li>
<li style="background: #E67E22;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #E67E22</span>
</li>
<li style="background: #F27935;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #F27935</span>
</li>
<li style="background: #F9BF3B;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #F9BF3B</span>
</li>
<li style="background: #F7CA18;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #F7CA18</span>
</li>
<li style="background: #F9690E;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #F9690E</span>
</li>
<li style="background: #F39C12;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #F39C12</span>
</li>
<li style="background: #D35400;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #D35400</span>
</li>
<li style="background: #F4D03F;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #F4D03F</span>
</li>
<li style="background: #F5AB35;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #F5AB35</span>
</li>
<li style="background: #EB974E;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #EB974E</span>
</li>
<li style="background: #F2784B;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #F2784B</span>
</li>
<li style="background: #F4B350;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #F4B350</span>
</li>
<li style="background: #E87E04;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #E87E04</span>
</li>
<li style="background: #E74C3C;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #E74C3C</span>
</li>
<li style="background: #CF000F;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #CF000F</span>
</li>
<li style="background: #C0392B;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #C0392B</span>
</li>
<li style="background: #D64541;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #D64541</span>
</li>
<li style="background: #EF4836;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #EF4836</span>
</li>
<li style="background: #96281B;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #96281B</span>
</li>
<li style="background: #D91E18;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #D91E18</span>
</li>
<li style="background: #E26A6A;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #E26A6A</span>
</li>
<li style="background: #FF0000;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #FF0000</span>
</li>
<li style="background: #F22613;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #F22613</span>
</li>
<li style="background: #E08283;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #E08283</span>
</li>
<li style="background: #9B59B6;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #9B59B6</span>
</li>
<li style="background: #8E44AD;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #8E44AD</span>
</li>
<li style="background: #BE90D4;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #BE90D4</span>
</li>
<li style="background: #BF55EC;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #BF55EC</span>
</li>
<li style="background: #9A12B3;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #9A12B3</span>
</li>
<li style="background: #913D88;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #913D88</span>
</li>
<li style="background: #722D6A;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #722D6A</span>
</li>
<li style="background: #740A4E;"><span class="kodebesar"><span class="kodekecil">كود اللون</span> #740A4E</span>
</li>
</ul>
</div>
<style scoped="" type="text/css">
/* Flat UI Color by www.arlinadzgn.com */
#flatuarlina ul.flatui{position:relative;display:table;width:100%;text-align:center;color:#fff;font-size:12px;margin:auto;position:relative;padding:0}
#flatuarlina ul.flatui li{position:relative;display:flex;float:left;width:25%;min-height:160px;padding:4%;list-style:none;background:#444;text-align:center;font-family:inherit;color:rgba(255,255,255,);font-size:1.1rem;margin:auto;font-weight:700;backface-visibility:hidden;transition:all .3s cubic-bezier(1,0.015,0.295,1.225)}
#flatuarlina ul.flatui li:hover{z-index:4}
#flatuarlina ul.flatui li:before{content:'';display:block;position:absolute;top:0;left:0;right:0;bottom:0;background:;z-index:1;opacity:0;visibility:hidden;transform:scale(0.4)}
#flatuarlina ul.flatui li:hover:before{opacity:1;visibility:visible;transform:scale(1.0)}
#flatuarlina ul.flatui li:after{content:'اضغط مرتين لنسخ الكود';display:block;position:absolute;padding:10px 0;font-weight:400;font-size:.8rem;left:0;right:0;bottom:0;opacity:0;color:rgba(255,255,255,.5);font-weight:700;visibility:hidden;transform:translate(0,30px);transition:all .3s cubic-bezier(1,0.015,0.295,1.225);transition-delay:.1s}
#flatuarlina ul.flatui li:hover:after{opacity:1;visibility:visible;transform:translate(0,-10px);z-index:1;transition-delay:.8s}
#flatuarlina ul.flatui li .kodebesar{width:100%;padding:0;display:block;float:none;margin:auto;clear:both;z-index:3}
#flatuarlina ul.flatui li .kodekecil{width:100%;padding:0;display:block;float:none;margin:0 auto 10px auto;font-weight:400;font-size:.8rem;clear:both;z-index:3}
@media screen and (max-width:800px){#flatuarlina ul.flatui li{width:33.3%;line-height:normal}}
@media screen and (max-width:640px){#flatuarlina ul.flatui li{width:50%}}
@media screen and (max-width:480px){#flatuarlina ul.flatui li{width:100%}}
</style></div>


وكما قلنا هذه الإضافة بسيطه جدا وهذا كل شئ فى هذا الموضوع اذا واجهتك اى مشكلة فى تركيب الإضافة او تريد التعديل على اى شئ ، فباب التعليقات مفتوح لا تتردد ! وادعمنا بمشاركة التدوينة ليستفيد منها الجميع :)

شارك الموضوع ليستفيد الجميع

مواضيع ممكن أن تعجبك

7 تعليقات على موضوع : إضافة أداة مكتبة أكواد الألوان فى بلوجر

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

اضافة جميلة ايها المدريستا

شكرا لك اخى وبالتوفيق لريال مدريد اليوم

اريد شراء قالب مدونتك كم تطلب ؟؟؟؟ + راسلني على حسابي ان كنت تريد
https://www.facebook.com/mohamedelbarian

للاسف اخى القالب ليس متاح للبيع

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

جميع الحقوق محفوظة لـ عالم المدون | قوالب بلوجر,اضافات بلوجر, دروس وشروحات بلوجر