Forumlarınız için responsive sosyal ağlar ekleyin.

[Hatake]

Bu kodları nereye eklerseniz orada sorunsuz bir biçimde çıkacaktır. Responsivedir. Mobil cihazlarda yazılar çıkmaz yalnızca iconlar çıkar.
Demo vermek gerekirse;

Kod: Tümünü Seç Tümünü Kopyala

http://codepen.io/anon/pen/kXQPZR

Kurulum;
Temanızın global.css dosyasını açıp en sona ekleyin;

Kod: Tümünü Seç Tümünü Kopyala

@import url(https://fonts.googleapis.com/css?family=Open+Sans);
.sosyal {
 width: 100%;
 font-family: 'Open Sans';
 font-size: 14px;
}
.sosyal ul {
 padding: 0px;
 margin: 0px;
}
.sosyal ul li {
 float: left;
 padding: 10px;
 width: calc( 25% - 20px );
 width: -webkit-calc( 25% - 20px );
 text-align: center;
 display: inline-block;
 transition: all 250ms;
}
.sosyal ul li:first-child {
 border-radius: 5px 0px 0px 5px;
}
.sosyal ul li:last-child {
 border-radius: 0px 5px 5px 0px;
}
.sosyal ul li:hover {
 background: gray !important;
}
.sosyal ul li a {
 color: #fff;
 text-decoration: none;
}
.sosyal ul li.facebook {
 background: #3b5998;
}
.sosyal ul li.twitter {
 background: #00aced;
}
.sosyal ul li.instagram {
 background: #125688;
}
.sosyal ul li.pinterest {
 background: #cb2027;
}

@media not screen {
 .kontrol {display: none;}
}

@media screen and (max-width:425px) {
 .kontrol {display: none;}
}

HTML Kodunu da gözükmesini istediği yere ekleyin.

Kod: Tümünü Seç Tümünü Kopyala

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-T8Gy5hrqNKT+hzMclPo118YTQO6cYprQmhrYwIiQ/3axmI1hQomh7Ud2hPOy8SP1" crossorigin="anonymous">
<div class="sosyal">
<ul>
<li class="facebook"><a href="#"><i class="fa fa-facebook"></i> <span class="kontrol">facebook</span></a></li>
<li class="twitter"><a href="#"><i class="fa fa-twitter"></i> <span class="kontrol">twitter</span></a></li>
<li class="instagram"><a href="#"><i class="fa fa-instagram"></i> <span class="kontrol">instagram</span></a></li>
<li class="pinterest"><a href="#"><i class="fa fa-pinterest"></i> <span class="kontrol">pinterest</span></a></li>
</ul>
</div>

[Enes Bayraktar]

Dostum bu hataları yapmak zorundamısın.. Düzelttim buyur yeni link bukadar karmaşık ve düzensiz kod ilk defa görüyorum kendime derdim ama..@Hatake
http://codepen.io/coder-rj/pen/Pzxkxm Hızlı cevap'dan yazdığım için code tagları arasına alamadım...

[Hatake]

Dostum bu hataları yapmak zorundamısın.. Düzelttim buyur yeni link bukadar karmaşık ve düzensiz kod ilk defa görüyorum kendime derdim ama..@Hatake
http://codepen.io/coder-rj/pen/Pzxkxm Hızlı cevap'dan yazdığım için code tagları arasına alamadım...

A ya class vermişsin Li den alıp pekte bir şey yapmamışsın hata yoktu orta da. Ayrıca sen hata yapmışsın düzenlerken border-radius larıda a ya vermeyi unutmuşsun^^ Bir dahakine düzgün düzenlersin umarım.

---

Ek olarak senin yöntemin ile border-radiusları vermek aşırı derecede zahmetli oluyor deneyebilirsin.

[Enes Bayraktar]

Dostum bu hataları yapmak zorundamısın.. Düzelttim buyur yeni link bukadar karmaşık ve düzensiz kod ilk defa görüyorum kendime derdim ama..@Hatake
http://codepen.io/coder-rj/pen/Pzxkxm Hızlı cevap'dan yazdığım için code tagları arasına alamadım...

A ya class vermişsin Li den alıp pekte bir şey yapmamışsın hata yoktu orta da. Ayrıca sen hata yapmışsın düzenlerken border-radius larıda a ya vermeyi unutmuşsun^^ Bir dahakine düzgün düzenlersin umarım.

Dostum yapma ya biliyorsun halimi :) senin hatan li lere vermendi her zaman link olan şeyi a ya ver stilini li lerde margin'ler ve list style ile float kalsın yoksa çok yanlış gidersin mesela cursor:pointer yazmayıda bilirdim ancak yönlendirmezdi seninki sadece facebook butonuna basınca yönlendirmeydi yanlış kodlama yapma lütfen :) bana laf etmişsin gözümden kaçmış ne yapabilirim 2sn konulara bakarken düzenledim bu arada skype adresini yazarmısın benim sosyal ağım orası biliyorsun teşekkürler..

