====== ORNEKLER ======

Notlarımızı alacağımız, bir wiki

DokuWiki altyapısını kullanıyor ama bootswrapper ekledim...Aşağıdaki özellikleri kullanabiliyoruz..Dikkatimi çekenleri bu sayfada toparladım. \\
http://lotar.altervista.org/dokuwiki/wiki/plugin/bootswrapper \\
http://getbootstrap.com/components/  \\
\\
http://lotar.altervista.org/dokuwiki/wiki/syntax \\

====== TEXT ALAKALI ======

<TEXT align="left">Left aligned text.</TEXT> \\ 
<TEXT align="center">Center aligned text.</TEXT> \\
<TEXT align="right">Right aligned text.</TEXT> \\
<TEXT align="justify">Justified text.</TEXT> \\
<TEXT align="nowrap">No wrap text.</TEXT> \\

<code>
<TEXT align="left">Left aligned text.</TEXT> \\ 
<TEXT align="center">Center aligned text.</TEXT> \\
<TEXT align="right">Right aligned text.</TEXT> \\
<TEXT align="justify">Justified text.</TEXT> \\
<TEXT align="nowrap">No wrap text.</TEXT> \\
</code>

----

<text transform="lowercase">Lowercased text.</text> \\
<text transform="uppercase">Uppercased text.</text> \\ 
<text transform="capitalize">Capitalized text.</text> \\

<code>
<text transform="lowercase">Lowercased text.</text> \\
<text transform="uppercase">Uppercased text.</text> \\ 
<text transform="capitalize">Capitalized text.</text> \\
</code>

----

<text type="muted"> Renkli Yazı </text> \\
<text type="primary"> Renkli Yazı </text> \\
<text type="success"> Renkli Yazı </text> \\
<text type="info"> Renkli Yazı </text> \\
<text type="warning"> Renkli Yazı </text> \\
<text type="danger"> Renkli Yazı </text> \\

<code>
<text type="muted"> Renkli Yazı </text> \\
<text type="primary"> Renkli Yazı </text> \\
<text type="success"> Renkli Yazı </text> \\
<text type="info"> Renkli Yazı </text> \\
<text type="warning"> Renkli Yazı </text> \\
<text type="danger"> Renkli Yazı </text> \\
</code>


Arka zeminli yazı

<text background="primary"> Arkazemin Renkli </text> \\
<text background="success"> Arkazemin Renkli </text> \\
<text background="info"> Arkazemin Renkli </text> \\
<text background="warning"> Arkazemin Renkli </text> \\
<text background="danger"> Arkazemin Renkli </text> \\

You can use <sub>subscript</sub> and <sup>superscript</sup>, too.

This is some text with some linebreaks\\ yazı linebreaks'den sonra alt satıra geçti...Çift ters slash ile

You can add footnotes ((Bu alt referans notudur. çift parantez yeterli.)) by using double parentheses. (en altta not olarak referans vermek için)

Farklı kısaltmalar için kaynağa bakın...alttaki ikonlar misal\\ 
-> <- <-> => <= <=> >> << -- --- 640x480 (c) (tm) (r)
"He thought 'It's a man's world'..."

<code>
-> <- <-> => <= <=> >> << -- --- 640x480 (c) (tm) (r)
"He thought 'It's a man's world'..."
</code>

===== Alarm Tipleri =====

<alert type="success">Tebrikler</alert>
<alert type="info">Bilgi</alert>
<alert type="warning">Uyarı</alert>
<alert type="danger">Dikkat</alert>

<code>
<alert type="success">Tebrikler</alert>
<alert type="info">Bilgi</alert>
<alert type="warning">Uyarı</alert>
<alert type="danger">Dikkat</alert>
</code>
===== Akordiyon =====

<accordion>
<panel title="Sorun Giderme Adım #1">
Prizde Elektrik var mı? Elektrik kesilmiş olabilir.
</panel>
<panel title="Sorun Giderme Adım #2"> Bilgisayar ya da Konsol adaptörle çalışıyorsa, adaptör elektriğe takılı mı? </panel>
<panel title="Sorun Giderme Adım #3"> Adaptör çıkışı cihaza başlı mı? </panel>
</accordion>

