Şık Footer Alanı Ekleme(Blogger,Wordpress vb)

Paylaşan Admin

10 Şubat 2019 Pazar

Şık Footer Alanı Ekleme(Blogger,Wordpress vb)
#wordpress #blogger #css #javascript #footer #style #styles #blog #add #eklemek

Merhabalar,
Sizde sitenize çok güzel bir footer alanı eklemek ister misiniz?
Aşağıda ki adımları adım adım uygulayarak siz de bu güzel footer alanını sitenize ekleyebilirsiniz.

1-<footer class='footerKodunu aratın ve çıkan bloğu aşağıda ki kodla değişitirin

<footer class='ct-footer'> <div class='container-fluid'> <div class='subscribe-widget2' id='subwid2'> <div class='form-promo2'> <font color='green'><i class='fa fa-envelope'/></font> <h3>Blog Yazılarını Kaçırma</h3> <h4>Bu blogda yayımlanacak yeni yazılardan haberdar olmak için e-posta adresini yazıp abone olabilirsin.</h4> </div> <div class='tl-rssform'> <form action='https://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;https://feedburner.google.com/fb/a/mailverify?uri=feedburnerUserName&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'> <input class='mail-field2' name='email' placeholder='Mail adresini yaz' type='text'/> <input name='uri' type='hidden' value='cemozergungor'/> <input name='loc' type='hidden' value='tr_TR'/> <input class='mail-button2' type='submit' value='Abone Ol'/> </form> </div> <div class='form-policy2'><p><span>*</span>Kesinlikle spam mail gönderilmez </p></div> </div> <ul class='ct-footer-list text-center-sm'> <li> <h2 class='ct-footer-list-header'>Blogger</h2> <ul> <li> <a href='#'><i class='far fa-hand-point-right'/> DÜZENLE</a> </li> <li> <a href='#'><i class='far fa-hand-point-right'/> DÜZENLE</a> </li> <li> <a href='#'><i class='far fa-hand-point-right'/> DÜZENLE</a> </li> <li> <a href='#'><i class='far fa-hand-point-right'/> DÜZENLE</a> </li> </ul> </li> <li> <h2 class='ct-footer-list-header'>SEO</h2> <ul> <li> <a href='#'><i class='far fa-hand-point-right'/> DÜZENLE</a> </li> </ul> </li> <li> <h2 class='ct-footer-list-header'>Adsense</h2> <ul> <li> <a href='#'><i class='far fa-hand-point-right'/> DÜZENLE</a> </li> </ul> </li> <li> <h2 class='ct-footer-list-header'>Oyun</h2> <ul> <li> <a href='#'><i class='far fa-hand-point-right'/> DÜZENLE</a> </li> <li> <a href='#'><i class='far fa-hand-point-right'/> DÜZENLE</a> </li> <li> <a href='#'><i class='far fa-hand-point-right'/> DÜZENLE</a> </li> <li> <a href='#'><i class='far fa-hand-point-right'/> DÜZENLE</a> </li> <li> <a href='#'><i class='far fa-hand-point-right'/> DÜZENLE</a> </li> </ul> </li> <li> <h2 class='ct-footer-list-header'>Film</h2> <ul> <li> <a href='#'><i class='far fa-hand-point-right'/> DÜZENLE</a> </li> <li> <a href='#'><i class='far fa-hand-point-right'/> DÜZENLE</a> </li> <li> <a href='#'><i class='far fa-hand-point-right'/> DÜZENLE</a> </li> <li> <a href='#'><i class='far fa-hand-point-right'/> DÜZENLE</a> </li> </ul> </li> </ul> <div class='ct-footer-meta text-center-sm'> <div class='row'> <div class='col-sm-6 col-md-2'> <img alt='logo' height='50' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiuWqTHKQ1OTT4yw-vBSZMmKdjSpalwQhyphenhyphenlO_gQ4cJox7qbl-ud4NR-esNXdOd_uXNxmcTePW3MMdg3DpLWOUmOqQwreJ9lUg5XveCdH661nsPTz1uICDnjukFlc-z6Fk6Kh8Kv4wBtPrQn/h120/icon.png' title='cem özer güngör logo' width='50'/> </div> <div class='col-sm-6 col-md-3'> <address> <span>SiteAdı<br/></span>Blog Yazarı<br/> Pendik,İstanbul<br/> <span>Tel: <a href='tel:5555555555'>(555) 555-5555</a></span> </address> </div> <div class='col-sm-6 col-md-2 ct-u-paddingTop10'> <a href='#EKLENECEK' target='_blank'><img alt='app store' src='https://www.solodev.com/assets/footer/appstore.png' title='cem özer güngör appstore uygulaması'/></a> </div> <div class='col-sm-6 col-md-2 ct-u-paddingTop10'> <a href='#EKLENECEK' target='_blank'><img alt='google play store' src='https://www.solodev.com/assets/footer/androidstore.png' title='cem özer güngör android uygulama'/></a> </div> <div class='col-sm-6 col-md-3'> <ul class='ct-socials list-unstyled list-inline'> <li> <a href='#Facebooksayfanız' target='_blank'><img alt='facebook' src='https://www.solodev.com/assets/footer/facebook-white.png' title='cem özer güngör facebook'/></a> </li> <li> <a href='#twittersayfanız' target='_blank'><img alt='twitter' src='https://www.solodev.com/assets/footer/twitter-white.png' title='cem özer güngör twitter'/></a> </li> <li> <a href='#youtubekanalınız' target='_blank'><img alt='youtube' src='https://www.solodev.com/assets/footer/youtube-white.png' title='cem özer güngör youtube'/></a> </li> <li> <a href='#instagramprofiliniz' target='_blank'><img alt='instagram' src='https://www.solodev.com/assets/footer/instagram-white.png' title='cem özer güngör instagram'/></a> </li> <li> <a href='#pinterestkanalınız' target='_blank'><img alt='pinterest' src='https://www.solodev.com/assets/footer/pinterest-white.png' title='cem özer güngör pinterest'/></a> </li> </ul> </div> </div> </div> </div> <div class='ct-footer-post'> <div class='container-fluid'> <div class='inner-left'> <ul> <li> <a href='/p/gizlilik-politikas.html'>Gizlilik Politikası</a> </li> <li> <a href='/p/hakkmda.html'>Hakkımda</a> </li> <li> <a href='/p/forum.html'>İletişim</a> </li> </ul> </div> <div class='inner-right'> <p>Copyright <i class='fas fa-copyright'/> 2013-2019 &lt;a href=&quot;https://www.cemozergungor.com/&quot; title=&quot;Cem Özer GÜNGÖR | Blog&quot;&gt;Tüm Hakları Saklıdır&lt;/a&gt;</p> <p><i class='fas fa-user-secret'/> İzinsiz Kopyalanamaz,Paylasilamaz&lt;/p&gt;</p> </div> </div> </div> </footer>

