Compatible XF Versions:
To create a new page go to ACP -> Applications -> Create New Page
Select the various tabs and configure the fields.
A Page node is not meant to replicate a standalone HTML page.
If you want page content to look exactly like post content then you must wrap it in this div:
Those 3 CSS classes are responsible for:
The image below shows a comparison between a forum post and a page with baseHtml & messageText CSS, baseHtml only, messageText only and no CSS classes.
![[Image: forum_page_comparison-png.26136]](https://xenforo.com/community/attachments/forum_page_comparison-png.26136/)
As you can see the appearance is quite different in each case.
To make embedded images resize and zoom when clicked, see this thread: Make embedded images in Pages automatically resize and zoom when clicked
To remove the page title, add this at the top of the template html field:
- 1.0
- 1.1
- 1.2
- 1.3
- 1.4
- 1.5
To create a new page go to ACP -> Applications -> Create New Page
Select the various tabs and configure the fields.
- Enter a URL Portion (e.g. example-page) – this will be the URL of the page, for example: https://xenforo.com/community/pages/example-page/
- Enter the title, e.g. Welcome To My Forum
- Enter a description – this is optional and will appear as muted text below the title (see the screenshots below)
- Select the Parent Node – this can be the root, a category, forum or another page
- Set the display order
- Check the checkbox if you want the page to be visible in the list
- Enter your markup (HTML/CSS code) in the Template HTML field – see the notes below
- Select whether you want the published date and number of visits to be displayed in the bottom right hand corner of the page
- Select whether links to sibling and child nodes are to be displayed within the page
- Finally you have the option of forcing the page to display in a particular style, no matter what style a member is using.
A Page node is not meant to replicate a standalone HTML page.
If you want page content to look exactly like post content then you must wrap it in this div:
Code:
<div class="messageText ugc baseHtml">
Content here
</div>Those 3 CSS classes are responsible for:
- defining the font settings (messageText)
- styling URL links (ugc)
- resetting the html back to “normal” (baseHtml)
The image below shows a comparison between a forum post and a page with baseHtml & messageText CSS, baseHtml only, messageText only and no CSS classes.
As you can see the appearance is quite different in each case.
To make embedded images resize and zoom when clicked, see this thread: Make embedded images in Pages automatically resize and zoom when clicked
To remove the page title, add this at the top of the template html field:
Code:
<xen:h1></xen:h1>![[Image: KiXcHZw.gif]](https://i.imgur.com/KiXcHZw.gif)