<code>
<accordion>
<panel title="Sorun Giderme Adım #1">
Prizde Elektrik var mı? Elektrik kesilmiş olabilir.
</panel>
<panel title="Sorun Giderme Adım #2"> Bilgisayar ya da Konsol adaptörle çalışıyorsa, adaptör elektriğe takılı mı? </panel>
<panel title="Sorun Giderme Adım #3"> Adaptör çıkışı cihaza başlı mı? </panel>
</accordion>
</code>


===== Badge =====

Inbox <badge>42</badge>
 
<btn type="primary">Messages <badge>4</badge></btn>


===== Tuşlar =====
<btn type="default">Default</btn>
<btn type="primary">Primary</btn>
<btn type="success">Success</btn>
<btn type="info">Info</btn>
<btn type="warning">Warning</btn>
<btn type="danger">Danger</btn>
<btn type="link">Link</btn>

-----

<btn type="primary" size="lg">Large button</btn>
<btn type="default" size="lg">Large button</btn>
 
<btn type="primary">Default button</btn>
<btn type="default">Default button</btn>
 
<btn type="primary" size="sm">Small button</btn>
<btn type="default" size="sm">Small button</btn>
 
<btn type="primary" size="xs">Extra small button</btn>
<btn type="default" size="xs">Extra small button</btn>

<btn type="success" size="lg" icon="glyphicon glyphicon-edit">[[:wiki:welcome]]</btn>

<code>
<btn type="default">Default</btn>
<btn type="primary">Primary</btn>
<btn type="success">Success</btn>
<btn type="info">Info</btn>
<btn type="warning">Warning</btn>
<btn type="danger">Danger</btn>
<btn type="link">Link</btn>

-----

<btn type="primary" size="lg">Large button</btn>
<btn type="default" size="lg">Large button</btn>
 
<btn type="primary">Default button</btn>
<btn type="default">Default button</btn>
 
<btn type="primary" size="sm">Small button</btn>
<btn type="default" size="sm">Small button</btn>
 
<btn type="primary" size="xs">Extra small button</btn>
<btn type="default" size="xs">Extra small button</btn>

<btn type="success" size="lg" icon="glyphicon glyphicon-edit">[[:wiki:welcome]]</btn>
</code>
===== Calout =====
Uyarı penceresi gibi, alanlar açarak mesaj iletmenizi sağlar...

<callout>
=== Default Callout ===
This is a default callout.
</callout>
<code>
<callout>
=== Default Callout ===
This is a default callout.
</callout>
</code>


<callout title="Default Callout">
This is a default callout.
</callout>
<code>
<callout title="Default Callout">
This is a default callout.
</callout>
</code>

<callout type="primary" icon="true"> Basit uyarı için kullanılacak callout... </callout>
<code><callout type="primary" icon="true"> Basit uyarı için kullanılacak callout... </callout></code>
<callout type="success" icon="true"> Başarılı durumlarda kullanulacak! </callout>
<code><callout type="success" icon="true"> Başarılı durumlarda kullanulacak! </callout></code>
<callout type="info" icon="true"> Bilgilendirme amacıyla kullanılan callout </callout>
<code><callout type="info" icon="true"> Bilgilendirme amacıyla kullanılan callout </callout></code>
<callout type="warning" icon="true"> Uyarı amacıyla kullanılan callout </callout>
<code><callout type="warning" icon="true"> Uyarı amacıyla kullanılan callout </callout></code>
<callout type="danger" icon="true"> Tehlikeyi haber vermek için kullanılabilecek callout </callout>
<code><callout type="danger" icon="true"> Tehlikeyi haber vermek için kullanılabilecek callout </callout></code>



===== Carousel =====
Bildiğimiz galeri carousel'i oluşturmak için kullanılır... Basit olan versiyonda resim altlarına yazı, açıklama yazamazsınız...Diğerinde istediğiniz açıklamayı eklemek mümkün.

<carousel>
<slide>{{gokhan_resim2.jpg?direct&200|}}</slide>
<slide>{{gokhan_resim2.jpg?direct&200|}}</slide>
<slide>{{gokhan_resim2.jpg?direct&200|}}</slide>
</carousel>

<code>
<carousel>
<slide>{{gokhan_resim2.jpg?direct&200|}}</slide>
<slide>{{gokhan_resim2.jpg?direct&200|}}</slide>
<slide>{{gokhan_resim2.jpg?direct&200|}}</slide>
</carousel>
</code>
\\
<carousel>
<slide>{{gokhan_resim2.jpg?direct&200|}} 
<caption> === Gökhan === \\ CGTR Yöneticisi</caption>
</slide>

