# Place animal on a web page using snippets

You can add a built-in code snippet to the web page of your choice to either add a highlighted animal or random animal to that webpage. The code snippet is called *Random Animal Picture*. This section gives you detailed instructions on adding this snippet to your pages.


You can add a highlighted animal to any of your web pages as a featured animal, or you can choose to have a random animal display on any webpage of your choice. We give you a built-in code snippet to use, and settings you must change. Follow the instructions below to first set up the ability to add animals to web pages automatically and then to add the code snippet to the pages of your choice.

# Change the settings to allow placement of animals on web pages


1. Navigate to **Website > Settings.**   
   ![](https://outline-production-attachments.s3-accelerate.amazonaws.com/uploads/48da3d2a-9a3a-434b-824b-a6018154f31c/910e78ef-eafe-4a88-9bb1-5971d9023081/website%20settings.jpg?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Credential=AKIA4EOUDTOVUICLPZ4P%2F20261023%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Date=20261023T193000Z&X-Amz-Expires=86400&X-Amz-Signature=aad4b127632bf1fa4367c0a4045b14e4e58582dc68e147fd80fe864634334f30&X-Amz-SignedHeaders=host&x-amz-checksum-mode=ENABLED&x-id=GetObject " =440x389")  
2. Scroll down to **Sidebar Options** and then use the fields **Animal Picture Mode** and **Featured Animal**.  
   ![](https://outline-production-attachments.s3-accelerate.amazonaws.com/uploads/48da3d2a-9a3a-434b-824b-a6018154f31c/d992bf62-cc12-48b8-9cff-dc9fd577244c/setting%20for%20animal%20picture.png?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Credential=AKIA4EOUDTOVUICLPZ4P%2F20261023%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Date=20261023T193000Z&X-Amz-Expires=86400&X-Amz-Signature=be7064238af1f51e19551d9c451d353d8100bd66765c53e8a0ac06372ee15347&X-Amz-SignedHeaders=host&x-amz-checksum-mode=ENABLED&x-id=GetObject " =663x475")
3. For **Animal Picture Mode** select either **Featured** to use a particular featured animal on the web pages where you place the code snippet or **Random** to automatically select a random animal on those pages.
4. If you selected **Featured** in step 2 above, use the **Featured Animal** field's drop-down list to select the highlighted animal you want to feature on your web pages.
5. Click **Save Settings**.

# Add the built-in code snippet

These instructions are also listed in the [Code Snippets](/doc/639f19c7-9084-4e4d-8858-314c37ab04da) page.

To add the built-in code snippet for an "animal ad" follow these instructions:


1. Navigate to **Website > Web Page List.**
2. Click the **Edit** icon next to a page where you would like to add the code snippet.
3. Click the **Snippet** icon in the page editor (*it looks like a little blue paw*). This will bring up a list of built-in custom tags.  
     
   ![](https://outline-production-attachments.s3-accelerate.amazonaws.com/uploads/48da3d2a-9a3a-434b-824b-a6018154f31c/2069ff7d-204b-42b8-9da4-635ce30dc89f/add-snippet-to-page.jpeg?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Credential=AKIA4EOUDTOVUICLPZ4P%2F20261023%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Date=20261023T193000Z&X-Amz-Expires=86400&X-Amz-Signature=9f34d07f6b74e012856a30afa8b9b4a9a3665b6f2b59d816e950f6cdf636c039&X-Amz-SignedHeaders=host&x-amz-checksum-mode=ENABLED&x-id=GetObject " =928x360")
4. Scroll until you see the name of the snippet you would like to add, **Built-in: Random Animal Picture**.  
     
   ![](https://outline-production-attachments.s3-accelerate.amazonaws.com/uploads/48da3d2a-9a3a-434b-824b-a6018154f31c/f66fdd34-8818-4f9e-884d-dbe18e36f5be/random%20animal%20pic.png?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Credential=AKIA4EOUDTOVUICLPZ4P%2F20261023%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Date=20261023T193000Z&X-Amz-Expires=86400&X-Amz-Signature=8bc99405ac40ba31e4be4a21bf041f2f461b21be9b306097e8d3057f1a6faa17&X-Amz-SignedHeaders=host&x-amz-checksum-mode=ENABLED&x-id=GetObject " =686x501")
5. Click the snippet name and the tag will be inserted (see above screenshot) {AnimalAd/}.
6. Save your page.  When viewed outside of the editor, in your browser, the shortcode will be replaced with the code from the code snippet.

Your selected animal photo or a random animal photo will automatically be added when a visitor views that web page.