> For the complete documentation index, see [llms.txt](https://docs.theshoppad.com/blogstudio/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.theshoppad.com/blogstudio/readme/preview-your-article-on-different-sized-screens.md).

# Preview your article on different sized screens

Preview a Blog Studio article at mobile and desktop widths using the editor's Eye icon, then exit preview mode when done.

Follow the steps below on how to preview your article on different-sized screens (like mobile).

1. Starting from the Blog Studio editor, click on a content block on your article to reveal the top text toolbar.
2. Click on the **••• icon** to reveal more advanced settings in the editor, then click on the **Eye icon**.

<figure><img src="https://docs.theshoppad.com/blogstudio/assets/Adjust_Blog_Studio_Article_Width_Settings_-_Step_2.png" alt=""><figcaption></figcaption></figure>

3. Click on the gray top bar to freely adjust the view from mobile view to desktop view.

<figure><img src="https://docs.theshoppad.com/blogstudio/assets/Adjust_Blog_Studio_Article_Width_Settings_-_Step_4%20%281%29.png" alt=""><figcaption></figcaption></figure>

:::note
If you would like to quit out of the preview mode, you can click on the **x icon** on the top right-hand corner.
:::