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 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> \\

Lowercased text.
Uppercased text.
Capitalized text.

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

Renkli Yazı
Renkli Yazı
Renkli Yazı
Renkli Yazı
Renkli Yazı
Renkli Yazı

<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> \\

Arka zeminli yazı

Arkazemin Renkli
Arkazemin Renkli
Arkazemin Renkli
Arkazemin Renkli
Arkazemin Renkli

You can use _subscript and ^superscript, 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 ¹⁾ by using double parentheses. (en altta not olarak referans vermek için)

Farklı kısaltmalar için kaynağa bakın…alttaki ikonlar misal
→ ← ↔ ⇒ ⇐ ⇔ » « – — 640×480 © ™ ® “He thought 'It's a man's world'…”

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

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

<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>

Inbox 42

Messages 4

Default Primary Success Info Warning Danger Link

Large button Large button

Default button Default button

Small button Small button

Extra small button Extra small button

welcome

<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>

Uyarı penceresi gibi, alanlar açarak mesaj iletmenizi sağlar…

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

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

<callout type="primary" icon="true"> Basit uyarı için kullanılacak callout... </callout>

<callout type="success" icon="true"> Başarılı durumlarda kullanulacak! </callout>

<callout type="info" icon="true"> Bilgilendirme amacıyla kullanılan callout </callout>

<callout type="warning" icon="true"> Uyarı amacıyla kullanılan callout </callout>

<callout type="danger" icon="true"> Tehlikeyi haber vermek için kullanılabilecek callout </callout>

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.

Previous Next

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

=== Gökhan ===
CGTR Yöneticisi

=== Gökhan ===
CGTR Yöneticisi

=== Gökhan ===
CGTR Yöneticisi

Previous Next

<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>

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

Tıkla açılsın/kapansın

<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>

Resimler için 3 farklı gösterim şekli var…

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

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

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

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>

default
primary
success
info
warning
danger

<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> \\

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

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

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

Listeleme, tablolama için kullanılıyor. Çeşitli içerikte olabilir, linkte.. External Link

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

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

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

İçerikleri Pop'up olarak pencerede açmak için kullanılır..Video, resim ya da yazı…

Launch demo modal

<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>

Navigasyon menü oluşturmak için

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

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>

ö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>

Fazlası için http://lotar.altervista.org/dokuwiki/wiki/plugin/bootswrapper/panel

Yazılara tag etiket eklemek için basit bir satırla ekleyebilirsiniz.

{{tag>dokuwiki doc bootstrap}}

— Gökhan Sönmez 2016/12/31 13:17