اضافة مميزة للترحيب بشهر رمضان المبارك

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



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

معاينة الاضافة " من هنا "

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

اولا نتوجه الى لوحة التحكم في بلوجر > المظهر > تحريرHTML ثم نضغط على Ctrl+f ونبحث عن الوسم ]]></b:skin> ونلصق الكود التالي فوقه مباشرة :


    #welcomebox {position:fixed;top:5%;left:62%;width:auto;margin-left:-35%;z-index:1000000;text-align:center;}
    #welcomebox p{color:#fff;font-size:18px;line-height:1.6em;margin:25px 0 50px 20px;}
    .welcomeclose {background:#bbb;color:#111;border-radius:3px;padding:4px 10px;text-align:center;margin:0 auto;cursor:pointer;display:inline;}
    .welcomeclose:hover {background-color:#aaa}
    #welcomeoverlay {position:fixed !important;position:absolute; z-index:999999;top:0px;right:0px;bottom:0px;left:0px;background:#005629 url(http://store6.up-00.com/2017-05/149553312482631.png) no-repeat top center;}

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


- رابط الخلفية الاولى : http://store6.up-00.com/2017-05/14955343883081.png


- رابط الخلفية الثالنية : http://store6.up-00.com/2017-05/149553438847172.png

__________________________________________________

بعد ذلك نبحث عن الوسم <body> ونلصق الكود التالي اسفله مباشرة :

 <div id='welcomeoverlay'/>
    <div id='welcomebox'>
        <p>هلال هل من غيب الستائر ** رنت من نور طلته البشائر<br/><br/>
         ادارة المدونة تنهنئم بحلول شهر رمضان<br/><br/>
   سائلين الله ان يتقبل صيامكم وقيامكم<br/><br/>
          اللهم اجعلنا من عتقاء هذا الشهر , واغفر ماتقدم ممن ذنبنا وما تأخر<br/><br/>
وصلى اللهم وسلم على سيدنا محمد وعلى اله وصحبه وسلم</p>
             <div class='welcomeclose' onclick='document.getElementById(&quot;welcomebox&quot;).style.display=&quot;none&quot;;welcomeoverlay.style.display=&quot;none&quot;;'>انتقل الى الصفحة &#8594;</div>

      <a style='top:440px;right:500px;position:relative;font-size:10px' href='http://ar-cher.blogspot.com'>تصميم | محمد ارش</a>
      </div>     

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


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