2- <b:skin> kodunu aratın ve aşağıda ki kodları <b:skin> kodunun hemen altına ekleyin

/* CEMOZERGUNGOR.COM FOOTER ALANI */ .subscribe-widget2{position:relative;overflow:hidden;border:1px solid #e6e6e6;text-align:center;margin:25px 0;padding:30px 0} .form-promo2 i{font-size:50px;margin-bottom:25px} .form-promo2 h3{color:white;text-transform:uppercase;margin:0 0 10px 0} .form-promo2 h4{color:white;font-weight:400;font-size:17px;margin:0 0 15px} .form-policy2 p{color:white;font-size:12px;margin:10px 0 0} .form-policy2 p span{color:red;padding-right:5px} input.mail-field2:hover,input.email-field:focus{border:1px solid rgba(0,0,0,0.3)!important;} input.mail-field2{font:normal normal 12px 'Open Sans', sans-serif;display:inline-block;width:50%;color:white;background:none!important;border:1px solid #e6e6e6!important;text-indent:20px;outline:none!important;height:20px;padding:10px 0!important;} input.mail-button2{font:normal normal 14px 'Open Sans', sans-serif;font-weight:500;height:43px;cursor:pointer;border:1px solid #e6e7e8;background:#f1921a;color:#fff;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;outline:0;transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-webkit-transition:all .3s ease-in-out;padding:0 10px} input.mail-button2:hover{background:green;color:white} .sora-author-box2 { border: 1px solid #e6e7e8; background: #fff; overflow: hidden; padding: 5px; margin: 10px 0; font-size:12px; } html, body, img, figure { max-width: 100%; } html, body { overflow-x: hidden; color: #000; -ms-overflow-style: scrollbar; -webkit-font-smoothing: antialiased; } a, a:hover, a:focus, a:active { text-decoration: none; color: inherit; } a { -webkit-transition: all .25s ease-in-out; transition: all .25s ease-in-out; } .ct-u-paddingTop10 { padding-top: 10px !important; } .ct-footer { background-color: #111; padding-top: 70px; margin-top: 20px; position: relative; } .ct-footer-pre { width: 100%; padding-bottom: 55px; border-bottom: 1px solid #555; border-bottom: 1px solid rgba(255, 255, 255, 0.1); } .ct-footer-pre span { font-family: 'Open Sans Condensed', sans-serif; color: #ebebeb; font-size: 30px; } .ct-footer-pre .form-group { position: relative; margin: 0; } .ct-footer-pre .form-group:before, .ct-footer-pre .form-group:after { content: ''; display: table; } .ct-footer-pre .form-group:after { clear: both; } .ct-footer-pre .form-group input { border: 1px solid #00bff3; background-color: #333; color: #fff; height: 50px; padding: 0 30px; margin: 0 5px; border-radius: 0 !important; } .ct-footer-pre .form-group button { height: 50px; position: relative; width: 80px; padding: 0 } .ct-footer-list { padding: 50px 0; list-style: none; padding-left: 0; display: table; width: 100%; border-bottom: 1px solid #555; border-bottom: 1px solid rgba(255, 255, 255, 0.1); } .ct-footer-list > li .ct-footer-list-header { font-family: 'Open Sans Condensed', sans-serif; color: #00bff3; font-size: 30px; } .ct-footer-list > li ul { list-style: none; padding-left: 0; } .ct-footer-list > li ul li a { color: #fff; } .ct-footer-list > li ul li a:hover, .ct-footer-post a:hover { text-decoration: underline; } .ct-footer-post { background: #000; padding: 30px 0; } .ct-footer-post .inner-left, .ct-footer-post .inner-right { padding: 20px 0; } .ct-footer-post ul { list-style: none; padding-left: 0; margin: 0 -20px; } .ct-footer-post ul li { display: inline-block; margin: 0 20px; } .ct-footer-post a { color: #fff; } .ct-footer-post p { color: #fff; } .ct-footer-meta { padding-top: 30px; } .ct-footer-meta .ct-socials { padding: 20px 0; } .ct-footer-meta .ct-socials li { padding: 0 3px; } .ct-footer--with-button { padding-top: 150px; } address { color: #fff; display: inline-block; } address span { font-weight: 600; } address a { color: #fff; } address a:hover { text-decoration: underline; } .btn { font-family: 'Open Sans Condensed', sans-serif; border-radius: 0; border: none; text-transform: uppercase; color: #111; font-size: 26px; padding: 12px 30px; } .btn.btn-motive { background-color: #00bff3; -webkit-transition: all .25s ease; transition: all .25s ease; } .btn.btn-motive:hover, .btn.btn-motive:hover:active { background-color: #00bff3; } .btn.btn-violet { color: #fff; background-color: #4f4f99; -webkit-transition: all .25s ease; transition: all .25s ease; } .btn.btn-violet:hover { background-color: #37376b; } .btn.btn-violet:hover:active { background-color: #2f2f5b } .btn.btn-green { color: #fff; background-color: #43670f; -webkit-transition: all .25s ease; transition: all .25s ease; } .btn.btn-green:hover { background-color: #36520c; } .btn.btn-green:hover:active { background-color: #314a0b; } .btn.btn-red { color: #fff; background-color: #da2229; -webkit-transition: all .25s ease; transition: all .25s ease; } .btn.btn-red:hover { background-color: #ae1b21; } .btn.btn-red:hover:active { background-color: #9d181e } .btn.btn-white { background-color: #fff; -webkit-transition: all .25s ease; transition: all .25s ease; } .btn.btn-white:hover { background-color: #d9d9d9; } .btn.btn-white:hover:active { background-color: #c9c9c9 } .btn.btn-large { padding: 20px 50px; font-size: 30px; white-space: normal; } .ct-mediaSection { background-attachment: fixed; } .ct-section_header--type1 { font-family: 'Open Sans Condensed', sans-serif; color: #000; font-size: 115px; text-transform: uppercase; } .ct-section_header--type2 small { font-family: 'coquette', fantasy; font-size: 58px; line-height: .7; display: block; font-weight: 700; position: relative; left: -12px; } .ct-section_header--type2 span { font-family: 'Bebas Neue'; font-size: 115px; line-height: .8; } .ct-section_header--type2 img { display: inline-block; float: left; position: relative; top: 15px; padding-right: 3px; } .ct-section_header--type3 { text-align: center; } .ct-section_header--type3 small { font-family: 'coquette', fantasy; font-size: 50px; padding: 15px 0; font-weight: 700; color: #fff; background-image: url("/core/fileparse.php/16/urlt/../images/ribbon.png"); background-size: contain; background-repeat: no-repeat; background-position: center; display: block } .ct-section_header--type3 span { font-family: 'Bebas Neue'; font-size: 150px; font-weight: 400; text-transform: uppercase; line-height: .85 } .ct-section_header--type4 { text-align: center; } .ct-section_header--type4:before, .ct-section_header--type4:after { content: ''; display: table } .ct-section_header--type4:after { clear: both } .ct-section_header--type4 small { font-family: 'coquette', fantasy; font-size: 50px; color: inherit; font-weight: 700; display: block } .ct-section_header--type4 span { font-family: 'nimbus-sans-condensed', sans-serif; font-weight: 400; font-weight: bold; font-size: 150px; text-transform: uppercase; display: block; line-height: .7 } .ct-section_header + p { font-size: 30px; font-weight: 700; letter-spacing: -1.5px; text-align: center; } .ct-section_header--type4 + p { font-family: 'nimbus-sans-condensed', sans-serif; font-weight: 400; font-size: 40px; font-weight: 700; line-height: 1; } /* Media Queries */ @media (min-width:1200px) { .ct-footer-pre { display: table; } .ct-footer-pre > .inner { display: table-cell; vertical-align: middle; } .ct-footer-list > li { width: 20%; display: table-cell; vertical-align: top; } .ct-footer-list > li:last-child { width: 7%; } } @media (max-width:1199px) { .ct-footer-pre .form-group { padding-top: 15px } } @media (max-width: 1199px) { .ct-footer-list > li { display: inline-block; float: left; } } @media (min-width:992px) { .ct-footer-post .inner-left { float: left; } .ct-footer-post .inner-right { float: right; } } @media (max-width:991px) { .ct-footer-post { text-align: center; } } @media (min-width: 768px) and (max-width: 1199px) { .ct-footer-list > li { width: 33.3333%; } } @media (min-width:768px) { .ct-footer-post p { display: inline-block; } .ct-footer-post p + p { padding-left: 50px; } } @media (max-width:767px) { address { padding-top: 30px; } } @media (min-width: 480px) and (max-width:767px) { .ct-footer-list > li { width: 50%; } } @media (min-width:480px) { .ct-footer-pre .form-group button { top: -1px; } .ct-footer-pre .form-group input { width: 331px; } } @media (max-width:479px) { .ct-footer-pre .form-group input { float: left; width: 70%; margin: 0; } .ct-footer-pre .form-group button { float: left; width: 30%; } .ct-footer-list > li { width: 100%; text-align: center; } .ct-footer-list { padding: 20px 0; } .btn.btn-large { padding: 20px 10px; line-height: .9; font-size: 26px; letter-spacing: -.2px; } .ct-section_header--type1 { font-size: 60px; line-height: .8; } .ct-section_header + p { font-size: 22px; } .ct-section_header--type3 small { font-size: 25px; } .ct-section_header--type4 small { font-size: 40px; } .ct-section_header--type3 span { font-size: 90px; } .ct-section_header--type4 span { font-size: 80px; } .ct-section_header--type4 + p { font-size: 28px; } }

3- <head> kodunu aratın ve aşağıda ki kodları hemen altına ekleyin

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> <><link href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css' rel='stylesheet'/>

İşlem bu kadar!
Kaydedip,sitemizi açıyoruz ve en alta iniyoruz.Kontrol ediyoruz.
Herhangi yapamadığınız bir nokta olursa,yorum kısmından belirtebilirsiniz.

Bunu Paylaş :