[Hatake]

Dostum bu hataları yapmak zorundamısın.. Düzelttim buyur yeni link bukadar karmaşık ve düzensiz kod ilk defa görüyorum kendime derdim ama..@Hatake
http://codepen.io/coder-rj/pen/Pzxkxm Hızlı cevap'dan yazdığım için code tagları arasına alamadım...

A ya class vermişsin Li den alıp pekte bir şey yapmamışsın hata yoktu orta da. Ayrıca sen hata yapmışsın düzenlerken border-radius larıda a ya vermeyi unutmuşsun^^ Bir dahakine düzgün düzenlersin umarım.

Dostum yapma ya biliyorsun halimi :) senin hatan li lere vermendi her zaman link olan şeyi a ya ver stilini li lerde margin'ler ve list style ile float kalsın yoksa çok yanlış gidersin mesela cursor:pointer yazmayıda bilirdim ancak yönlendirmezdi seninki sadece facebook butonuna basınca yönlendirmeydi yanlış kodlama yapma lütfen :) bana laf etmişsin gözümden kaçmış ne yapabilirim 2sn konulara bakarken düzenledim bu arada skype adresini yazarmısın benim sosyal ağım orası biliyorsun teşekkürler..

Skype kullanmıyorum, ayrıca linklere stil vermem hiç bir zaman bakabilirsin konularıma. Mybb yazılımınada bakabilirsin alt yapısına. Menü yazarken linklere mi yoksa menü stillerine mi stil veriyorlar. Umarım açıklayıcı bir cevap olmuştur.

[Hatake]

Hatalarımı normalde kabullenirim, bu işin uzmanı değiliz burada hiç birimiz ancak hata dediğin şeye neye göre hata dediğini algılayabilmiş değilim. Şu ana kadar yazdığım bir çok şeyi en baba webmaster forumlarında paylaştım ve kimse hata var demedi. Şaşırtıcı oldu benim için bu demecin, yine de teşekkürler bundan sonra daha çok makale okuyup gündemden uzak kalmam

[Enes Bayraktar]

Hatalarımı normalde kabullenirim, bu işin uzmanı değiliz burada hiç birimiz ancak hata dediğin şeye neye göre hata dediğini algılayabilmiş değilim. Şu ana kadar yazdığım bir çok şeyi en baba webmaster forumlarında paylaştım ve kimse hata var demedi. Şaşırtıcı oldu benim için bu demecin, yine de teşekkürler bundan sonra daha çok makale okuyup gündemden uzak kalmam

Daha önce yazdıklarında hata yoktu bu tarz şeylerde li ye verilmez box un style'i a ya verilirki ne tarafına basarsan bas yönlendirirsin hata dediğim basit bir şey yani :) ben her çalışmana bakıyorum bunda hata gördüm çok ağır algıladın galiba seviyorum seni inşallah iyi arkadaş oluruz tasarım güzel ancak dediğim gibi li yerine a lara ver yeter... gündem lik bir olay değil zaten responsive olayını iyi düşünmüşsün.. bende yapicagım birtane :)

[Gokss]