<slide>{{gokhan_resim2.jpg?direct&200|}} 
<caption> === Gökhan === \\ CGTR Yöneticisi</caption>
</slide>

<slide>{{gokhan_resim2.jpg?direct&200|}} 
<caption><label type="danger"> === Gökhan === \\ CGTR Yöneticisi</label></caption>
</slide>
</carousel>

<code>
<carousel>
<slide>{{gokhan_resim2.jpg?direct&200|}} 
<caption> === Gökhan === \\ CGTR Yöneticisi</caption>
</slide>

<slide>{{gokhan_resim2.jpg?direct&200|}} 
<caption> === Gökhan === \\ CGTR Yöneticisi</caption>
</slide>

<slide>{{gokhan_resim2.jpg?direct&200|}} 
<caption><label type="danger"> === Gökhan === \\ CGTR Yöneticisi</label></caption>
</slide>
</carousel>
</code>






===== Collapse =====
Açılır kapanır, alan oluşturuyor... Spoiler vermek isterseniz :)

<button collapse="foo">Tıkla açılsın/kapansın</button>
 
<collapse id="foo" collapsed="true"><well>Katil Bahçıvan...Filmin sonunda belli olacak.. </well></collapse>

<code>
<button collapse="foo">Tıkla açılsın/kapansın</button>
 
<collapse id="foo" collapsed="true"><well>Katil Bahçıvan...Filmin sonunda belli olacak.. </well></collapse>
</code>



===== Image =====
Resimler için 3 farklı gösterim şekli var... 

<image shape="rounded">
{{:gokhan_resim2.jpg?direct&200|}}
</image>
<code>
<image shape="rounded">
{{:gokhan_resim2.jpg?direct&200|}}
</image>
</code> \\

<image shape="circle">
{{:gokhan_resim2.jpg?direct&200|}}
</image>
<code>
<image shape="circle">
{{:gokhan_resim2.jpg?direct&200|}}
</image>
</code> \\

<image shape="thumbnail">
{{:gokhan_resim2.jpg?direct&200|}}
</image>
<code>
<image shape="thumbnail">
{{:gokhan_resim2.jpg?direct&200|}}
</image>
</code> \\
===== Jumbotron =====
Yazıların başına konulacak, giriş alanı benzeri bir bölüm... Arkazemin deseni kullanılanıda var.


<jumbotron>
====== Hello, world! ======
 
This is a simple hero unit, a simple jumbotron-style 
component for calling extra attention to featured
content or information.
 
