Skip to content

User Guide - Content Manager edit view configuration #60

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.

Sign up for GitHub

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

Merged
merged 9 commits into from
Jan 22, 2021
Merged

User Guide - Content Manager edit view configuration #60

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
b3fb82c
Create sections to differentiate list and edit view configuration
meganelacheny Dec 22, 2020
722ba70
Write documentation for edit view configuration
meganelacheny Jan 12, 2021
5376cbc
Change file name + links to 'Configuring the views of a content type
meganelacheny Jan 13, 2021
91df922
Modify list view configurations to match edit view configurations
meganelacheny Jan 13, 2021
10c68b5
Improve relational fields section in edit view configuration doc
meganelacheny Jan 13, 2021
ced324b
Delete useless screenshots
meganelacheny Jan 13, 2021
794f697
Delete DS_Store file
meganelacheny Jan 21, 2021
b59d9b2
Improve after review
meganelacheny Jan 22, 2021
a431934
Merge branch 'main' into cm/edit-view-config
derrickmehaffy Jan 22, 2021
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
2 changes: 1 addition & 1 deletion user-docs/.vuepress/config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -265,7 +265,7 @@ module.exports = {
],
[
'/latest/content-manager/configuring-view-of-content-type',
'Configuring the view of a content type',
'Configuring the views of a content type',
],
['/latest/content-manager/writing-content', 'Writing content'],
['/latest/content-manager/managing-relational-fields', 'Managing relational fields'],
Expand Down
Binary file removed user-docs/latest/.DS_Store
View file
Open in desktop
Binary file not shown.
Binary file added user-docs/latest/assets/content-manager/edit-view-config.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
83 changes: 76 additions & 7 deletions user-docs/latest/content-manager/configuring-view-of-content-type.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,10 @@
# Configuring the view of a content type
# Configuring the views of a content type
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just a comment, wondering if we can decrease the line length to prevent word wrapping (not just this title entry but there are others too)

EX:
image

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes, I have noticed and it annoys me too. I have tried to change the titles but most of the time, I don't manage the make the titles shorter while keeping them all homogeneous and without losing important words. I will think about what I can do, but maybe it will only be something we can change when we will modify the global design of the documentation (much later).


Right above the list view table, on the right side of the interface, a settings button <Fa-Cog /> is displayed. It allows to access the configurations that can be set for the list view of your collection type, and to choose which fields to display in the table.
Depending on their type, content types can be divided into 2 interfaces: the list view and the edit view. Both interfaces can be configured.

## Configuring the list view

On the right side of the list view interface, right above the table, a settings button <Fa-Cog /> is displayed. It allows to access the configurations that can be set for the list view of your collection type, and to choose which fields to display in the table.

::: tip NOTE
The configurations only apply to the list view of the collection type from which the settings are accessed (i.e. disabling the filters or search options for a collection type will not automatically also disable these same options for all other collection types).
Expand All @@ -10,11 +14,11 @@ Note also that the explanations below explain how to permanently configure which

![Settings of a list view in the Content Manager](../assets/content-manager/content-manager_settings-list-view.png)

To configure the list view settings:
### List view settings

1. In the list view, click on the settings button <Fa-Cog />.
1. In the list view of your collection type, click on the settings button <Fa-Cog />.
2. Click on the **Configure the view** button.
3. Define your chosen new settings:
3. In the Settings area, define your chosen new settings:

| Setting name | Instructions |
| ---------------------- | -------------------------------------------------------------------------------------------------- |
Expand All @@ -24,11 +28,23 @@ To configure the list view settings:
| Entries per page | Choose among the drop-down list the number of entries per page. |
| Default sort attribute | Choose the sorting field and type that will be applied by default. |

4. Define what fields to display in the list view table, and in what order:
4. Click on the **Save** button.

### List view display

1. In the list view of your collection type, click on the settings button <Fa-Cog />.
2. Click on the **Configure the view** button.
3. In the View area, define what fields to display in the list view table, and in what order:
- Click the add button ![icon add new](../assets/content-manager/icon_add.png) to add a new field.
- Click the delete button ![icon delete](../assets/content-manager/icon_delete.png) to remove a field.
- Click the reorder button ![icon drag & drop](../assets/content-manager/icon_dragdrop.png) and drag and drop it to the place you want it to be displayed amond the other fields.
- Click the name of the field to edit the label and/or enable or disable sort on that field.
4. Click the name of the field to access its available own settings:

| Setting name | Instructions |
| ------------------------- | ------------------------------------------------------------------------- |
| Label | Write the label to should be used for the field in the list view table. |
| Enable sort on this field | Click on **ON** or **OFF** to able or disable the sort on the field. |

5. Click on the **Save** button.

::: tip NOTE
Expand All @@ -43,3 +59,56 @@ Note also that relational fields have a couple limitations when it comes to sort
- Sorting cannot be enabled for relational fields which display several fields.
- Relational fields cannot be set as default sort.
:::

## Configuring the edit view

In the edit view of a content type, in the right side of the interface, a **Configure the view** button is displayed. It allows to access the configurations that can be set for the edit view of the content type, such as the entry title, and the display of the fields of the content type, including the relational ones.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Structure seems a little odd but ran it through a grammar check to be sure and it passed so 🤷 just a comment, no change needed.


![Configuring the edit view of the Content Manager](../assets/content-manager/edit-view-config.png)

### Edit view settings

1. In the edit view of your content type, click on the **Configure the view** button.
2. In the Settings area, define your chosen new settings:

| Setting name | Instructions |
| --------------- | ------------------------------------------------------------------------------------- |
| Entry title | Choose among the drop-down list the field that should be used as title for the entry. |

