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

عادة هذه الاضافة تجدونها في المواقع التي تقدم اضافات بلوجر بصفة عامة واليوم ساتكلم عن طريقة اضافتها، لن أشارككم فقط السكربت الذي يجعل الاضافة لها تاثير جميل جدل في ,بل ايضا يرافقه خط اجنبي اكثر من رائع, فانا صممت الاضافة و قمت بتطويرها و جعلها افضل من السابق وبناء على طلباتكم وضعت تدوينة .
الآن يمكنكم رؤية المعاينة قبل أن ندخل للشرح

الآن يمكنكم رؤية المعاينة قبل أن ندخل للشرح

- اذهب الى لوحة التحكم ثم
تحرير "HTML" - وابحث عن كلمة
<head/> والصق الاكواد التالية فوقها :
<style> #header-wrap_slider {background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnwEcBZdPf7Dlq4P0vH3oyccEiZwlScoyiR-IAkfLItZg2KiRXpFTC1YzKfp_l-geIbZzRUNeZ8bsooFfeBw7vt8VOD_OFI66ZWeqU3SArWCZytE_IjzqZVVUtIfoYRg3MZqY3Mywag6g/s1600/home.jpg); background-repeat: repeat; background-attachment: fixed; background-position: center center!important; background-size: cover;margin: auto 0; height: 250px; margin-bottom: 5px; margin-top: 10px; border: 5px solid #fff; overflow: hidden;}.titlewrapper-jazairiweb {margin: 20px; text-align: center; font-weight: normal; color: rgb(255, 255, 255); background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%,rgba(255, 255, 255, 0.01) 1%,rgba(255, 255, 255, 0.35) 50%,rgba(255, 255, 255, 0) 100%); font-size: 26.3px; font-family: Electrolize,ge_dinar_tworegular; }#header-wrap_info { background: #fff; margin: auto 0; height: auto; overflow: hidden;margin-top: 15px; } </style> <style> .letter-jazairiweb { height: 215px; margin: 0; z-index: 99999; margin-top: 48px;}.letter-jazairiweb h2 {font-weight: normal; font-family: Niconne,ge_dinar_tworegular; letter-spacing: 3px; text-align: center; }.letter-jazairiweb h2 a:first-child { font-family: Niconne,ge_dinar_tworegular; } .letter-jazairiweb h2 a { display: block; font-size: 130px; line-height: 122px;margin-bottom: -34px;}.letter-jazairiweb h2 a span:nth-child(1) { animation-delay: 0s; moz-animation-delay: 0s; ms-animation-delay: 0s; webkit-animation-delay: 0s; } .letter-jazairiweb h2 a span { animation: sharpen .9s linear backwards; color: #fff; moz-animation: sharpen .9s linear backwards; moz-transition: all .3s linear; ms-animation: sharpen .9s linear backwards; ms-transition: all .3s linear; opacity: 1; o-transition: all .3s linear; text-shadow: 0 0 2px #fff,1px 1px 4px rgba(0,0,0,.7); transition: all .3s linear; webkit-animation: sharpen .9s linear backwards; webkit-transition: all .3s linear; }.letter-jazairiweb h2 a span:nth-child(2) { animation-delay: .1s; moz-animation-delay: .1s; ms-animation-delay: .1s; webkit-animation-delay: .1s; }.letter-jazairiweb h2 a span:nth-child(4) { animation-delay: .3s; moz-animation-delay: .3s; ms-animation-delay: .3s; webkit-animation-delay: .3s; }.letter-jazairiweb h2 a span:nth-child(3) { animation-delay: .2s; moz-animation-delay: .2s; ms-animation-delay: .2s; webkit-animation-delay: .2s; }.letter-jazairiweb h2 a:last-child { font-family: Niconne,ge_dinar_tworegular; font-size: 35px!important; } </style>
- وهدا كود الاضافة ضعه في المكان الدي يناسبك :
<header class='jazairiweb_wrap_jazairiweb wow bounceIn animated' id='header-wrap_slider'> <div id='poster'> <div class='letter-jazairiweb' id='letter-jazairiweb'> <h2> <a href='/'><span class='char1'>JazairiWeb</span><span class='char2'> </span> <span class='char3' style='color:#F74047;font-family: Clicker Script;font-weight: normal;'>2016</span> <span class='char4'> </span> </a><a href='/' style='font-size:52px;style='color:#f74047;font-family: clicker script;font-weight: normal;'> <span class='char1'>افضل موقع </span> <span class='char2'/> <span class='char3'>جزائري </span> <span class='char4'/> <span class='char5'>لتصبح </span> <span class='char6'/> <span class='char7'>مدون </span> <span class='char8'/> <span class='char9'>محترف </span> </span></span></span></span></a></h2></div></div> </header>
لتشغيل تاثير اللمعان و الخط المزخرف فقط ضع الكود التالي اسفل <b:skin/>
<link href='https://googledrive.com/host/0B2v7cH8soLJrOWlYOG9LSEY0eGs' rel='stylesheet' type='text/css'/><link href='http://fonts.googleapis.com/css?family=Clicker+Script' rel='stylesheet' type='text/css'/>