Flatboard theme mechanism explained [WIP But mostly done]
Flatboard theme mechanism explained [WIP But mostly done]
Tillreetree@fc7e1f5a Saturday 10th June 2023, 02:46:34The following is still being written, using Markdown syntax.
If I have time, I will continue to update and write about each of the theme files.
Look at the crazy indentations!
If I have time, I will continue to update and write about each of the theme files.
# Flatboard theme mechanism explained
The theme mechanism of Flatboard is more complex than the hook mechanism. I don't know why Fred wrote this in this way.
## Minimum requirements for the production of themes:
- Make a copy of the Bootstrap theme
- Modify header.tpl.php, main.tpl.php, footer.tpl.php
## How does Flatboard output HTML
> The following is based on the default "Bootstrap" theme. Some hooks are omitted.
Most pages (such as`index.php`,`view.php`,`edit.php`, etc.) included `header.php` and `footer.php` in order:
1. **header.php**
- * Call `init.php` to load necessary constants, variables, class libraries, etc. *
- Defines the `$out` array, which contains:
- 'self': current page ID (it's different from `$cur`)
- 'subtitle': page name
- 'content': page content
- Start the output buffer at the same time
2. **The page itself** such as `index.php`,`view.php`, etc
- Call the corresponding template file, like `lastposts.tpl.php`,`viewForum.tpl.php`, etc
- Fortunately, these template files are easier to understand than the template files described in this article, so I won't go into details.
3. **footer.php**
- Here it will determine what value `$out['self']` is and decide what base template to call
- `feed`😽*RSS feeds**- include `feed.tpl.php`
- **feed.tpl.php**
- Output XML directly
- `auth`😽*login page**- include `login.tpl.php`
- **login.tpl.php**This page does not use'header.tpl.php 'and'footer.tpl.php', so the HTML has to be rewritten. Include the following:
1. html tag, you need to state the language `lang="<?php echo $config ['lang']?>`
1. head tag
1. meta tags, note that the description is `<?php echo Util ::De script ion ()?>`
2. title tag, the content is `<?php echo $config ['title ']?> - <?php echo $out [' subtitle ']?>`, you can swap the two variables if necessary
3. base tag, href is `<?php echo $out ['baseURL']?>`
4. CSS stylesheet links
5. favicon links
6. ATOM Feeds links with topics and replies
2. body tag
1.A tag (hyperlink) for returning to the home page
- img tag, used to display website LOGO
2. h1 tag with the content '<?php echo $out [' subtitle ']?>'
3. section tag
- Login form
- `config`😽*backend (config, settings) page**- include `dashboard.tpl.php`
- **dashboard.tpl.php** This page includes new CSS. Here you can include CSS for your theme without adding additional CSS. Include the following:
- WIP
- `Other cases`😽*foreground page**- include `main.tpl.php`
- **main.tpl.php** *Here comes the big deal!* This file handles most frontend visible pages. Includes the following:
1. First include `header.tpl.php`
- **header.tpl.php**Output page header content. Include the following:
1. html tag, you need to state the language'lang = "<?php echo $config ['lang']?> '
1. head tag
1. meta tag, note that the description is `<?php echo Util ::De script ion ()?>`
2. title tag, the content is `<?php echo $config ['title ']?> - <?php echo $out ['subtitle']?>`, if necessary, you can swap the two variables
3. base tag, href is `<?php echo $out ['baseURL']?>`
4. CSS stylesheet links
5. favicon links
6. ATOM Feeds links with topics and replies
2. body tag
1. Navigation bar (header tag)
- Left (navigation link)
- website name
- Blog
- Forum
- search
- Plugin menu hook
- Right (user related links)
- If it is "admin/worker"
- Config/Logout
- If it is "normal user"
- Login/Logout
2. Login modal box (only displayed when not logged in), containing the login form
2. *jumbotron area* `<div class = "jumbotron">`
- Determine "whether it is now on the homepage, and fill in the announcement `if (! $config ['announcement ']=='' && $ cur ==' home ')`:
- If true, output the contents of the announcement.
- '</div>'
- Determine "whether you are currently browsing the forum section page'if ($cur === 'viewForum') '":
- If true, output information such as plate icon, plate name, plate introduction, etc.
- '</div>'
3. *Page body area* `<main role="main">`
- Determine "if you are not currently browsing topics or blogs or normal pages `if ($cur! == 'viewTopic' & & $cur! == 'blog' & & $cur! == $gPage)` "
- If true, include `sidebar.tpl.php`
- **sidebar.tpl.php** includes the following:
1. aside tag
1. Determine "if logged in `if ($sessionTrip !='')`"：
- If true, then determine "whether you are currently visiting the forum section page `if ($cur == 'viewForum')` "
- if true, output "Add Topic button"
- Otherwise (on other pages), output "Add Topic modal button"
- Otherwise, output "Login modal button"
2. Forum section list, ul tag, include `categorys.tpl.php`
- **categorys.tpl.php** includes the following:
1. li tag
- Forum section link, including link, icon, name
3. Forum Stats
1. Number of posts
2. Number of replies
3. The total number of the first two combined
4. Determine "Whether the constant TIMESTAMP exists`if (TIMESTAMP) `"
- If true, display the load time
4. RSS feed link
- **Output the content in `$out ['content']`** (but not everything must be put in `$out ['content']`)
- '</main>'
4. Finally include `footer.tpl.php`
- **footer.tpl.php** includes the following:
1. footer element
- footer custom text `<?php echo $config['footer_text']?> | <?php echo $lang['powered']?> `
- Flatboard version number
2. Call `select_topic.tpl.php.`
- **select_topic tpl.php** includes the following:
1. Modal box
1. Drop-down list to select the forum to add a topic to
1. The first option in the drop-down list is "Forum", and the other options are the forum name
2. When selecting a forum, the page will jump to "add.php/topic/forum ID"
3. Import JS files
4. `</body>'
5. `</html>'
## Template files quick rundown
| File name | purpose | where to call (category) | where to call (file) | which files to call | how to output | available primary variables (etc means there are more secondary variables) | Remarks | |
|----------------------------|-------------------------------------------------------|--------------------------|----------------------|-------------------------------|------------------|-------------------------------------------------------------------------------------------------------------------------|-------------------------------------------------------------------------------------------------------|---|
| add_topic.tpl.php | Add topic | Unknown | | | | | | |
| banned.tpl.php | Banned Alert Page | Core | lib/User.lib.php | | Direct | | | |
| blog.tpl.php | Blog page | Core | blog.php | | $out['content'] | $topicEntry，$tag，$author，$content，$forumEntry，$forumID，etc | | |
| categories.tpl.php | Forum section list | Theme | header.tpl.php | | echo | $forumEntry ，$key，$forum，etc | | |
| dashboard.tpl.php | Backend Dashboard page | Core | footer.php | | Direct | $assets ，$notes，$lang，$config，$out，$cur | | |
| feed.tpl.php | RSS Feed Page | Core | footer.php | | Direct | $config ，$out | | |
| footer.tpl.php | bottom of website | Theme | main.tpl.php | select_topic.tpl.php | Direct | $lang，$config，$out | | |
| forum.tpl.php | Forum section overview page | Core | index.php | | $out['content'] | $forumEntry，$controlStr，$privateforums，$topic，$topicEntry，$lastTopic，$replyEntry，$lastReply，etc | | |
| header.tpl.php | Head of website | Theme | main.tpl.php | categories.tpl.php | Direct | $destination，$css，$config，$out，$lang，$cur，etc | | |
| lastposts.tpl.php | Home (Latest Topic Page) (Topic List) | Core | index.php | | $out['content'] | $lang，$tag，$tagReply，$replyEntry，$topicEntry，$forumEntry，$topic，$reply，$tagMix，$privateforums | | |
| login.tpl.php | login page | Core | footer.php | | Direct | $lang，$config，$out | | |
| main.tpl.php | Website main body part | Core | footer.php | header.tpl.php，footer.tpl.php | Direct | $gPage，$config，$cur，$forumEntry，$out | | |
| private_viewForum.tpl.php | Alert page for private forums | Unknown | | | $out['content'] | $topic，$tag，$topicEntry，$forumEntry，$config，$lastedited | | |
| replyFormCollapse.tpl.php | reply form | Core | view.php | | $out['content'] | $user，$username，$h1，$h2，$d，$s，$file_path，$file_html，$dots，$pic，$identity，$avatar，$welcomeBack，$sessionTrip，$sessionMail | | |
| search.tpl.php | Search page | Core | search.php | | $out['content'] | $tagsOption | | |
| select_topic.tpl.php | Select witch forum to post (modal) | Core | footer.php | | Direct | $forums，$forumEntry，etc | | |
| sidebar.tpl.php | Website sidebar | Theme | main.tpl.php | categories.tpl.php | Direct | $sessionTrip，$cur，$lang，etc | | |
| viewForum.tpl.php | Viewing forum (list of topics) | Core | view.php | | $out['content'] | $topic，$topicEntry ，$tag，$forumEntry，$lastReply，$lastedited，etc | | |
| viewReply.tpl.php | View replies (reply list) (including publisher modal) | Core | view.php | | $out['content'] | $reply，$replyEntry，$lastReplyEdited，$topicEntry，$report | | |
| viewSuggestedTopic.tpl.php | View recommended topics (list of topics) | Core | view.php | | $out['content'] | $topic，$topicEntry ，$tagSuggest，$forumEntry，$lastReply，$lastedited，etc | The tag variable becomes tagSuggest | |
| viewTopic.tpl.php | View topic (including publisher modal) | Core | view.php | | $out['content'] | $topic，$topicEntry ，$tag，$forumEntry，$lastedited，$report，etc | In the source code it looks like this: require THEME_DIR . $config['theme'] . DS . $cur . '.tpl.php'; | |
| | | | | | | | | |
| | | | | | | | | |
Look at the crazy indentations!
Last modified by Tillreetree@fc7e1f5a on Friday 16th June 2023, 02:36:00
Replies 15
Me too, but if I'm lazy or in a lazy mood, but what tree was saying is that you have to copy the boostrap folder in order to use the theme, just edit the CSS file or add your own and clear catche.
Last modified by XHiddenProjects on Thursday 15th June 2023, 03:50:00
Software engineer, creates plugins for Flatboard, checks source codes, and answers any software errors questions and contributes on the GitHub page as well
I just can't understand the theming structure, I've seen files named differently. And within every file, there are some undefined variables being used.
Also, I've seen like the backend also needs template files from the theme.
A proper documentation would help, providing every details needed. Explaining the theme files structure, Explaining the available variables in the scope and what they can be used for.
In addition, there should be a documentation of constants, variables, functions and classes that can be used (maybe for adding custom functionalities like Plugins do).
Also, I've seen like the backend also needs template files from the theme.
A proper documentation would help, providing every details needed. Explaining the theme files structure, Explaining the available variables in the scope and what they can be used for.
In addition, there should be a documentation of constants, variables, functions and classes that can be used (maybe for adding custom functionalities like Plugins do).
definitely; maybe only the admin of this site(like Fred) can provide it......A proper documentation would help, providing every details needed. Explaining the theme files structure, Explaining the available variables in the scope and what they can be used for.
I completely understand where you are coming from, the structure is not the best for any non-developers or starters at developing. Along with the documentation, that would take up too much time to list every variable and its performance, maybe a broad version sure, but it took some time to understand what is occurring.
Also yes, only the admin(@Fred) can edit that.
So quick rundown
different TEMPLATE(.tpl) files is what is being output, for example. forum.tpl.php that affects what is being shown on the forum, so you can change how the forum is displayed.
Also yes, only the admin(@Fred) can edit that.
So quick rundown
different TEMPLATE(.tpl) files is what is being output, for example. forum.tpl.php that affects what is being shown on the forum, so you can change how the forum is displayed.
Software engineer, creates plugins for Flatboard, checks source codes, and answers any software errors questions and contributes on the GitHub page as well
I updated "Template files quick rundown" table, hope it can help a little bit
I would really like the template mechanism to all use "direct HTML output", which would save a lot of brain cells; using "$out['content']" is the most brain-intensive("kills" the most brain cells), as it requires particularly frequent use of dots to connect different strings ("<b>" . $something . "</b>") (whereas "direct HTML" can be output using “php echo $something” to output)
I would really like the template mechanism to all use "direct HTML output", which would save a lot of brain cells; using "$out['content']" is the most brain-intensive("kills" the most brain cells), as it requires particularly frequent use of dots to connect different strings ("<b>" . $something . "</b>") (whereas "direct HTML" can be output using “php echo $something” to output)
Last modified by Tillreetree@fc7e1f5a on Friday 16th June 2023, 02:46:00
Suggested Topics
40154343
started 🐞 fixed Javascript error?
Bug reports
Brodie@72ad47d0
started Themes like an older fashioned forum
Open Bar
Simon
started 🇫🇷 Grosse optimisation de Flatboard
Feature Requests
Manuel@fbac1efa
started just a test
International Discussions