3. Click on the **Save** button.

### Edit view display

1. In the edit view of your content type, click on the **Configure the view** button.
2. In the View area, define what fields to display in the list view table, and in what order:
- Click the add button ![icon add new](../assets/content-manager/icon_add.png) to add a new field.
- Click the delete button ![icon delete](../assets/content-manager/icon_delete.png) to remove a field.
- Click the reorder button ![icon drag & drop](../assets/content-manager/icon_dragdrop.png) and drag and drop it to the place you want it to be displayed amond the other fields.
3. Click the name of a field to access its available own settings:

| Setting name | Instructions |
| --------------- | ----------------------------------------------------------------------------------------- |
| Label | Write the label to should be used for the field. |
| Description | Write a description for the field, to help other administrators fill it properly. |
| Placeholder | Write the placeholder that should be displayed by default in the field. |
| Editable field | Click on **ON** or **OFF** to able or disable the edition of the field by administrators. |

4. Click on the **Save** button.

::: warning IMPORTANT
The settings and display of a component's fields cannot be managed and reordered through the entry's edit view configuration page. Click on the **Set the component's layout** button of a component to access the component's own configuration page. You will find the exact same settings and display options as for the entry, but that will specifically apply to your component.

Note also that the settings are defined for the component itself, which means that the settings will automatically be applied for every other content type where the component is used.
:::

#### Relational fields
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In this section, you are using regular fields to define non relational fields.
Here you are using a title to introduce relational fields, why not using one also for regular fields.
And so, having the same content structure.
Here in I can see the procedure is with a bullet point instead of a ordered list.
And the format is different compared to regular fields.
Same the settings format is different, for the entry title.

I think I would have the same structure for regular fields and relational fields

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I can't have the same structure for both otherwise too much pieces of information will have to be repeated, which is something to avoid. That's why I chose to keep a similar structure for Edit view and List view configurations, and add an extra sub-section for relational fields in Edit view configurations.
Also, the bullet list is not a procedure. I can however see why it's confusing, so I'll improve the content while keeping the structure I think.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I agree @meganelacheny the duplication of content is something we should avoid


On the right side of the View area is displayed a Relational fields part. As in the edit view, regular fields and relational fields are managed separately (see [Managing relational fields](managing-relational-fields.md)). Although most configuration options are similar to regular fields', relational fields configurations have some specificities.

To define what relational fields of an entry should be available in the edit view, the following options are available:

- the **Insert another relational field** button, to add another relational field to your entry. If the button remains unclickable, it means that no other relational field can be added.
- the delete button ![icon delete](../assets/content-manager/icon_delete.png), to remove a relational field.
- the reorder button ![icon drag & drop](../assets/content-manager/icon_dragdrop.png), to drag and drop to the place you want your relational field to be displayed among the others.

As for regular fields, it is possible to access the available settings of the relational fields by clicking on their name. Most settings are the same as for regular fields (see [Edit view display](./configuring-view-of-content-type.md#edit-view-display)) except for "Entry title" which is only available for relational fields. It is recommended to choose well the entry title of relational fields as the more comprehensive it is, the easier it will be for administrators to manage the content of relational fields from the edit view.
8 changes: 4 additions & 4 deletions user-docs/latest/content-manager/introduction-to-content-manager.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ From the list view, it is possible to:
- configure the fields displayed in the table of the list view (4).

::: tip 💡 TIP
Sorting can be enabled for any field displayed in the list view table (see [Configuring view of content type](../content-manager/configuring-view-of-content-type.md)). Click on a field name, in the header of the table, to sort on that field.
Sorting can be enabled for any field displayed in the list view table (see [Configuring the views of a content type](../content-manager/configuring-view-of-content-type.md)). Click on a field name, in the header of the table, to sort on that field.
:::

### Filtering entries
Expand Down Expand Up @@ -59,10 +59,10 @@ New entries are only considered created once some of their content has been writ

### Configuring the table fields

Right above the list view table, on the right side of the interface, a settings button <Fa-Cog /> is displayed. It allows to access the configurations that can be set for the list view of your collection type (see [Configuring view of content type](../content-manager/configuring-view-of-content-type.md)), and to choose which fields to display in the table.
Right above the list view table, on the right side of the interface, a settings button <Fa-Cog /> is displayed. It allows to access the configurations that can be set for the list view of your collection type (see [Configuring the views of a content type](../content-manager/configuring-view-of-content-type.md)), and to choose which fields to display in the table.

::: tip NOTE
Configuring the displayed field of the table in the way detailed below is only temporary: the configurations will be reset as soon as the page is refreshed or when navigating the admin panel outside the Content Manager. For permanent configurations, please refer to [Configuring view of content type](../content-manager/configuring-view-of-content-type.md).
Configuring the displayed field of the table in the way detailed below is only temporary: the configurations will be reset as soon as the page is refreshed or when navigating the admin panel outside the Content Manager. For permanent configurations, please refer to [Configuring the views of a content type](../content-manager/configuring-view-of-content-type.md).
:::

![Displayed fields in the settings of a list view in the Content Manager](../assets/content-manager/content-manager_displayed-fields.png)
Expand All @@ -74,7 +74,7 @@ To temporarily configure the fields displayed in the table:
3. Untick the boxes associated with the fields you do not want to be displayed in the table.

::: tip NOTE
Relational fields can also be displayed in the list view. Please refer to [Configuring view of content type](../content-manager/configuring-view-of-content-type.md) for more information on their specificities.
Relational fields can also be displayed in the list view. Please refer to [Configuring the views of a content type](../content-manager/configuring-view-of-content-type.md) for more information on their specificities.

:::

Expand Down