# Information drawer

**Configure the Information drawer**

Select the customize theme option. Click on the dropdown menu at the top to select the **Home page** template**.**

From the left side menu, select the **Information drawer.**

Customize the section by utilizing the settings on the right side of the theme editor, as described below:

<table data-header-hidden><thead><tr><th width="281"></th><th></th></tr></thead><tbody><tr><td>Heading</td><td>Enter the heading text. <br><em>(Note: Wrap your text between [ ] to add the markers. These [markers] will highlight the text.)</em></td></tr><tr><td>Show icons</td><td>Select this checkbox to show the icons.</td></tr><tr><td>Heading</td><td>Enter the heading text. </td></tr><tr><td>Description</td><td>Enter the description text.</td></tr><tr><td>Approve button text</td><td>Enter text to display as approve button text on the popup.</td></tr><tr><td>Decline button text</td><td>Enter text to display as decline button text on the popup.</td></tr><tr><td>Under 18 title</td><td>Enter text to display on the under 18 popup as a title.</td></tr><tr><td>Under 18 description</td><td>Enter text to display on the under-18 popup as a description.</td></tr><tr><td>Decline button text</td><td>Enter text to display as decline button text on the under 18 popup.</td></tr></tbody></table>

**Block settings**

<table><thead><tr><th width="252"></th><th></th></tr></thead><tbody><tr><td>Heading</td><td>Enter the heading text. </td></tr><tr><td>Icon</td><td>Choose any icon from the icons list.</td></tr><tr><td>Description</td><td>Enter the description text.</td></tr><tr><td>Image</td><td>Choose any image from the library.</td></tr><tr><td>Image position</td><td>Select the image position from 'Top' or 'Bottom'.</td></tr><tr><td>Colors</td><td><strong>Background</strong><br>Choose any color for the background.<br><br><strong>Heading</strong><br>Choose any color for the heading.<br><br><strong>Text</strong><br>Choose any color for the text.<br><br><strong>Border</strong><br>Choose any color for the border.</td></tr></tbody></table>

## Steps to link this drawer

1. Go to the product page> Add block named '**Information content**'\ <br>

   <figure><img src="https://2996814205-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FYerbql6PHiTtyykpnHvy%2Fuploads%2FCLiU1jNYrsSTEYcxOaKi%2Fimage.png?alt=media&#x26;token=3f2b27e6-a761-4e10-a62a-990416a69831" alt=""><figcaption></figcaption></figure>
2. Add content in its details and select '**Drawer**' for its type.\
   \
   ![](https://2996814205-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FYerbql6PHiTtyykpnHvy%2Fuploads%2FWvbdUduN8W1mG8JlYvNB%2Fimage.png?alt=media\&token=f4c856fd-955e-4a17-adc1-b59572c3d392)
3. Click on this text(*shown below*) will start opening the information drawer.<br>

   <figure><img src="https://2996814205-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FYerbql6PHiTtyykpnHvy%2Fuploads%2FYf4m3aLEv2VTeUGKOwFR%2Fimage.png?alt=media&#x26;token=de311c28-39e4-4dc8-bbb4-16e77e0d52b2" alt=""><figcaption></figcaption></figure>

<figure><img src="https://2996814205-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FYerbql6PHiTtyykpnHvy%2Fuploads%2FrcvovwokEvxyQK2od9e8%2Fimage.png?alt=media&#x26;token=8b618bda-07f8-49cf-84ef-86e0f33041cf" alt=""><figcaption></figcaption></figure>

4. This information drawer can be linked from the announcement bar also. \
   Go to the announcement bar and select checkbox in front of the settings->Link with information drawer under the Contact info settings, as shown below:<br>

<figure><img src="https://2996814205-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FYerbql6PHiTtyykpnHvy%2Fuploads%2F4GRPBBrB5U6LEvQd0SKh%2Fimage.png?alt=media&#x26;token=65038664-14d9-4f51-8a8b-b4fb3a389a1d" alt=""><figcaption></figcaption></figure>

Click on this contact info will open the information drawer, as shown below:<br>

<figure><img src="https://2996814205-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FYerbql6PHiTtyykpnHvy%2Fuploads%2FNIePeMkvsyulArizbjg6%2Fimage.png?alt=media&#x26;token=cd6e8fc4-fc47-43ef-a617-078cc8c22daf" alt=""><figcaption></figcaption></figure>