# Work in Progress: How to Create a Global Column

{% hint style="info" %}
Some designs need a global column for showing an example of the product, an index of the quiz, a big logo, a demonstration video, etc. This is one way of achieving that.
{% endhint %}

### Step 1: Create a Global Component

* Go to the Layers Tab on the Left Sidebar
* Select the All Tab
* Scroll down to the Global Components section
* Create a new container component

### Step 2: Set the Location

* Go to the General section of the Options Tab on the Right Sidebar
* The first dropdown will allow you to select where you want this component to be located
* If you want the global column to be on the left, place the component "Before Page"
* If you want the global column to be on the Right, place the component "After Page" 

### Step 3: Flex Settings for Flow Containers

* Select the Entire Flow, choose the "Whole Thing" element and give it a `display: flex` This will automatically set the flex-direction to row
* Also from the Entire Flow, choose the Global Location Before Page (or After Page, whichever you chose) and set its flex like this `flex: 0 0 50%`
* Select a page and choose "Whole Page" for "All Pages" and set the same `flex: 0 0 50%`

{% hint style="info" %}
50/50 would be appropriate if you want both columns to have the same width. You can play around with different percentages until you get the widths you need. 
{% endhint %}

{% hint style="danger" %}
IMPORTANT: This will not look good on mobile, so remember to make the corresponding changes for mobile view. (setting `flex: 1` on the page and `display:none` on the global location should do the trick)
{% endhint %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.trysavvy.com/other-useful-docs/work-in-progress/pending/work-in-progress-how-to-create-a-global-column.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.