Bootstrap tablo nasıl ekleyebilirim

10-05-2016, 15:12:39

Konu belki yanlış yer olabilir bootstrap ile ilgili bir bölüm göremedim. Wp siteme basit bir bootstrap tablo eklemek istiyorum nasıl yapabilirim?

10-05-2016, 15:18:02

#2

Rigobert

Özel bir sayfada mı göstereceksinzi yoksa yazı içeriğinde mi?

ikiside farketmez aslında. Öncelikle bootstrap'ın css ini sayfaya dahil etmeniz gerekir.
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">

Bu adreste örnek tablo html kodları mevcut.
http://v4-alpha.getbootstrap.com/content/tables/
Umarım işine yarar

html kodları konu içeriğine yazabiliyorsun.
Sayfa olarak yapacaksan eğer wordpress page-slug olayına bakabilirsin

10-05-2016, 15:26:36

#3

McCoy

Rigobert adlı üyeden alıntı: mesajı görüntüle

Özel bir sayfada mı göstereceksinzi yoksa yazı içeriğinde mi?

ikiside farketmez aslında. Öncelikle bootstrap'ın css ini sayfaya dahil etmeniz gerekir.
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">

Bu adreste örnek tablo html kodları mevcut.
http://v4-alpha.getbootstrap.com/content/tables/
Umarım işine yarar

html kodları konu içeriğine yazabiliyorsun.
Sayfa olarak yapacaksan eğer wordpress page-slug olayına bakabilirsin

Aşağıdaki şekilde kullanmak istiyorum farkı varmı bilmiyorum gerçi ama. Bu arada bootstrap css sayfaya dahil etmeniz gerekiyor demişsiniz. Nereye yapıştıracağım bu kodu. Wp'de hemen hemen her sayfada bu tabloyu kullanacağım.

<div class="row">
<div class="col-xs-6 col-md-4">.col-xs-6 .col-md-4</div>
<div class="col-xs-6 col-md-4">.col-xs-6 .col-md-4</div>
<div class="col-xs-6 col-md-4">.col-xs-6 .col-md-4</div>
</div>

10-05-2016, 22:39:56

#4

Rigobert

McCoy adlı üyeden alıntı: mesajı görüntüle

Aşağıdaki şekilde kullanmak istiyorum farkı varmı bilmiyorum gerçi ama. Bu arada bootstrap css sayfaya dahil etmeniz gerekiyor demişsiniz. Nereye yapıştıracağım bu kodu. Wp'de hemen hemen her sayfada bu tabloyu kullanacağım.

<div class="row">
<div class="col-xs-6 col-md-4">.col-xs-6 .col-md-4</div>
<div class="col-xs-6 col-md-4">.col-xs-6 .col-md-4</div>
<div class="col-xs-6 col-md-4">.col-xs-6 .col-md-4</div>
</div>

o css dosyasını header.php ye koyabilirsiniz. Genel tasarıma etki edebilir onun için kesin birşey diyemem.

Bu altta verdiğiniz kod ise Orta boyutlu ve büyük ekranlarda 3 tane yan yana gözüken div(col-md-4 yani "md" ile orta veya daha büyük ekranlarda, 12 alanın 4 ünü kullan diyorsunuz) ve (col-xs-6 yani Mobil cihazlarda 2 tane yan yana gözüksün diğeri aşağı insin diyorsunuz. Bunlara dikkat ederek yapabilirsiniz tabiki.)