https://github.com/alexstack/silverstripe-custom-bootstrap4-theme
The bootstrap 4 basic theme for SilverStripe - Bootstrap 4.x CSS, Font Awesome 5.x, JQuery 3.x are included in the Page.ss - Bootstrap Navbar for menu link included - Mobile page friendly - Very easy to custom
https://github.com/alexstack/silverstripe-custom-bootstrap4-theme
Last synced: 10 months ago
JSON representation
The bootstrap 4 basic theme for SilverStripe - Bootstrap 4.x CSS, Font Awesome 5.x, JQuery 3.x are included in the Page.ss - Bootstrap Navbar for menu link included - Mobile page friendly - Very easy to custom
- Host: GitHub
- URL: https://github.com/alexstack/silverstripe-custom-bootstrap4-theme
- Owner: AlexStack
- License: bsd-3-clause
- Created: 2019-07-11T22:07:30.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2019-07-17T23:10:40.000Z (over 6 years ago)
- Last Synced: 2025-01-10T08:24:15.380Z (12 months ago)
- Language: Scheme
- Size: 277 KB
- Stars: 2
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Code of conduct: code-of-conduct.md
Awesome Lists containing this project
README
# The bootstrap 4 basic theme for SilverStripe
- Bootstrap 4.x CSS, Font Awesome 5.x, JQuery 3.x are included in the Page.ss
- Bootstrap Navbar for menu link included
- Mobile page friendly
- Very easy to custom manually or with the [SilverStripe-All-in-One package](https://github.com/AlexStack/silverstripe-all-in-one#readme)
# How to install the theme
```bash
composer require alexstack/silverstripe-custom-bootstrap4-theme
```
# Mobile demo page
# Desktop demo page
# Start a website from scratch? Try our SilverStripe All-in-one manager package
- It will allow you change themes in the settings from the admin without touch the themes.yml file
- Easy to custom page top logo, copyright content at the bottom of every page, page content above nav bar, set different custom css file
- [Click here to see the details of this SilverStripe-All-in-One package](https://github.com/AlexStack/silverstripe-all-in-one#readme)
# How to enable the theme in SilverStripe 4.x
Edit your `app/_config/theme.yml` change the 'old-theme' to 'silverstripe-custom-bootstrap4-theme':
```yaml
SilverStripe\View\SSViewer:
themes:
- 'silverstripe-custom-bootstrap4-theme'
- '$default'
```
# Can I custom all the .ss template file?
- Yes, you have 100% control of all the files
- After install, all the .ss template files will be installed at your-ss-project/themes/silverstripe-custom-bootstrap4-theme
- And css/javascript files will copy to your-ss-project/public/_resources/themes/silverstripe-custom-bootstrap4-theme
- You can ignore the css/javascript files in your-ss-project/themes/silverstripe-custom-bootstrap4-theme
# How to set a footer for every page
- First it will display the PageFooter in SiteConfig(settings)
- Then it will display the content of the URL Segment is "PageFooter" of a page
- 
- Do not forget to set this page NOT Show in menus
- Silverstripe template Includes/PageFooter.ss codes are below:
```php
<% if $SiteConfig.PageFooter %>
$SiteConfig.PageFooter
<% else %>
<% with $Page("PageFooter") %>
$Content
<% end_with %>
<% end_if %>
```
# How to set a page top(above navbar) for every page
- First it will display the PageTop in SiteConfig(settings)
- Then it will display the content of the URL Segment is "PageTop" of a page
- 
- Do not forget to set this page NOT Show in menus
- Silverstripe template Includes/PageTop.ss codes are below:
```php
<% if $SiteConfig.PageTop %>
$SiteConfig.PageTop
<% else %>
<% with $Page("PageTop") %>
$Content
<% end_with %>
<% end_if %>
```
# How to set up the navbar menu
- It will loop $Menu(1) and display links and sub-child links
- Document is here: https://getbootstrap.com/docs/4.1/components/navbar/
- Silverstripe template Includes/Header.ss codes are below:
```php
<% loop $Menu(1) %>
<% if $Children %>
$MenuTitle.XML
(current)
<% if $Children %>
<% end_if %>
<% else %>
$MenuTitle.XML
<% end_if %>
<% end_loop %>
```
# How to set up the logo for every page (top right)
- It will display the TopLogo in SiteConfig(settings)
- Silverstripe template Includes/Header.ss codes are below:
```php
<% if $SiteConfig.TopLogo %>
<% else %>
<% end_if %>
```
# How to set up the BannerImage for every page (top right)
- It will display the BannerImage in a page
- Silverstripe template Includes/Header.ss codes are below:
```php
<% if $Top.BannerImage %>
<% end_if %>
```
# How to set up a different .css file other than custom.css
- It will display the CustomCssFile in SiteConfig(settings)
- You can easily to change it via [SilverStripe-All-in-One package](https://github.com/AlexStack/silverstripe-all-in-one#readme)
- Silverstripe template Includes/Header.ss codes are below:
```php
<% if $SiteConfig.CustomCssFile != '' %>CustomCssFile
<% require themedCSS($SiteConfig.CustomCssFile) %>
<% else %>
<% require themedCSS('custom') %>
<% end_if %>
```
# How to enable the theme in SilverStripe 3.x
* Download and copy the theme into the `themes/` directory of your SilverStripe project. If you've named it correctly, there should be a directory called `themes/silverstripe-custom-bootstrap4-theme`.
* Add the following to your `mysite/_config.php` file. Remove any existing `SSViewer::set_theme` lines.
SSViewer::set_theme("silverstripe-custom-bootstrap4-theme");
HtmlEditorConfig::get('cms')->setOption('theme_advanced_styles', 'highlight=highlight;no-border=no-border,break=break');
# License
- BSD-3-Clause