## Feature *Includes* Bonanza page

Check all the includes. Steal Code! 

----------

### Image Options

#### Image from Collection (auto caption)

{% include feature/image.html objectid="demo_001" width="75" %}

Example Code --> `{% raw %}{% include feature/image.html objectid="demo_001" width="75" %}{% endraw %}`


#### Image from Collection (with a caption)

{% include feature/image.html objectid="demo_001" width="75" caption="an image" %}

Example Code --> `{% raw %}{% include feature/image.html objectid="demo_001" width="75" caption="an image" %}{% endraw %}`


#### Multiple Images from the Collection (auto caption)

{% include feature/image.html objectid="demo_001;demo_004;demo_002"  %}

Example Code --> `{% raw %}{% include feature/image.html objectid="demo_001;demo_004;demo_002"  %}{% endraw %}`


#### Multiple Images from the Collection (with captions)

{% include feature/image.html objectid="demo_001;demo_004;demo_002" width="75" caption="demo1;nother" %}

Example Code --> `{% raw %}{% include feature/image.html objectid="demo_001;demo_004;demo_002" width="75" caption="demo1;nother" %}{% endraw %}`


#### External Image (without a caption)

{% include feature/image.html objectid="https://www.lib.uidaho.edu/collectionbuilder/demo-objects/mg101_b6_photographs_01.jpg" width="75" alt="Frank B. Robinson at the Organ" %}

Example Code --> `{% raw %}{% include feature/image.html objectid="https://www.lib.uidaho.edu/collectionbuilder/demo-objects/mg101_b6_photographs_01.jpg" width="75" alt="Frank B. Robinson at the Organ" %}{% endraw %}`


#### External Image (with a caption)

{% include feature/image.html objectid="https://www.lib.uidaho.edu/collectionbuilder/demo-objects/mg101_b6_photographs_01.jpg" width="75" alt="Frank B. Robinson at the Organ" caption="This guy is good!"%}

Example Code --> `{% raw %}{% include feature/image.html objectid="https://www.lib.uidaho.edu/collectionbuilder/demo-objects/mg101_b6_photographs_01.jpg" width="75" alt="Frank B. Robinson at the Organ" caption="This guy is good!"%}{% endraw %}`


#### Multiple External Images (with captions and a link)

{% include feature/image.html objectid="https://www.lib.uidaho.edu/collectionbuilder/demo-objects/mg101_b6_photographs_01.jpg;https://www.lib.uidaho.edu/collectionbuilder/demo-objects/mg101_b6_psychiana_photographs_010.jpg" caption="this guy!;(was nothing without these women!)" link="https://www.lib.uidaho.edu/digital/psychiana/items/psychiana519.html;https://www.lib.uidaho.edu/digital/psychiana/items/psychiana547.html" alt="Frank B. Robinson at the Organ;Women staff members of Psychiana lined up outside the Psychiana headquarters" %}

Example Code --> `{% raw %}{% include feature/image.html objectid="https://www.lib.uidaho.edu/collectionbuilder/demo-objects/mg101_b6_photographs_01.jpg;https://www.lib.uidaho.edu/collectionbuilder/demo-objects/mg101_b6_psychiana_photographs_010.jpg" caption="this guy!;(was nothing without these women!)" link="https://www.lib.uidaho.edu/digital/psychiana/items/psychiana519.html;https://www.lib.uidaho.edu/digital/psychiana/items/psychiana547.html" alt="Frank B. Robinson at the Organ;Women staff members of Psychiana lined up outside the Psychiana headquarters" %}{% endraw %}`

----------

### PDF Options

#### PDF from Collection (auto caption)

{% include feature/pdf.html objectid="demo_002" width="50" %}

Example Code --> `{% raw %}{% include feature/pdf.html objectid="demo_002" width="50" %}{% endraw %}`


#### PDF from the Collection (with a caption)

{% include feature/pdf.html objectid="demo_002" width="50" caption="a pdf from the collection" %}

