buepro / typo3-user-pizpalue
TYPO3 Custom template being used with template pizpalue.
Installs: 45
Dependents: 0
Suggesters: 0
Security: 0
Stars: 0
Watchers: 0
Forks: 1
Open Issues: 0
Type:typo3-cms-extension
Requires
- typo3/cms-core: >=10.4
Requires (Dev)
- friendsofphp/php-cs-fixer: ^2.16.3
Replaces
- buepro/typo3-user-pizpalue: dev-master
This package is auto-updated.
Last update: 2021-02-26 13:29:03 UTC
README
This extension serves as a base to customize a TYPO3-website using the template pizpalue.
Composer
To use the extension in a composer environment different approaches are available. Following two ways are further outlined:
Without version control
- Don't add
buepro/typor-user-pizpalue
as a requirement to the composer configuration - Copy the extension manually to the extension directory (
typo3conf/ext/user_pizpalue
) - Add the following autoload declaration to the composer configuration from the web site:
"autoload": { "psr-4": { "Buepro\\UserPizpalue\\": "public/typo3conf/ext/user_pizpalue/Classes/" } }
- Run
composer dumpautoload
to generate the autoload info
With version control
- Add your repository to the composer configuration from the web site:
"repositories": [ { "type": "vcs", "url": "https://user@domain.ch/path_to_git/typo3-user-pizpalue.git" } ],
- Update the require section from the composer configuration from the web site:
"require": { "buepro/typo3-user-pizpalue": "dev-mybranch", }
- Run
composer update
Usage
When starting a new project create a new git-branch and just commit to that branch. The master branch should always be used to start new projects.
To increase quality work progress might be committed and documented. Documentation has its home in the folder
Documentation
. A changelog can be created with the following steps:
- In a shell go to the
Build
directory - Run
npm install
(only needed, if not already done) - Run
grunt doc
Customizations
TypoScript (TS)
Customizations typically start by adapting the ts constants and
ts setup. Frequently used configurations are collected in the
folder Configuration/TypoScript/Default
. You might use them to get started by
copying the needed fragments to
Configuration/TypoScript/constants.typoscript
or
Configuration/TypoScript/setup.typoscript
. The inclusion from the default
TS (see @import...
) might be deleted.
CSS/SCSS
Style declarations are maintained in the folder Resources/Public/Scss
. For stylesheets to be
embedded TS needs to be setup. See page.includeCSS
for further details.
Icon font
It might become handy to create a customized icon font. Ideally it contains all used icons from the website. To generate an icon font the icons need to be available in svg-format. Unfortunately not all svg-formats lead to the desired result hence some testing might be needed. An icon font might be created by following these steps:
- Copy all svg-icons to the folder
Resources/Public/Icons/Font
- In a shell go to the
Build
directory - Run
npm install
(only needed, if not already done) - Run
grunt iconfont
Upon creating the icon font its resources can be found in Resources/Public/Fonts
. Next the font needs to be embedded
with the following TS setup:
page {
includeCSSLibs {
pizpalueicon >
upicon = EXT:user_pizpalue/Resources/Public/Fonts/upicon.min.css
upicon {
fontLoader {
families {
0 = UpIcon
}
enabled = 1
}
}
}
}
Now your ready to use the icon font in the markup: <i class="upicon upicon-custom1"></i>
would render an icon showing
the graphic defined by custom1.svg
.
Layouts/Templates/Partials
They are maintained in Resources/Private
. As an example to add a new page template follow these
steps:
- Create the template in the directory
Resources/Private/Templates/Page
- Enable the template in the TS constant declaration
user_pizpalue {
page.fluidtemplate {
templateRootPath = EXT:user_pizpalue/Resources/Private/Templates/Page/
}
}
Development
For smaller projects the following workflow might be of interest:
Setup development environment
- Adjust the header comment in
.php_cs.php
- Create a ddev container:
ddev start
- Enter the container:
docker exec -it -u root -w /var/www/html ddev-up-web bash
- Set environment variable:
export COMPOSER=composer-dev.json && printenv | grep COMPOSER=
- Install composer packages:
composer install
Work in development environment
- Optional, check the code:
composer check:php
- Correct the code:
composer fix:php
Remove development environment
- Uninstall composer packages:
composer uninstall
- Unset the environment variable:
unset COMPOSER | grep COMPOSER=
- Leave the container:
exit
- Stop the container:
ddev stop
Available linters
- TyposScript:
composer lint:ts
- Yml and yaml:
composer lint:yaml
- Json:
composer lint:json
Coding guidelines
- Use the coding guidelines defined by TYPO3 .
- Use up, Up, up-, upc- as package related prefixes
Frequently used
For coding
- TypoScript reference
- Fluid guide
- Fluid view helper reference
- VHS view helper reference
- TCA reference
- TSconfig reference
- Core API reference
- Best practice example extension
For documentation