In this section, you will find all the relevant topics to help you get started with Umbraco:

• Logging In and Out

• Umbraco Interface

• Creating, Saving and Publishing Content Options

• Finding Content

• Editing Existing Content

• Sorting Pages

• Moving a Page

• Copying a Page

• Deleting and Restoring Pages

Logging in

To access the Umbraco Backoffice:

1. Open your web browser and enter your website domain name followed by /umbraco (for example: http://www.company.com/umbraco/). A login screen appears.

2. Enter your Email and Password provided by your system administrator.

3. Click Login.

Logging Out

To log out of the Umbraco Backoffice:

1. Select the profile picture in the top-right of the screen.

2. Click Logout.

Re-use a page or a tree structure you have previously created by copying the parent page and its child pages to a different section within the site structure.

When you copy a parent page all of its child pages are also copied, by default. You can choose if you want to copy the child pages or not. You can also choose whether the links should be automatically updated or continue to link to the original pages.

You can copy a page in two ways:

Option 1

1. Go to Content.

2. Right-click the page you wish to copy and select Copy. Alternatively, click ••• next to the page, select Do something else and click Copy.
3. A window appears next to the section tree. Here, you can choose where you want to copy the page in the tree structure.
4. Toggle Relate to original button if you want to keep the links linked to the original page.

5. Toggle Include descendants if you want to copy the child pages alongside the parent page.

6. Click Copy.

7. A confirmation message appears. Click OK to dismiss the confirmation message.

Option 2

1. Go to Content.

2. Select the page you wish to copy.

3. Select Actions in the top-right corner of the screen.

4. Select Copy from the Actions drop-down menu.
5. A window appears next to the section tree. Here, you can choose where you want to copy the page in the tree structure.
6. Toggle Relate to original button if you want to keep the links linked to the original page.

7. Toggle Include descendants if you want to copy the child pages alongside the parent page.

8. Click Copy.

9. A confirmation message appears. Click OK to dismiss the confirmation message.

The pages in Umbraco are placed in the tree structure according to a predefined sort order. The most recently created page is placed at the bottom of the tree structure. You can change the order of the pages by using the Sort function.

You can sort pages in two ways:

Option 1

1. Go to Content.

2. Navigate to the parent node whose child nodes you wish to sort.

3. Right-click the parent node and select Sort. Alternatively, click ••• next to the parent node and select Sort.
4. A window appears next to the section tree. Here, you can arrange the child nodes in the order you want by dragging them up or down. Alternatively, you can click the column headers to sort the entire collection of items in ascending or descending order.
5. Click Save and then Close.

Option 2

1. Go to Content.

2. Select the parent node whose child nodes you wish to sort.

3. Select Actions in the top-right corner of the screen.

4. Select Sort from the Actions drop-down menu.
5. A window appears next to the section tree. Here, you can arrange the child nodes in the order you want by dragging them up or down. Alternatively, you can click the column headers to sort the entire collection of items in ascending or descending order.
6. Click Save and then Close.

The editor’s manual is a detailed user guide aimed at Umbraco editors for step-by-step instructions on performing everyday tasks with Umbraco.

Introduction

Umbraco is an information platform that allows you to quickly publish information onto a website without the need for any prior knowledge of web page editing. It is designed to be powerful and flexible enough to enable user's full control of their website content.

No special skills are required to create, publish, and manage web pages and related content with Umbraco. Any prior web page editing experience you may have might prove useful in terms of understanding what you want your website to do. Anything you can do using HTML can also be done in Umbraco.

The Umbraco platform can be utilized for all types of websites – from public websites to intranets and extranets, whether password-protected or not. It can even be used to manage multiple websites from a single Umbraco instance. Regardless of the type, authorization to edit them can be given to anybody you choose and as editing is done via a web browser, it can be done at any time and in any place.

Umbraco is designed to be intuitive and straightforward, so this manual aims to explain each step with clear instructions and help get you editing your website with ease.

Happy editing!

Getting Started With Umbraco

Showing you the ropes on getting started with Umbraco. A walkthrough on how to log in, create and publish content, working with pages.

Working With Rich Text Editor

How to use the Rich Text Editor.

Version Management

How to compare versions and roll back different versions of content.

Media Management

How to work with media, organize folders, and do image editing.

Tips and Tricks

Providing a few tips and tricks on how to work with Content using Umbraco.

Umbraco provides the tools for organizing and uploading the Media. In this section, you can find information on how to work with different media types, organise folders, and edit images:

• Working with Folders

• Working with Media Types

• Cropping Images

The Umbraco content tree view allows you to navigate web pages through a logical site hierarchy. You can find a page by navigating through the tree itself if you know where the page is stored.

Searching in Umbraco

A quicker way to search across all the content, files, or folders in Umbraco is to click the Magnifier icon in the top-right of the screen. Alternatively, you can use the keyboard shortcut CTRL + SPACE to access the Search bar.

Using the search bar, you can enter a search term and Umbraco will search for pages and media containing the term.

You will never lose changes on a page because all the old versions of the page are saved in History.

To compare a page on the site with its previous versions:

1. Navigate to the page whose versions you wish to view.

2. Go to the Info tab.

3. Click on the Rollback button in the History section.
4. The Rollback window opens. Select a version you wish to compare with.

   After selecting the version, a comparison of the current page with the version you selected is displayed. The text highlighted in red and striked-out will not appear in the selected version and the text highlighted in green means the text that will be added, should you choose to rollback to that version of the page.

The Umbraco Rich Text Editor (RTE) is a field where you, as an editor, can be creative. You can select how much you want to do yourself. You can work on text content, format the text, or leave it the way it is. If you want to do more, you can insert images, create tables, or create links to other pages/documents.

The functionality varies depending on how the editor is set up. Here, we describe the default editor with all the options enabled. Contact your system administrator for details regarding your editor.

Editor Buttons

By default, the following editor buttons are available. Your system administrator can determine which buttons are displayed in different templates. You therefore might have access to more or fewer buttons than those shown here.

Paragraph Break/Line Break

The Rich Text Editor is like any other word-processing program. You write the text and the text wraps around when the line reaches the end. Use the following keyboard shortcuts in the editor to add:

• Space between paragraphs - press ENTER.

• Line breaks - press SHIFT + ENTER.

Shortcut Keys

To make your work easier, there are shortcut keys for certain editor functions. Use the following shortcut keys to carry out certain commands:

We have listed only a few keyboard shortcuts. For a detailed list of available keyboard shortcuts, see the TinyMCE Documentation.

View Source Code

If you are proficient in HTML, you can switch to HTML mode to create your page. You can also check the code and make minor adjustments to get the page exactly as you want.

Certain elements such as scripts are not recognized by the HTML view of the Rich Text Editor. You can enter the scripts directly in the text view of the editor.

Formats

You can apply formatting via the Formats drop-down list. The Formats drop-down list provides predefined styles that can be applied to text while maintaining a consistent look and feel throughout the site.

These styles incorporate advanced formatting functionality which can be applied to provide a different look for certain elements such as links, headings, and sub-headings. For example, you can use a format style to change a link into a call-to-action button.

To apply pre-defined styles:

1. Select the text you want to apply the style.

2. Choose the style from the Format drop-down list.

For more information on how to create the Styles, see the Rich Text Editor Styles article.

Text Formatting

You do not normally need to spend much time formatting text because Umbraco takes care of the formatting. However, the editor provides some options for controlling the text styles.

Formatting Buttons

The most familiar way to control formatting is by using the formatting buttons. With these buttons, you can apply basic formatting such as Bold, Italic, aligning text, creating bulleted and numbered lists, and applying indents.

To apply a format using the formatting buttons:

1. Select the text you want to apply the formatting.

2. Click the desired format button.

Copying Content from Other Programs

While pasting content, the original text styles are preserved which can lead to different font faces, sizes, and colors displaying on the website when viewed.

Remove Formatting

If you have already formatted a paragraph or selection using the formatting buttons, you can remove the formatting rule.

To remove formatting:

1. Select the text you want to remove the style from.

2. Click the relevant formatting button to remove the formatting rule.

You can also add a Remove format button in your toolbar. To add the Remove format button:

1. Navigate to your Rich Text Editor in the Document Type.

2. Click the cog wheel.

3. Click Edit next to the Rich Text Editor Data Type.

4. Select Remove format under the Toolbar Configuration.

5. Click Submit.

6. Click Save.

Links

The Insert/Edit Link button is used to add or update links to internal pages, external pages, media files, email links, and anchors. The process for inserting a hyperlink differs depending on the type of hyperlink you wish to create.

To insert different types of hyperlinks, follow these steps:

Working with Images

To display images on a page the images must be uploaded to your Umbraco media library.

Many administrators set up a media library containing images that editors can use on their pages. Others allow their editor's free use of their images. The procedure for uploading an image varies slightly depending on which method your administrators have setup. Check with your system administrator for more information about this.

Macros

In Umbraco, Macros are small building blocks of functionality that can be dropped into an editor. Each macro encompasses a piece of functionality and provides an interface to modify the macro to your requirements. A macro can be anything from a contact form to an embedded media player. The advantage of macros is that it gives editors the ability to add complex elements to a page.

The macros available differ on each system. Kindly check with your system administrator to find out which macros are available to you and what they do. The process for adding and updating a macro is as follows:

Adding a Macro to the Page

1. Place the cursor in the Rich Text Editor where you want to insert your macro.

2. Click the Insert Macro button from the toolbar.

3. Select a macro to insert from the macros list.

4. Click Submit.

   • The macro is displayed in the editor with a dotted border.

Editing Macros

You can edit values after a macro has been added to the Rich Text Editor:

1. Select the macro in the Rich Text Editor.

2. Click the Insert Macro button from the toolbar.

   • This will open the configuration menu where you can edit any values previously added.

Removing Macros

To remove a macro:

1. Select the macro in the Rich Text Editor.

2. Press the Delete or Backspace button on your keyboard.

Tables

Tables are used to format information in a grid-based structure. When you insert a table, you select how many rows and columns the table should comprise of. Additionally, you can fill in some optional formatting properties. These values can be changed later, so it is not important to know exactly what your table will look like when you create it.

Editing an Existing Table

To edit the table after creating it, click on the table. A pop-up appears with different table properties and options. Alternatively, you can click on the Table button in the Rich Text Editor toolbar.

Clicking on Table Properties gives you different options for modifying the table’s appearance. However, the developer of the website may have already created table styles for you so you may not need to adjust these settings.

There are other options available for modifying cells, rows, and columns such as width, height, alignment, border, and so on.

Configuring a Rich Text Editor

The Rich Text Editor in Umbraco can be configured in many different ways.

For more information, see the Rich Text Editor Configuration article.

Initial View

After logging in to an Umbraco project you will be presented with a dashboard containing a wide array of buttons and features. Let's quickly go through what each feature does.

The Dashboard

By default, there are two dashboards available:

1. The Getting Started dashboard provides helpful information about Umbraco.

2. The Redirect URL Management dashboard displays the original and redirected links of the published pages which are moved to a new location in your project.

Search, Help, and Profile Settings

1. The Search bar allows you to search for the content in your entire project.

2. The Help icon provides different Help options such as Tours, Umbraco Learning Base YouTube videos, Umbraco Documentation, and your System Information.

3. The profile icon allows you to edit your profile, change the password, and Logout from the application.

The Sections Menu

The following sections are available in the backoffice:

• Content - allows to manage your content.

• Media - allows to manage images and other media files.

• Settings - allows to handle your meta data such as document types.

• Packages - allows to manage and install packages.

• Users - allows to manage the users on the project. To learn more about users, see the Users article.

• Members - allows to handle the members of the project. If you want to learn more about Members, see the Members article.

• Forms - allows to create and manage your forms.

• Translation - allows to manage dictionary items.

The menu list will differ depending on your permissions for the project. For example: if you are an editor, then you will only have access to Content, Media and Forms as per default settings.

The Section tree

The section tree is different depending on the section you are in. The section provides an overview of the nodes contained in the tree.

In this example, you are looking at the content section.

The Content tab allows you to create content nodes and manage your content tree. When you hover over the sections, it is highlighted with a darker color indicating that you are hovering over it. A button with three dots will show up, left-click or right-click to view additional options.

The Recycle Bin contains the deleted content and is available only in the Content and the Media section.

Within the Info content app for pages you can find the Audit Trail in the History section. Here, you can get a quick overview of the actions performed on that node, by whom, when and any additional comments.

The Audit Trail is useful to find out who made changes on a certain date.

To view the audit trail:

1. Go to the Content section.

2. Navigate to the page you wish to see the audit trail.

3. Go to the Info tab.

Umbraco allows you to work with multiple versions of the same page. All previously saved pages are stored in a version history list. In this section, you will find information on how to compare versions or roll back different versions of content:

You have the opportunity to access and re-publish older versions, if necessary.

To rollback to a previous version of the page:

1. Navigate to the page whose versions you wish to view.

2. Go to the Info tab.

3. Click on the Rollback button in the History section.
4. The Rollback window opens. Select a version of the page you wish to Rollback to.
5. Click Rollback to proceed with the changes. Your content has now been rolled back to the selected version of the page and is saved as a Draft version.

6. To publish the draft version, click Save and publish.

All media within your site must be loaded in the Media section. The Media section is a media library for the site. Within the Media section, you can create or organize files and folders as in a File Explorer.

Folders help organize the Media section and keep similar media items in a logical structure. We recommend using folders to organize your media items. When your media library starts growing, folders help in locating media quickly and easily.

Creating a Folder

To create a folder:

1. Go to the Media section.

2. Click on ••• where you want to create the folder and select Folder.
3. Enter a Name for your folder and click Save.

Editing a Folder

To edit an existing folder:

1. Select the folder you want to edit from the Media tree.

2. Edit the title at the top of the page.

3. Click Create to add another media type or drag and drop your files into the Upload field.
4. Click Save.

Deleting a Folder

If you wish to tidy up the Media section of your site, you can delete existing folders. Once you have deleted a folder, it is sent to the Recycle Bin. If you change your mind, you can restore the deleted folder from the Recycle Bin.

To delete a folder:

1. Select the folder you want to delete.

2. Right-click the folder, and select Delete.
3. Click OK.

Restoring a Folder from the Recycle Bin

The Recycle Bin is a separate tree structure within the Media tree. Clicking on the arrow next to the Recycle Bin will display its contents.

To restore a Folder:

1. Click ••• next to the Folder or right-click the Folder you want to restore.

2. Select Restore.
3. Click Restore.

Moving a Folder from the Recycle Bin

To move Folders within the Media section:

1. Click ••• next to the folder or right-click the folder you want to move.

2. Select Move.
3. Choose the location where you want to move the folder to in the tree structure.
4. Click Move.

5. Click OK to dismiss the confirmation message.

Sorting the Contents of a Folder

Media items in Umbraco are sorted in the tree view according to a predefined sort order. The item that has been created most recently is placed at the bottom of the tree structure.

To sort the order of the items in a folder:

1. Right-click the folder you want to sort.

2. Select Sort.
3. Drag the folders, images and files into the required order. Alternatively, click on the Name or Creation Date column header to sort the items in ascending or descending order. Clicking on a column header again reverses the sort order.
4. Click Save.

This section provides a few handy tips to work with your Content using Umbraco:

The following default Media Types are available:

• Article - Used for uploading and storing documents.

• Audio - used for uploading and storing digital audio files.

• File - used for uploading and storing different types of files in the Media section.

• Folder - a container for organizing media items in the media tree.

• Image - used for uploading and storing images.

• Vector Graphics (SVG) - used for uploading and storing Scalable Vector Graphics files which are text files containing source code to draw the desired image.

• Video - used for uploading and storing video files.

Uploading a Media Item

In the Media Library, there are multiple ways to upload media items. The two most commonly used ones are:

1. Use the Create button to create a new media item and then upload directly from your machine.

2. The Upload field is available in every folder in the Media section, where you can drag and drop files or choose files to the desired location.

Deleting a Media Item

If you wish to tidy up the Media section of your site, you can delete existing media items. Once you have deleted a media item, it is sent to the Recycle Bin. If you change your mind, you can restore the deleted media item from the Recycle Bin.

To delete a Media Item:

1. Select the media item you want to delete.

2. Right-click the media item and select Delete.
3. Click OK.

4. Click OK to dismiss the confirmation message.

Restoring a Media Item from the Recycle Bin

The Recycle Bin is a separate tree structure within the Media section. Clicking on the arrow next to the Recycle Bin will display its contents.

To restore a Media Item:

1. Click ••• next to the Media Item or right-click the Media Item you want to restore.

2. Select Restore.
3. Click Restore.

Moving an Image or File

To move Media Items within the Media section:

1. Select the Media Item you want to move.

2. Right-click the Media Item and click Move.
3. Choose the location where you want to move the Media Item to in the tree structure.
4. Click Move.

5. Click OK to dismiss the confirmation message.

When editing content, the content tree will refresh itself when the content is saved.

If the tree does not refresh or if multiple editors are working on the site, and you want to have their changes loaded into your content tree - you can do so by reloading parts of the content tree.

To reload a section of the content tree:

1. Right-click on an item in the tree.

2. Choose Reload. The parent and child nodes are now reloaded and will reflect any new changes.

When viewing page content in preview mode you have the option to scale the preview window to various device sizes:

1. Once you have finished editing the page content, click Save and preview.

2. Select Fit browser to view the different preview modes.
3. Select the device you would like to scale the preview pane to.

You can set up notifications to receive an email when an action is performed on a given content item. To receive notifications, you need to add your email address to your user profile.

To set up notifications for a content item:

1. Right-click the page or select the page and click Actions in the top-right corner of the screen.

2. Choose Notifications.
3. Check the actions in which you are interested and you will receive notifications each time the given action occurs.
4. Click Save.

Move pages within the website through the tree view. Not all pages can be moved depending on your set-up or page permissions. If you need clarification, contact your system administrator.

You can move a page in two ways:

Option 1

1. Go to Content.

2. Right-click the page you wish to move and select Move. Alternatively, click ••• next to the parent node, select Do something else and click Move.
3. A window appears next to the section tree. Here, you can choose where you want to move the page in the tree structure.
4. Click Move.

5. A confirmation message appears. Click OK to dismiss the confirmation message.

Option 2

1. Go to Content.

2. Select the page you wish to move.

3. Select Actions in the top-right corner of the screen.

4. Select Move from the Actions drop-down menu.
5. A window appears next to the section tree. Here, you can choose where you want to move the page in the tree structure.
6. Click Move.

7. A confirmation message appears. Click OK to dismiss the confirmation message.

If you have pages that are no longer required for your website, you can delete them. Upon deletion, the page is moved to the Recycle Bin and is not deleted permanently.

In case you wish to restore the page, you can restore them from the Recycle Bin. You also have the option to empty the Recycle Bin which permanently deletes all the items.

Deleting a Page

To delete a page:

1. Go to Content.

2. Right-click the page you wish to delete and select Delete.

   Alternatively, click Actions in the top-right corner of the screen and select Delete.
3. A window appears next to the section tree confirming if you want to delete the page.
4. Click OK.

5. A confirmation message appears. Click OK to dismiss the confirmation message.

Moving a Deleted Page from the Recycle Bin

To move deleted pages from the Recycle Bin:

1. Right-click the page you wish to move from the Recycle Bin and select Move. Alternatively, click ••• next to the page in the Recycle Bin and select Move.

   You can also click Actions in the top-right corner of the screen and select Move.
2. Here, you can choose where you want to move the page in the tree structure.
3. Click Move.

4. A confirmation message appears. Click OK to dismiss the confirmation message.

Restoring a Deleted Page from the Recycle Bin

The Recycle Bin is a separate tree list which can be found at the bottom of the section tree view. Clicking the arrow to the left of the Recycle Bin icon will reveal any pages that have been deleted from the website.

To restore deleted pages from the Recycle Bin:

1. Right-click the page you wish to restore from the Recycle Bin and select Restore. Alternatively, click ••• next to the page in the Recycle Bin and select Restore.

   You can also click Actions in the top-right corner of the screen and select Restore.
2. A window appears next to the section tree confirming if you want to restore the page.
3. Click Restore.

4. A confirmation message appears. Click OK to dismiss the confirmation message.

Emptying the Recycle Bin

If you are confident you no longer require any pages in the Recycle Bin, you can permanently delete it. You can delete pages one by one or empty the Recycle Bin in one go.

To empty the Recycle Bin:

1. Right-click the Recycle Bin and select Empty recycle bin. Alternatively, click ••• next to the Recycle Bin and select Empty recycle bin.
2. A window appears next to the section tree confirming if you want to empty the recycle bin.
3. Click OK.

To delete individual pages from the Recycle Bin:

1. Right-click the page you wish to delete from the Recycle Bin and select Delete. Alternatively, click ••• next to the page from the Recycle Bin and select Delete.

   You can also click Actions in the top-right corner of the screen and select Delete.
2. A window appears next to the section tree confirming if you want to delete the page permanently.
3. Click OK.

4. A confirmation message appears. Click OK to dismiss the confirmation message.

In this section, you will get an overview of how to create and save pages. You will also learn more about how to publish and unpublish your content, as well as how you can compare content between multiple environments. Finally, you will also get an introduction to how you can transfer your created content to another environment.

Creating a New Page

Select the parent page to create your new page. The parent page can be the home page or any of the sub-pages of the site.

If the parent page allows sub-pages underneath it, follow these steps:

1. Hover over the name of the parent page in the Content section and click ••• to view the types of pages you can create.

2. Select the page type you wish to create. The new page is loaded in the editor on the right-hand side.

3. Enter a Name for the page and click Save.

Saving and Publishing Pages

There are three different options for saving and publishing pages. The options vary depending on whether you’re still in the process of editing the page or have completed your edits and wish to publish your changes.

Option 1: Save and Preview

The Save and preview button allows you to save your changes and preview it before publishing the changes to the live site. The Preview feature shows you how the page will look once it is published. This Save and preview feature only saves your page and does not publish your contents to the live site.

Option 2: Save

The Save button is used for saving the page without publishing the changes to the live site. The Save feature is especially useful if you are working on changes over a period of time as you can save your changes frequently to prevent losing any data.

Option 3: Save and Publish

The Save and publish button is used to publish a previously saved page to the live website or to publish a page without previewing it. The Save and publish feature will save and publish the page to your live website.

The Save and publish button has three options:

1: Schedule

The Schedule button allows you to set a time and a date for when your page should be published. With this option, you can continue working on your edits and the site will automatically be published at the time and date it was scheduled to.

To set up scheduled publishing, follow these steps:

1. Navigate to the page you want to publish.

2. Select the arrow next to the Save and Publish button.

3. Select Schedule.

4. In the Scheduled Publishing window, set the date and time in the Publish at field.
5. Select Schedule.

2: Publish with descendants

The Publish with descendants button allows you to publish the current page and all the content linked to this page to the live site. Using this option, you can publish the current parent page and it's child nodes, previously published, and unpublished content items.

To publish the node with descendants, follow these steps:

1. Navigate to the page you want to publish.

2. Select the arrow next to the Save and Publish button.

3. Select Publish with descendants.
4. Toggle the option to Include unpublished content items if you wish to. This option includes all unpublished content items for the selected page and the available linked pages.

3: Unpublish

The Unpublish button allows you to unpublish a page if you do not want a page to be publicly visible and do not want to delete it.

To unpublish a page, follow these steps:

1. Navigate to the page you want to unpublish.

2. Select the arrow next to the Save and Publish button.

3. Select Unpublish.

You can also unpublish your page by setting the date and time using the Schedule feature.

To set up scheduled unpublishing, follow these steps:

1. Navigate to the page you want to unpublish.

2. Select the arrow next to the Save and Publish button.

3. Select Schedule.

4. In the Scheduled Publishing window, set the date and time in the Unpublish at field.
5. Select Schedule.

Comparing Content between environments

Compare Content allows previewing content changes before transferring them to another environment. This is helpful to ensure that the correct updates are transferred when working with content in multiple environments.

You can see the Summary Information and Field Comparison values to understand what will change if you proceed to transfer the content to a higher environment or try restoring content to the current environment.

To compare content between environments, follow these steps:

1. Navigate to the page you want to compare.

2. Select the arrow next to the Save and Publish button. Alternatively, you can right-click the content node or click the Actions drop-down.

3. Select Compare to open the Compare window.
4. Choose the workspace from the drop-down field.

5. View the Summary information.

6. In the Field Comparison table, view the differences between the versions in the two workspaces at the node level of each field.

7. Proceed to transfer the content using the Queue for transfer or Transfer now options.

8. Restore the content from the higher environment using the Partial restore option.

9. Click Close to continue editing the content node.

Transferring content

You can transfer a specific content node directly to the higher environment without adding it to the Queue for transfer.

To transfer content between environments, follow these steps:

1. Navigate to the page you want to transfer.

2. Select the arrow next to the Save and Publish button.

3. Select Transfer now.
4. In the Transfer now window, a message is displayed that you are about to transfer the content node directly to the higher environment, without adding it to the queue.
5. Click Transfer now.

Umbraco is set up to automatically log a user out if they have been inactive for over 20 minutes. Don't worry if you are logged out of Umbraco. Log back in using your credentials and continue editing.

If your system administrator has set up cropping for your images, you will see a similar interface when you edit your images:

The pink circle in the middle of the image is the default focal point. The focal point defines the primary area or focus of the image which will be the center point of any image re-sizing. You can move the focal point by clicking and dragging it to the desired part of the image.

Next to the image, you may see specific crops of the image depending on your setup. In the above example, you can see that 2 crops have been set-up. To add or update the image crops, see Adding properties section in the Creating media article.

To manually alter the pre-defined crops:

1. Select one of the crops - you will see an enlarged version of the crop.

2. Drag the image around and zoom in or out until you have the desired result.
3. Once you are happy with your changes, click Done to save the changes.

4. If you wish to reset the crop to default view, click Reset crop.

5. Once you have finished editing the crops, click Save and close.

Content Within the Tree View

When you are looking to edit content, locate the page you want to edit in the section tree on the left-side of the screen.

To edit existing content, follow these steps:

1. Go to the Content section.

2. Select the page in the section tree you wish to edit. The content of the page is loaded in the right-side editor.

3. Edit the contents of the page.

4. Click Save to save the edits without publishing it.

5. Click Save and preview to preview the changes.

6. Click Save and publish to publish the changes. For more information, see the Save and Publishing Pages article.

View Page Layout

You can view Page layouts in three ways:

1. Tree View

   The tree view is present in the section tree on the left-side of the screen. For a growing website with multiple content pages, the tree view can become very large and unmanageable.
2. List View

   When you enable listview on a page, there will be no standard tree view for that page. Clicking on the parent page displays the child pages in the list view.

   To enable list view:

   1. Go to Settings.

   2. Navigate to the Document Type/page you wish to enable list view.

   3. Go to the List View tab.

   4. Toggle Enable List view and click Save.

   Additionally, you can sort the column Name, Last edited, and Created by in ascending or descending order to sort the list items.

3. Tiles View

   You can switch between list view and tiles view by clicking the view icon in the top-right of the screen: