dmf / bootstrapcontent
TYPO3 Neos plugin for adding Bootstrap3 content and page options.
Installs: 8
Dependents: 0
Suggesters: 0
Security: 0
Stars: 2
Watchers: 2
Forks: 1
Open Issues: 1
Language:CSS
Type:typo3-flow-package
pkg:composer/dmf/bootstrapcontent
Requires
- typo3/flow: *
- typo3/neos: 1.0.*
- typo3/neos-nodetypes: 1.0.*
This package is not auto-updated.
Last update: 2025-10-21 08:14:41 UTC
README
Adds some Twitter Bootstrap 3 functionality to Neos content elements
Installation
Clone this repository into your application folder:
* cd ROOT/Packages/Application
* git clone https://github.com/dohomi/Neos-Plugin-DMF.BootstrapContent.git DMF.BootstrapContent
Then check if the plugin needs to get activated inside of your package management. Check if the plugin is listed:
./flow package:list
./flow package:activate dmf/bootstrapcontent
Use of Bootstrap menu and breadcrumb in your site package
You can use the bootstrap specific menu and breadcrumb inside of your Root.ts2 with following sample code:
page = Page {
    (...)
    body {
    (...)
        parts {
            (...)
            menu = Menu {
                templatePath = 'resource://DMF.BootstrapContent/Private/Templates/TypoScriptObjects/MainMenu.html'
                websiteName = 'Your website Name'
                entryLevel = 1
                maximumLevels = 4
            }
            breadcrumb =  TypoScript:Template {
                templatePath = 'resource://DMF.BootstrapContent/Private/Templates/TypoScriptObjects/Breadcrumb.html'
                items = ${q(node).add(q(node).parents())}
            }
        }
    }
}
Include JS and CSS from the package
The JavaScript and CSS is available inside of the Resources/Public/assets/* folder. You can add the JS source like this:
<script src="{f:uri.resource(path: 'assets/jquery/jquery.min.js', package: 'DMF.BootstrapContent')}"></script>
<script src="{f:uri.resource(path: 'assets/bootstrap/dist/js/bootstrap.js', package: 'DMF.BootstrapContent')}"></script>
For the inclusion of CSS I recommend the use of Grunt as a task planer and build the CSS with processing the LESS files. They are available inside of Resources/Public/assets/bootstrap/less/*