Example Code --> `{% raw %}{% include feature/pdf.html objectid="demo_002" width="50" caption="a pdf from the collection" %}{% endraw %}`


#### External PDF (without a caption)

{% include feature/pdf.html objectid="https://www.lib.uidaho.edu/collectionbuilder/demo-objects/uiext21768.pdf" width="50" %}

Example Code --> `{% raw %}{% include feature/pdf.html objectid="https://www.lib.uidaho.edu/collectionbuilder/demo-objects/uiext21768.pdf" width="50" %}{% endraw %}`


#### External PDF (with a caption)

{% include feature/pdf.html objectid="https://www.lib.uidaho.edu/collectionbuilder/demo-objects/uiext21768.pdf" width="50" caption="Safe Chainsawing is Important!" %}

Example Code --> `{% raw %}{% include feature/pdf.html objectid="https://www.lib.uidaho.edu/collectionbuilder/demo-objects/uiext21768.pdf" width="50" caption="Safe Chainsawing is Important!" %}{% endraw %}`

----------

### Video Options

#### Video from Collection (auto caption)

{% include feature/video.html objectid="demo_004" width="75" %}

Example Code --> `{% raw %}{% include feature/video.html objectid="demo_004" width="75" %}{% endraw %}`


#### Video from the Collection (with a caption)

{% include feature/video.html objectid="demo_005" width="50" caption="a video from the collection" %}

Example Code --> `{% raw %}{% include feature/video.html objectid="demo_004" width="50" caption="a video from the collection" %}{% endraw %}`


#### External Video File (without a caption)

{% include feature/video.html objectid="https://cdil.lib.uidaho.edu/storying-extinction/objects/trailcams/videos/ballcreek-cedarrub-birdonpath.mp4" width="50"%}

Example Code --> `{% raw %}{% include feature/video.html objectid="https://cdil.lib.uidaho.edu/storying-extinction/objects/trailcams/videos/ballcreek-cedarrub-birdonpath.mp4" width="50"%}{% endraw %}`


#### External Video File (with a caption)

{% include feature/video.html objectid="https://cdil.lib.uidaho.edu/storying-extinction/objects/trailcams/videos/ballcreek-cedarrub-birdonpath.mp4" caption="Bears are Important!" width="50" %}

Example Code --> `{% raw %}{% include feature/video.html objectid="https://cdil.lib.uidaho.edu/storying-extinction/objects/trailcams/videos/ballcreek-cedarrub-birdonpath.mp4" caption="Bears are Important!" width="50" %}{% endraw %}`


#### External Vimeo Video

{% include feature/video.html objectid="https://vimeo.com/464555587" width="50" caption="vimeo caption" %}

Example Code --> `{% raw %}{% include feature/video.html objectid="https://vimeo.com/464555587" width="50" caption="vimeo caption" %}{% endraw %}`


#### External Youtube Video

{% include feature/video.html objectid="https://www.youtube.com/watch?v=dbKNr3wuiuQ" width="50" caption="youtube caption"  %}

Example Code --> `{% raw %}{% include feature/video.html objectid="https://www.youtube.com/watch?v=dbKNr3wuiuQ" width="50" caption="youtube caption"  %}{% endraw %}`

#### Video Modal from Collection

{% include feature/video-modal.html objectid="demo_004" %}

Example Code --> `{% raw %}{% include feature/video-modal.html objectid="demo_004" %}{% endraw %}`

#### Video Modal External Item

{% include feature/video-modal.html objectid="https://cdil.lib.uidaho.edu/storying-extinction/objects/trailcams/videos/ballcreek-cedarrub-birdonpath.mp4" caption="Bears are Important!" transcript="Example transcript text, this should be better!" %}

Example Code --> `{% raw %}{% include feature/video-modal.html objectid="https://cdil.lib.uidaho.edu/storying-extinction/objects/trailcams/videos/ballcreek-cedarrub-birdonpath.mp4" caption="Bears are Important!" transcript="Example transcript text, this should be better!" %}{% endraw %}`