Hatalarımı normalde kabullenirim, bu işin uzmanı değiliz burada hiç birimiz ancak hata dediğin şeye neye göre hata dediğini algılayabilmiş değilim. Şu ana kadar yazdığım bir çok şeyi en baba webmaster forumlarında paylaştım ve kimse hata var demedi. Şaşırtıcı oldu benim için bu demecin, yine de teşekkürler bundan sonra daha çok makale okuyup gündemden uzak kalmam

Daha önce yazdıklarında hata yoktu bu tarz şeylerde li ye verilmez box un style'i a ya verilirki ne tarafına basarsan bas yönlendirirsin hata dediğim basit bir şey yani :) ben her çalışmana bakıyorum bunda hata gördüm çok ağır algıladın galiba seviyorum seni inşallah iyi arkadaş oluruz tasarım güzel ancak dediğim gibi li yerine a lara ver yeter... gündem lik bir olay değil zaten responsive olayını iyi düşünmüşsün.. bende yapicagım birtane :)

Kardeşim taktığın şeye bak ya hu ? Milletin hataları ile oyalanacağına (ki oyalan fakat böyle küçük bir hata ile değil - ki hata da değil) iki kodlama yap.

Bırak artık şurayı böyle yapsaydın burayı böyle yapsaydınları. Teşekkür et, gururunu okşa. Mete neyi ne yapmasını bilen biri. Bootstrap ile kodlayacakmış material ile kodla diyorsun. Bırak sana ne, ne ile kodlarsa kodlasın. Rahat bırak insanları.

O kadar kodlamanın karşılığı bu olmamalı lütfen...

[Hatake]

Hatalarımı normalde kabullenirim, bu işin uzmanı değiliz burada hiç birimiz ancak hata dediğin şeye neye göre hata dediğini algılayabilmiş değilim. Şu ana kadar yazdığım bir çok şeyi en baba webmaster forumlarında paylaştım ve kimse hata var demedi. Şaşırtıcı oldu benim için bu demecin, yine de teşekkürler bundan sonra daha çok makale okuyup gündemden uzak kalmam

Daha önce yazdıklarında hata yoktu bu tarz şeylerde li ye verilmez box un style'i a ya verilirki ne tarafına basarsan bas yönlendirirsin hata dediğim basit bir şey yani :) ben her çalışmana bakıyorum bunda hata gördüm çok ağır algıladın galiba seviyorum seni inşallah iyi arkadaş oluruz tasarım güzel ancak dediğim gibi li yerine a lara ver yeter... gündem lik bir olay değil zaten responsive olayını iyi düşünmüşsün.. bende yapicagım birtane :)

Kardeşim taktığın şeye bak ya hu ? Milletin hataları ile oyalanacağına (ki oyalan fakat böyle küçük bir hata ile değil - ki hata da değil) iki kodlama yap.

Bırak artık şurayı böyle yapsaydın burayı böyle yapsaydınları. Teşekkür et, gururunu okşa. Mete neyi ne yapmasını bilen biri. Bootstrap ile kodlayacakmış material ile kodla diyorsun. Bırak sana ne, ne ile kodlarsa kodlasın. Rahat bırak insanları.

O kadar kodlamanın karşılığı bu olmamalı lütfen...

Bak bu konuda da Göksel aşırı derece de haklı. Üzerine geldiğimizi düşünme şimdi toplanıp biz olgunlukla karşılayabiliriz ama aktiflik zaten az forum da üyeler de bizim kadar tecrübeli olmadığı için anlık bir sinirle cevap verebilir. Daha yumuşak bir dil ile eleştirirsen insanları asla olmaz bunlar. Zaten senle özelden de konuşmuşluğum var senin de amacının kötü olmadığını biliyorum @Enes Bayraktar umarım beni yanlış anlamazsın ne demek istediğimi anlarsın. Konu tatlıya bağlansın lütfen her birinize iyi geceler^^

[Enes Bayraktar]

