حصريا اضافة صناديق احترافية للتدوينات وبشكل جميل من حمزه ويب



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

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

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



 طريقة تركيب اضافة


  1. لوحة تحكم 
  2. قالب 
  3. تحرير HTML
  4. ابحث عن هذا كود </head>
  5. واضف هذا كود فوقة 


<link href='http://fonts.googleapis.com/earlyaccess/droidarabicnaskh.css' rel='stylesheet' type='text/css'/>

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




#pro1 {margin: 3px -15px 3px 0px;color: #fff;font: 15px Droid arabic naskh;padding: 8px 67px 0px 0;height: 28px;width: 100%;background: #2c3e50 url(https://dl.dropboxusercontent.com/s/xl45xxg9slpspas/1-1.png) no-repeat 100% 0px;text-align: right;transition: 1s;overflow: hidden;}#pro1:hover {background: #00a8ad url(https://dl.dropboxusercontent.com/s/xl45xxg9slpspas/1-1.png) no-repeat 100% 0px;color: #fff;transition: 1s;}#pro2 {margin: 3px -15px 3px 0px;color: #fff;font: 15px Droid arabic naskh;padding: 8px 67px 0px 0;height: 28px;width: 100%;background: #2c3e50 url(https://dl.dropboxusercontent.com/s/yt79n12nlp678d2/2-2.png) no-repeat 100% 0px;text-align: right;transition: 1s;overflow: hidden;}#pro2:hover {background: #ab2e2e url(https://dl.dropboxusercontent.com/s/yt79n12nlp678d2/2-2.png) no-repeat 100% 0px;color: #fff;}#pro3 {margin: 3px -15px 3px 0px;color: #fff;font: 15px Droid arabic naskh;padding: 8px 67px 0px 0;height: 28px;width: 100%;background: #2c3e50 url(https://dl.dropboxusercontent.com/s/oukzfti8dlazvra/4-4-4.png) no-repeat 100% 0px;text-align: right;transition: 1s;overflow: hidden;}#pro3:hover {background: #788081 url(https://dl.dropboxusercontent.com/s/oukzfti8dlazvra/4-4-4.png) no-repeat 100% 0px;color: #fff;}#pro4 {margin: 3px -15px 3px 0px;color: #fff;font: 15px Droid arabic naskh;padding: 8px 67px 0px 0;height: 28px;width: 100%;background: #2c3e50 url(https://dl.dropboxusercontent.com/s/h39m03t19p7cnp7/5-5-5.png) no-repeat 100% 0px;text-align: right;transition: 1s;overflow: hidden;}#pro4:hover {background: #f39c12 url(https://dl.dropboxusercontent.com/s/h39m03t19p7cnp7/5-5-5.png) no-repeat 100% 0px;color: #fff;}#pro5 {margin: 3px -15px 3px 0px;color: #fff;font: 15px Droid arabic naskh;padding: 8px 67px 0px 0;height: 28px;width: 100%;background: #2c3e50 url(https://dl.dropboxusercontent.com/s/ayfajdkngi7377r/3-3.png) no-repeat 100% 0px;text-align: right;transition: 1s;overflow: hidden;}#pro5:hover {background: #27ae60 url(https://dl.dropboxusercontent.com/s/ayfajdkngi7377r/3-3.png) no-repeat 100% 0px;color: #fff;}#pro6 {margin: 3px -15px 3px 0px;color: #fff;font: 15px Droid arabic naskh;padding: 8px 67px 0px 0;height: 28px;width: 100%;background: #2c3e50 url(https://dl.dropboxusercontent.com/s/qhfqjdpch23lvyu/6-6.png) no-repeat 100% 0px;text-align: right;transition: 1s;overflow: hidden;}#pro6:hover {background: #278879 url(https://dl.dropboxusercontent.com/s/qhfqjdpch23lvyu/6-6.png) no-repeat 100% 0px;color: #fff;}

ثم اضغط حفظ نموذج 
وعند كتابة في موضوع او تدوينة تضغط HTML
وتضيف اي من هذه اكواد التي تعجبك


<div id='pro1'>تجربة</div><div id='pro2'>تجربة</div><div id='pro3'>تجربة</div><div id='pro4'>تجربة</div><div id='pro5'>تجربة</div><div id='pro6'>تجربة</div>


وانتهى موضوعنا الى هنا
وانتظروا كل جديد وحصري من حمزه ويب 
في امان الله




انتهى الموضوع ، اتمنى أن تكون الإضافة في متناول الجميع تحياتي .

2 التعليقات

اضغط لإضافة التعليقات
Anwar
ADMIN
28 ديسمبر 2014 في 8:41 ص

اضافة رائعة الف شكر =e
تم التركيب
http://gewshelislam.blogspot.com
من داخل تدوينة
http://gewshelislam.blogspot.com/2014/12/Zakat.html

رد
avatar

اهلا بك عزيزي زائر , هنا يمكنك تعليق على موضوع
لتصلك إشعارات ردود هذا الموضوع على البريد الإلكترونى أضف علامة بالمربع بجوار كلمة "إعلامى"
=q =w =s =d =f =g =h =t =y =u =z =x =c =v =b =n =m =a =e =r

شكرا لتعليقك