Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

IBX-6852: Focus mode described #241

Closed
wants to merge 1 commit into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 16 additions & 0 deletions docs/content_management/create_edit_content_items.md
Original file line number Diff line number Diff line change
Expand Up @@ -87,6 +87,22 @@ To add a new element to the Field, choose one of the available elements:
Each of these elements can have its own settings, such as text formatting.
The option bar also lets you reorder or remove any elements in the Rich Text Field.

### Focus mode

While editing Rich Text Fields, you can switch to focus mode.
Focus mode expandes the workspace to full screen.
It is useful when you need to work with longer texts that take more space.

![Focus mode](img/focus_mode.png "Focus mode")

To access focus mode, click **Focus mode** on the right side above the workspace.

![Access focus mode](img/access_focus_mode.png "Access focus mode")

To exit focus mode, click **Default mode** or press Esc on the keyboard.

![Exit focus mode](img/exit_focus_mode.png "Exit focus mode")

### Anchors

For longer texts, insert an anchor linking a fragment of text with another fragment or section
Expand Down
25 changes: 16 additions & 9 deletions docs/content_management/create_edit_pages.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,9 +5,9 @@ edition: experience

# Create and edit Pages

**Page** is a special Content Type that contains zones onto which you can drop
different dynamic blocks.
You can edit pages to personalize the layout and contents of your website.
You can create and modify Pages with a visual drag-and-drop editor - Page Builder.
Page is divided into zones into which you can drop various dynamic blocks.
By editing pages you can customize the layout and content of your website.

Whenever you edit a Page, a [new version](content_versions.md) is created in the repository.

Expand All @@ -19,9 +19,15 @@ Whenever you edit a Page, a [new version](content_versions.md) is created in the

## Create Page

To create a new Page, in the upper toolbar click **Content** and from the list below select **Content structure**.
On the right-side toolbar, click **Create** and from the list of Content items select **Landing page**.
On the **Page creation** modal, select the layout and click **Create draft**.
To create a new page:

A\. In the left panel, go to **Content**.

B\. Select **Content structure**.

C\. On the right-side toolbar, click **Create content** and from the list of Content items select **Landing Page**.

D\. Select the layout and click **Create**.

You can also add a new Page in the Page Builder.
Open the Page Builder by clicking **Site** and selecting a website from the list that
Expand Down Expand Up @@ -73,14 +79,15 @@ Now you are ready to add blocks of content to the Page.
In Page Builder you can access a menu of **Elements** — a set of blocks of content that you can add to the zones of the Page.
Each block is unique in its function and enables you to customize the content appearing on the Page.

![Elements menu](img/elements_menu.png "Elements menu")

Add a block by dragging it from the menu to an empty place on a zone.
Do not worry about placing blocks in the proper place from the start.
You can reorder them at any time by dragging and dropping them in the desired location.

[[= product_name =]] comes with a set of ready-to-use Page blocks,
but [developers can add their own]([[= developer_doc =]]/content_management/pages/create_custom_page_block/).
When you add a new block to the drop zone, drop it in the blue highlighted area. Before you drop it, a bold line appears - it helps you see the position of the newly added block in relation to other, already added blocks.

![Elements menu](img/elements_menu.png "Elements menu")
![Drop zone line](drop_zone_line.png)

For a list of blocks available out of the box, see [Block reference](block_reference.md).

Expand Down
Binary file added docs/content_management/img/access_focus_mode.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/content_management/img/exit_focus_mode.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added docs/content_management/img/focus_mode.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.