Ben burada metenin gururunu kırıcak yada hakaret vs demedim bende değilim bu işin proföserü meteye bunu özel mesaj ilede ilettim teşekkür ettimmi ettim güzel olmuş dedimmi dedim ? sadece kodlamadaki hatayı söyledim evet bu bi hata sayilir ülkemizde öyle site kullanmayı bilmeyen kişiler varki facebook un face book yazısına tıklayacagına kıyısına köşesine tikliyor ? bu bir hatamıdır tam sayilmaz bug denilebilir yazım hatası denilebilir büyük bir hatamı hayır ? kodlama yapmadığımı nerden biliyorsun mybb için yapmıyorum farklı sistemler içinde yapmıyorum kendim için template arşivi oluşturuyorum ve meteye sorabilirsin rahat 5-6 kez pm olarak atmışımdır skype adresin varmı diye günde en az 3 saat kodlama yapan biriyim kendimi övmüyorum yanlış anlaşılmasın ama bilip bilmeden bukadar yorum yapma lütfen aradabir vaktim olunca paylaşıyorum burada 3 5 birşey... tartışma
olarak'da algılamayın sövüp saydığımız yok sohbet ediyoruz lütfen... karşılığını verdim zaten.

Edit: Mesajını yeni gördüm @Hatake tartışma vs yok tatlı konu zaten sinirlenen tarafta yok biraz tabirlerim kaba olabilir okadar oda şuanda sağlıklı bir kafayla olmadığım içindir (00:55 saat) burada ve sabahın 7 sinden beri bilgisayardayım göksel haklı tamam eyv ancak benim kötü bir niyetim yok burada kötü birşey de demedik ? eleştiri kaldıramıyorsan yada yazmıyorsan forumun bir anlamı yoktur forum bilgi alışverişi yapilan bir yerdir bunu anlayın yeter..

[hipolito]

Abi niye bozuntuya veriyorsunuz ki :) Güzel güzel beğenmediğinizi veya beğendiğinizi söyleyin yeter yani :) Eline sağlık diyip geçersin.. Bu arada ben beğendim hocam eline sağlık

[Hatake]

Enes ve Göksel beyler ikimizde normalde arkadaşımsınız bakın işi tatlıya bağlayacağınızı düşünüyorum. Konumu kilitlemek istemiyorum. Soruları olanlar olacaktır bu konu altından sorarlar. Böyle küçük bir meseleyi konu etmeyin boşverin. Gökselin önerilerini dikkate almanı öneririm Enes. Göksel'de eski bir arkadaşım benim o sert eleştirdiyse ben onun adına özür dilerim. Rica ediyorum size uzamasın konu.

[Enes Bayraktar]

Enes ve Göksel beyler ikimizde normalde arkadaşımsınız bakın işi tatlıya bağlayacağınızı düşünüyorum. Konumu kilitlemek istemiyorum. Soruları olanlar olacaktır bu konu altından sorarlar. Böyle küçük bir meseleyi konu etmeyin boşverin. Gökselin önerilerini dikkate almanı öneririm Enes. Göksel'de eski bir arkadaşım benim o sert eleştirdiyse ben onun adına özür dilerim. Rica ediyorum size uzamasın konu.

Benim tarafımdan sıkıntı yok minik bir tartışma yaşadık okadar oda bilgi alışverişi birbirimizi tarttık öneri verdik diyebiliriz eğer suçum varsa özür dilerim konuyu kirlettik @Gokks

[TaaRRuz]

Birşeyler yapan birisini düzeltmenin belli yöntemleri vardır.Bu şekilde kalkarak ya orası böyle olmaz dersen, yanlış anlaşılırsın.Bir şeyleri amacın zaten düzeltmekse özelden yaz.Yani burada onu ezerek ben biliyorumu göstermek doğru değil.Madem o kadar biliyorsun kendi kulvarında ki kişilerle yarış.Yani bir iddian varsa gerçekleştir.Daha mütevazi ve yapıcı olalım...

[xoxox]

Gayet güzel elinize sağlık. Üstüne gelindiğinde gri yerine renkler koyulaşsaydı daha iyiydi :) Göze hoş gelirdi.