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

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

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

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

الاضافات وطريقة تركيبها

جميع هذه الاضافات طريقة تركيبها بسيطة جدا فقط ادخل على لوحة التحكم في بلوجر > التخطيط > اضافة اداة > اداة HTML/Javascript ثم الصق بداخلها كود الاضافة التي تريدها .

الاضافة الاولى

عبارة عن فانوس يتم تركيبه اعلى يسار المدونة , ييحتوى على صورة محركة " رمضان كريم " , اضافة بسيطة ومميزة يمكن استخدامها وتركيبها بكل سهولة ..

<!-- Ramadan Mubarak By ar-cher.Blogspot.com . START -->
<div style="float:left;position:absolute;left:0px;top:0px">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh18hSlYQmmTDI22d6kuBGeSeEyaiO5I8jmcIkPvjzLM9lN7v8Hq5l3FhEKEbh0FRKKnXvS7jX9-SNQ3yfsUz6hZiXVIojORMrA2Fo9rf7xCf2RVxyIF3RyABXwovv4JWc0aSMB0-Ui6yRF/s1600/Ramadan+Mubarak+-+www.afkarpro.blogspot.com.gif" alt="رمضان كريم"/>
</div>
<!-- smmor END -->
<!-- smmor START -->
<div style="float:left;position:absolute;left:0px;top:82px">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcR1-P-8E0pLnSCaFN4jeldWScTkZQIpX58oVoBka1I5vMykm7M4NEZRqjJ2Wkmx7fUzgOaMtQ3Qs2ldlXpb6F7r3ftnWQ6AnzvBnnxerWYK61kfyw5sEX3aCDA-XQuEI6dyH6JOs7hjtc/s1600/fan-3+-+www.st-tek.blogspot.com.png" width="50,height="100" alt="رمضان كريم" title="رمضان مبارك سعيد" border="0"/>
</div>
<!-- smmor END -->
<!-- smmor START -->
<div style="float:left;position:absolute;left:0px;top:230px">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiuvZAjtYsH6_cX_-gyuFM94CrZQjKbzylrei1ua1nQEE6radyoNyCjpyi4IVUg0rqEHHodJ0VoLrMreUWdw3ltXKm0xfV4fNxd7eoButTqrYE79w7zDq7myX-Xxq4kouVQaVNHitnAJJEd/s1600/fan-2+-+www.st-tek.blogspot.com.png" width="50,height="100" alt="رمضان كريم" title="رمضان مبارك سعيد" border="0"/>
</div>
<!-- Ramadan Mubarak By ar-cher.Blogspot.com . END -->

الاضافة الثانية

عبارة عن صورة " رمضان كريم " تركب اسفل يسار الصفحة وتتحرك مع الصفحة طلوعا ونزولا , بسيطة واحترافية وخفيفة على القالب .

<a href="http://ar-cher.blogspot."><img alt="Best Blogger Tips" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrgoavouh941aflf7jVbXqIz7ytfhzE6q0lGIgwtInsOavNbTtublTwBJKOZpi-ZeBoSnUi2QjQZueCzsyGmmnt9lS1OLwTK9JIx2KwX5QVIADQ2ghLGgHyDRkxbaEqFg0peJ20XJXB5K_/s1600/best+blogger+tips+-+www.st-tek.blogspot.com.png" /></a><div style="position: fixed; top: 80%; left: 3%;">
<a href="http://st-tek.blogspot.com" rel="nofollow" target="_blank"><img alt="Blog Tips" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVMdXTheddhJDcg5H1lgIBpjZ-otqNTFpzFh6dHgMnJUBDXuI_tjJG4pWXyXj70nHPuqPMvxaSL5qTjANa_2xBAbMntmhyuUjPcrpH1pwCErgm1TYF02CzKc4X-1gRE6JUP3BdlF6E7I94/s1600/Ramadan-Karim+-+www.st-tek.blogspot.com.png" /></a></div>

الاضافة الثالثة

هذه الاضافة تختلف عن الاضافة السابقة فهي عبارة عن صفحة يتم عرضها للزائر قبل التوجه الى صفحة الموضوع , تحتوى الصفحة على عبارات تهنئة بحلول شهر رمضان ويظهر فيها زر " اكمل القراءة " للتوجه الى صفحة الموضوع ..

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

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

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

    #welcomebox {position:fixed;top:5%;left:50%;width:70%;margin-left:-35%;z-index:1000000;text-align:center;}
    #welcomebox p{color:#fff;font-size:150%;line-height:1.6em;margin:-5px 0 50px;}
    .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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0egoflbPfy9RSTR5TigA6bip8s2YD6kcgb9-ZkYWgTnhDacXV2r28CtDZo0m3BfUxHGkLbhQkk5OBqCz9cVQj3db2_QZN6emsq1GC_5OnynrAT7DL5Fdw8RhUlioyqCetCD-MxEywRdDA/s1600/Wallpaper.jpg) no-repeat top center;}

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

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

ثم نقوم بحفظ القالب , وبعد ذلك ستعمل الاضافة ...

هذه كانت مجموعة صغيرة من الاضافات للترحيب بشر رمضان ودمتم في حفظ الله ورعايته 

{ صلوا على الحيب , صلى الله عليه وسلم }

الكاتب : Unknown

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

شارك المقال

شاركه على فيسبوكشاركه على جوجل+