# iframe

The iframe can be customized by passing in a configuration JSON object to the `name` attribute. Here are a list of possible configuration flags / keys

> We are actively working on customization. More customization keys will be available soon, but don't hesitate to reach out if you want something specific!

* `hideLogo` - boolean - default false - true if you want to hide the top left logo, false o.w.

<figure><img src="https://3213183904-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGYEDPrGtuajMM2jtubY4%2Fuploads%2Frm1Jy9BWmiRa3F0OUG6I%2FScreen%20Shot%202023-06-21%20at%2011.02.44%20PM.png?alt=media&#x26;token=18251158-74d4-4cb8-8203-418080bb7656" alt=""><figcaption><p>Shows logo by default</p></figcaption></figure>

<figure><img src="https://3213183904-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGYEDPrGtuajMM2jtubY4%2Fuploads%2F202Lrq3NzGYEA25y7FBn%2Fspaces_MTgZdmUjwUHt4ulCtRTA_uploads_Hap7CFydpLhibmgYLaLv_image.webp?alt=media&#x26;token=f5a90e70-9455-4768-a648-5713c1a737e3" alt=""><figcaption><p>Hides logo</p></figcaption></figure>

* `overrideWidth` - number, px - default 1160 - overrides the content width of the page
  * This does not affect smaller breakpoints&#x20;

<figure><img src="https://3213183904-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGYEDPrGtuajMM2jtubY4%2Fuploads%2F0uRx5w2KBmpO83Hzr7Ph%2Fspaces_MTgZdmUjwUHt4ulCtRTA_uploads_rTPtckqPICoveyP46i5O_Screen%20Shot%202023-06-21%20at%2011.webp?alt=media&#x26;token=087ecbe0-b233-4541-8dfc-ca1ac0dbc1b8" alt=""><figcaption><p>Overrides the width of the main content block</p></figcaption></figure>

* `leftNavBar` - boolean - default false - true if you want the nav bar links to be left aligned, false o.w.&#x20;
  * This is usually used with `alignedNavBar: true`
  * This is usually used with `hideLogo: true` as the logo has position absolute&#x20;

<figure><img src="https://3213183904-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGYEDPrGtuajMM2jtubY4%2Fuploads%2FZTRJty03uDkbKNuBfQXG%2Fimage.png?alt=media&#x26;token=1bce2524-7a92-40b5-baea-3a9f32ef0672" alt=""><figcaption><p>leftNavBar toggled to true with hideLogo</p></figcaption></figure>

<figure><img src="https://3213183904-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGYEDPrGtuajMM2jtubY4%2Fuploads%2FCG54MpUVxKB8k4jP7nuu%2Fspaces_MTgZdmUjwUHt4ulCtRTA_uploads_aW75Ni1V7AIZpkqvSkCV_image.webp?alt=media&#x26;token=dbfe9808-45b7-4a28-a91c-33ed0e96722a" alt=""><figcaption><p>default behavior of leftNavBar with hideLogo</p></figcaption></figure>

* `alignedNavBar` - boolean - default false - true if you want the nav bar to be aligned with the quest cards, false o.w.

  <figure><img src="https://3213183904-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGYEDPrGtuajMM2jtubY4%2Fuploads%2FAMCyEKVtcylpmxQ7CI3c%2Fspaces_MTgZdmUjwUHt4ulCtRTA_uploads_04AEBvYhopMu9TyhQMiV_image.webp?alt=media&#x26;token=3d766360-8a7b-424f-ac7c-4ec013462cd3" alt=""><figcaption><p>alignedNavBar set to true</p></figcaption></figure>

<figure><img src="https://3213183904-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGYEDPrGtuajMM2jtubY4%2Fuploads%2FK6jGgFYDSniqrX3M07h3%2Fspaces_MTgZdmUjwUHt4ulCtRTA_uploads_04AEBvYhopMu9TyhQMiV_image.webp?alt=media&#x26;token=6f4a70ad-0d8b-46a8-8d43-16485b1db47b" alt=""><figcaption><p>alignedNavBar defaults to false</p></figcaption></figure>

Example:

`<iframe src=".." name='{"hideLogo": true, "overrideWidth": 1360, "leftNavBar": true, "alignedNavBar": true}"></iframe>`

<figure><img src="https://3213183904-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FGYEDPrGtuajMM2jtubY4%2Fuploads%2Fq8lhxpG6VqBYsZmbuRCM%2Fspaces_MTgZdmUjwUHt4ulCtRTA_uploads_6iFW7XyYAa0yBXenobn9_image.webp?alt=media&#x26;token=b664710a-4046-4a37-a8f1-4d4943830f7c" alt=""><figcaption><p>hideLogo, overrideWidth, leftNavBar, alignedNavBar</p></figcaption></figure>