----------

### Audio Options

#### Audio from Collection (auto caption)

{% include feature/audio.html objectid="demo_003" width="50" %}

Example Code --> `{% raw %}{% include feature/audio.html objectid="demo_003" width="50" %}{% endraw %}`


#### Audio from the Collection (with a caption)

{% include feature/audio.html objectid="demo_003" width="50" caption="a mp3 from the collection" %}

Example Code --> `{% raw %}{% include feature/audio.html objectid="demo_003" width="50" caption="a mp3 from the collection" %}{% endraw %}`


#### External Audio (without a caption)

{% include feature/audio.html objectid="https://www.lib.uidaho.edu/digital/mp3s/Clouds.mp3" %}

Example Code --> `{% raw %}{% include feature/audio.html objectid="https://www.lib.uidaho.edu/digital/mp3s/Clouds.mp3" %}{% endraw %}`


#### External Audio (with a caption)

{% include feature/audio.html objectid="https://www.lib.uidaho.edu/digital/mp3s/Clouds.mp3" width="50" caption="Clouds are Important!" %}

Example Code --> `{% raw %}{% include feature/audio.html objectid="https://www.lib.uidaho.edu/digital/mp3s/Clouds.mp3" width="50" caption="Clouds are Important!" %}{% endraw %}`

#### Audio Modal from Collection

{% include feature/audio-modal.html objectid="demo_003" %}

Example Code --> `{% raw %}{% include feature/audio-modal.html objectid="demo_003" %}{% endraw %}`

#### Audio Modal External Item

{% include feature/audio-modal.html objectid="https://www.lib.uidaho.edu/digital/mp3s/Clouds.mp3" title="Clouds" caption="A reading." transcript="Example transcript text, this should be better!" %}

Example Code --> `{% raw %}{% include feature/audio-modal.html objectid="https://www.lib.uidaho.edu/digital/mp3s/Clouds.mp3" title="Clouds" caption="A reading." transcript="Example transcript text, this should be better!" %}{% endraw %}`

----------

### Other Features

#### Cloud Include

{% include feature/cloud.html fields="subject" min="1" background="dark" button="outline-warning" %}

Example Code --> `{% raw %}{% include feature/cloud.html fields="subject" min="1" background="dark" button="outline-warning"  %}{% endraw %}`

#### TimelineJS

{% include feature/timelinejs.html  %}

Example Code --> `{% raw %}{% include feature/timelinejs.html  %}{% endraw %}`

----------

### [Bootstrap](https://getbootstrap.com/) Features

#### Include a Card

- Card -- > `{% raw %}{% include feature/card.html header="This is a Card" text="The card features an image from the collection as a cap" objectid="demo004" width="25" centered=true %}{% endraw %}`

{% include feature/card.html header="This is a Card" text="The card features an image from the collection as a cap" objectid="demo_001" width="25" centered=true %}

#### Include a Button 

- Buttons -- > `{% raw %}{% include feature/button.html text="Button Link to Somewhere" link="https://collectionbuilder.github.io/" color="success" %}{% endraw %}`

{% include feature/button.html text="Button Link to Somewhere" link="https://collectionbuilder.github.io/" color="success" centered=true %}
  
#### Include an Alert

- Alerts -- > `{% raw %}{% include feature/alert.html text="this is an *alert* that 'warns' a user" color="warning" align="center" %}{% endraw %}`

{% include feature/alert.html text="This is an *alert* that 'warns' a user with centrally aligned text." color="warning" align="center"  %}

#### Include a Modal

- Modals -- > `{% raw %}{% include feature/modal.html button="This is a modal using a 'primary' colored button to invite clicking" title="when clicked:" text="A Modal will pop out a box with some more information" color="primary"  %}{% endraw %}`

{% include feature/modal.html button="This is a modal using a 'primary' colored button to invite clicking" title="When clicked:" text="A Modal will pop out a box with some more information" color="primary"  %}