<btn type="primary">[[#WIKI|Learn more]]</btn>
</jumbotron>
<code>
<jumbotron>
====== Hello, world! ======
 
This is a simple hero unit, a simple jumbotron-style 
component for calling extra attention to featured
content or information.
 
<btn type="primary">[[#WIKI|Learn more]]</btn>
</jumbotron>
</code>

===== Label =====
<label type="default">default</label> \\
<label type="primary">primary</label> \\
<label type="success">success</label> \\
<label type="info">info</label> \\
<label type="warning">warning</label> \\
<label type="danger">danger</label> \\

<code>
<label type="default">default</label> \\
<label type="primary">primary</label> \\
<label type="success">success</label> \\
<label type="info">info</label> \\
<label type="warning">warning</label> \\
<label type="danger">danger</label> \\
</code>

Not satır sonlarındaki çift ters slash alt satıra geçmek içindir.

===== Lead =====
Cümleyi öne çıkartmak için biraz daha büyük yazıyor... Lead

<lead>Ne ekersen, onu biçersin</lead>

<code><lead>Ne ekersen, onu biçersin</lead></code>


===== List Group =====
Listeleme, tablolama için kullanılıyor. Çeşitli içerikte olabilir, linkte.. [[http://lotar.altervista.org/dokuwiki/wiki/plugin/bootswrapper/list-group|External Link]]


<list-group>
  * Cras justo odio
  * Dapibus ac facilisis in
  * Morbi leo risus
  * Porta ac consectetur ac
  * Vestibulum at eros
</list-group>

<code>
<list-group>
  * Cras justo odio
  * Dapibus ac facilisis in
  * Morbi leo risus
  * Porta ac consectetur ac
  * Vestibulum at eros
</list-group>
</code>

----

<list-group>
  * Cras justo odio <badge>14</badge>
  * Dapibus ac facilisis in <badge>2</badge>
  * Morbi leo risus <badge>1</badge>
</list-group>

<code>
<list-group>
  * Cras justo odio <badge>14</badge>
  * Dapibus ac facilisis in <badge>2</badge>
  * Morbi leo risus <badge>1</badge>
</list-group>
</code>


<list-group>
  * {{fa>home}} [[start]] \\ Ana Sayfa
  * [[:wiki:welcome]] \\ DokuWiki Welcome
  * [[:wiki:syntax]] \\ DokuWiki Syntax
</list-group>

<code>
<list-group>
  * {{fa>home}} [[start]] \\ Ana Sayfa
  * [[:wiki:welcome]] \\ DokuWiki Welcome
  * [[:wiki:syntax]] \\ DokuWiki Syntax
</list-group>
</code>
===== Modal =====
İçerikleri Pop'up olarak pencerede açmak için kullanılır..Video, resim ya da yazı...

<btn type="primary" size="lg" modal="modal-demo">Launch demo modal</btn>
 
<modal id="modal-demo" title="Modal title">
=== Text in a modal ===
 
Duis mollis, est non commodo luctus, nisi erat porttitor ligula. 
video
{{youtube>PbpkCq9RqGo?medium}}

</modal>

<code>
<btn type="primary" size="lg" modal="modal-demo">Launch demo modal</btn>
 
<modal id="modal-demo" title="Modal title">
=== Text in a modal ===
 
Duis mollis, est non commodo luctus, nisi erat porttitor ligula. 
video
{{youtube>PbpkCq9RqGo?medium}}

</modal>
</code>


===== Navs =====
Navigasyon menü oluşturmak için

<nav type="pills">
  * [[:start]]
  * [[:wiki:plugin:bootswrapper:nav|Nav Plugin]]
  * [[playground:playground]]
  * DokuWiki
    * [[:wiki:welcome]]
    * [[:wiki:syntax]]
</nav>
\\

<code>
<nav type="pills">
  * [[:start]]
  * [[:wiki:plugin:bootswrapper:nav|Nav Plugin]]
  * [[playground:playground]]
  * DokuWiki
    * [[:wiki:welcome]]
    * [[:wiki:syntax]]
</nav>
</code>
===== Panels =====

Panel ve tablomsu yapmak için..

<panel type="primary" title="Panel title">Panel content</panel>
<panel type="success" title="Panel title">Panel content</panel>
<panel type="info" title="Panel title">Panel content</panel>
<panel type="warning" title="Panel title">Panel content</panel>
<panel type="danger" title="Panel title">Panel content</panel>
<code>
<panel type="primary" title="Panel title">Panel content</panel>
<panel type="success" title="Panel title">Panel content</panel>
<panel type="info" title="Panel title">Panel content</panel>
<panel type="warning" title="Panel title">Panel content</panel>
<panel type="danger" title="Panel title">Panel content</panel>
</code>
örnek 2

<panel type="default" title="Panel title" no-body="true">
<panel-body>Some default panel content here. Nulla vitae elit libero, a pharetra augue. Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit.</panel-body>
^ # ^ First Name ^ Last Name ^ Username ^
^ 1 | Mark       | Otto	     | @mdo     |
^ 2 | Jacob      | Thornton  | @fat     |
^ 3 | Larry      | the Bird  | @twitter |
</panel>

<code>
<panel type="default" title="Panel title" no-body="true">
<panel-body>Some default panel content here. Nulla vitae elit libero, a pharetra augue. Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit.</panel-body>
^ # ^ First Name ^ Last Name ^ Username ^
^ 1 | Mark       | Otto	     | @mdo     |
^ 2 | Jacob      | Thornton  | @fat     |
^ 3 | Larry      | the Bird  | @twitter |
</panel>
</code>
Fazlası için http://lotar.altervista.org/dokuwiki/wiki/plugin/bootswrapper/panel




===== TAG - ETIKET =====
Yazılara tag etiket eklemek için basit bir satırla ekleyebilirsiniz.

{{tag>dokuwiki doc bootstrap}}

<code>
{{tag>dokuwiki doc bootstrap}}
</code>
 --- //[[retroturk@gmail.com|Gökhan Sönmez]] 2016/12/31 13:17//