# Designing the Header

## The editing interface

So the editing interface pretty much looks like this:

![Wordpress website editing interface](/files/-MBXX5iSqR7UK-xvHIZZ)

It's a sidebar on the left where you can control some things about different elements on your page. It's here where you upload assets into blocks that are pre-defined. As you can see, I need a logo and a site icon (favicon) which will be displayed on the navigation bar and on the page tab respectively.

![Site icon preview](/files/-MBXY1HGfeXWzttdT7Kh)

So thanks to the assets collected previously, I can simply insert those into here and Wordpress will show me how they look. What's neat is that I can customise the size of the logo displayed on the page using the slider - and in this case I've chosen 96px (for now) as its a nice power of 2 and sits cleanly on my header.

![Microsoft logo on the page header](/files/-MBXY66hm-zTjJrHOl8r)

Moreover, what's even nicer is that Wordpress lets you customise according to screen size, so there's some in-built media queries checking how you're accessing the website; whether you're on desktop or mobile meaning you can customise how the site appears to support different devices.

![Mobile preview of website](/files/-MBXYYQ1kMwyEx5aAx23)

This means I can adjust the logo size for mobile devices, or even use a different variant of the logo. Moreover, the layout changes to suit for touch and scrolling using your hands, designing a better experience for different users.


---

# 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://ryotokuro.gitbook.io/microsoft/microsoft-student-accelerator-msa/project-2-web-application/untitled.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.
