Skip to content

Commit 421f1a3

Browse files
authored
[TASK] Guide for Creating a Page with Drag and Drop (#10)
1 parent 9156faa commit 421f1a3

File tree

5 files changed

+60
-0
lines changed

5 files changed

+60
-0
lines changed
Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
# Create a Page with Drag and Drop
2+
3+
<!--#TYPO3v13 #Beginner #Backend @ninaaline -->
4+
5+
TYPO3 lets you quickly create new pages directly in the page tree. The drag & drop method is a fast way to add a page exactly where you want it — either as a child of an existing page or as a sibling between two pages.
6+
7+
## Learning objective
8+
9+
In this step-by-step guide you will create a new page in the TYPO3 backend using the drag & drop method.
10+
11+
## Prerequisites
12+
13+
### Tools and technology
14+
15+
* A computer with a local TYPO3 installation
16+
* Access to the TYPO3 backend (editor or admin account)
17+
* A web browser
18+
19+
### Knowledge and skills
20+
21+
* You know how to log in into the TYPO3 backend
22+
* You know how to open the **Page** module
23+
24+
## Watch the video
25+
26+
**[Watch this tutorial on YouTube](https://www.youtube.com/watch?v=UzHc1Z3vT6E&t=25s) to follow along.
27+
*Only the first part of the video (creating a page with drag & drop) is relevant for this guide.*
28+
29+
## Create a page using drag & drop
30+
31+
1. In the backend, open the **Page** module from the left-hand menu.
32+
33+
![TYPO3 sidebar menu displays four options: Page (highlighted), View, List, and Forms, each with corresponding icons.](Images/CreateAPageWithDragAndDrop/PageModule.png)
34+
2. Expand the page tree so you see the place where you want to add your new page.
35+
3. At the top of the page tree, locate the **new page icons** (representing different page types).
36+
![YPO3 pagetree toolbar icons showing options to create a standard page, link to a page, create a shortcut, or hide a page.](Images/CreateAPageWithDragAndDrop/PagetreeIcons.png)
37+
4. Drag the **Standard page** icon ![A blank document icon with a folded corner.](Images/CreateAPageWithDragAndDrop/NewPageIcon.png)
38+
and drop it:
39+
40+
1. **Between two existing pages** → creates a sibling page at the same level
41+
2. **On top of an existing page** → creates a child page under that parent
42+
5. When prompted, enter a title for your new page and press **Enter**
43+
![TYPO3 Pagetree with a main and a nested page showing how to edit a page title directly in the page tree](Images/CreateAPageWithDragAndDrop/Pagetitle.png)
44+
6. Confirm the new page appears in the page tree at the position you selected.
45+
46+
## Summary
47+
48+
You created a new TYPO3 page by dragging a page icon from the top of the page tree and dropping it into position. This is the quickest way to add pages while building your site structure.
49+
50+
## Next steps
51+
52+
Now that you’ve added a page, you might like to:
53+
54+
* [Enable a page](EnablingAndDisablingAPageInThePagetree.md) so it becomes visible in the frontend
55+
* [Create a page with the context menu](CreateAPageWithTheContextMenu) for more precise placement
56+
* [Add content to your page](https://docs.typo3.org/permalink/t3editors:content-creating)
57+
58+
## Resources
59+
60+
* [Creating pages in the TYPO3 Editors Tutorial](https://docs.typo3.org/permalink/t3editors:pages-creating)
3.6 KB
Loading
11.5 KB
Loading
7.82 KB
Loading
5.15 KB
Loading

0 commit comments

Comments
 (0)