Should be linking to http://labs.tonik.pl/theme/

By default, there is no "Template" drop-down in the Page Attributes section when editing a page in the admin.

If I wanted to create a new template, let's say Homepage Template, what's the proper way to do that in Tonik?

I can create my template in the root of the theme that contains:

<?php
    /* Template Name: Homepage */
?>

but I feel like that's going against the whole templating system that Tonik uses. Is there another approach that I should be thinking about?

Thanks.

When using an IDE like PHPStorm it gets confusing having two "header.tpl.php" files.

Suggestion would be to change the 'partials/header.tpl.php" to something like 'post-header.tpl.php"

Thanks!

As now I'm not completely sure where to put Customizer Objects. Maybe it's a good idea to include a boilerplate for this as well? Like a app/structure/customization.php?

From the cli it would be nice to be able to create a theme.zip that can be distributed to clients or hosting of choice.

something like vendor/bin/tonik make:zip that runs npm run prod and then zips all theme file to a ready to share zip file.

Along with stylelint we should also lint javascript with eslint.

https://eslint.org/

Use .tpl.php suffix to distinguish template files from controller files.

For some reason the Chrome devtools Workspaces/Persistence is not working with this theme. It automaps all the files in the public folder but none of the assets in the resources folder.

I realize this issue may not be related to the theme, but this works with all the other projects I work on so I'm wondering if anybody has any experience with this or ideas to fix.

Any plans to implement something like this on the framework?

https://codeburst.io/progressive-web-app-with-webpack-198b073f6c74 it will be a nice enhancement

Is there a possibility to use Yarn over NPM in a future iteration? Yarn is exceptionally fast to load dependencies.

Based on #21 (comment) reported by @mambax7

Theme main namespace needs to be changed to Tonik\Theme (there is still an easy way to change it with CLI).

Top level template controllers need to receive their own namespaces so internal functions will be encapsulated and easy to reference.

<?php

// @ index.php
namespace Tonik\Theme\Index;

I created a folder called svg inside of my images folder, but when webpack compiles it into the public folder, all of the images get flattened into that one images folder.

Is there something we can add to the webpack output object:

image: { filename: 'images/[name].[ext]' },

to be able to preserve those subdirectories?

Thanks!

Is there any reason to not be following the WPCS? At least the PHP ones?

Honest question. Not trying to buy any flame war or something like that 😃

If you decide to adopt them, I could help because I'm very keen to adopt your framework on a future project and I could do this in between.

How can i register/enqueue scripts from a CDN?

When i try this below, i get:
"
Fatal error: Allowed memory size of 134217728 bytes exhausted (tried to allocate 262144 bytes) in ../wp-includes/class.wp-dependencies.php on line 344

Fatal error: Allowed memory size of 134217728 bytes exhausted (tried to allocate 262144 bytes) in Unknown on line 0"

wp_register_script( 'scrollbar', 'https://cdn.jsdelivr.net/jquery.mcustomscrollbar/3.0.6/jquery.mCustomScrollbar.concat.min.js', null, null, true );
wp_enqueue_script('scrollbar');

Hello,

I followed the doc to install theme, i have the WP-CLI installed too but when i try to activate theme with = wp theme activate my_theme i got following error

"Error: Error establishing a database connection. This either means that the username and password information in your wp-config.php file is incorrect or we can’t contact the database server at localhost. This could mean your host’s database server is down."

My server is not down, i go to the wordpress backend, trying to activate manually theme and i got following error also :

( ! ) Parse error: syntax error, unexpected '}', expecting \\ (T_NS_SEPARATOR) in /app/public/wp-content/themes/starter-theme/src/helpers.php on line 3

Someone can help me?

Thanks

I use windows OS and after install theme, i found a problem with DIRECTORY_SEPARATOR constants, when theme use asset_path function, it output the url with no separator.

Line 70, ASSETS.php:
$uri . DIRECTORY_SEPARATOR . $this->getRelativePath();

http://prntscr.com/hugboe

This will include to create new class in tonik/gin package.

I am using this theme to develop a large web-app and love it so far. As i get further and further along I realize that there are many things going on in the background that change how WP functions (theme init, the loading of the template files etc).

Is there any concern that future WP updates/functionality might break if the project stops being maintained?

Thanks

I am new to webpack and i'm trying to figure out to to concat/combine JS files. I see a few plugins that can be used but I cant figure out how to fit it into the Tonik workflow. Any guidance would be appreciated!

Support for modules are planned for 6.4 release: foundation/foundation-sites#7386

Docblocks of actions and filters in .tpl.php files should help find proper function hooked to this hooks. We should borrow a solution from WooCommerce where each do_action receive docblock with a list of @hooked property and function name.

/**
 * Functions hooked into `theme/index/header` action.
 *
 * @hooked Theme\Index\render_header - 10
 */
 do_action('theme/index/header');

Docblocks on functions should point to the template file with action where they are hooked.

/**
 * Renders header.
 *
 * @see resources/templates/index.tpl.php
 */
function render_header()
{
    //
}
add_action('theme/index/header', 'Theme\Index\render_header');
``

When i run prod/production i get:

ERROR in js/app.js from UglifyJs
Unexpected token: name (Pilot) [js/app.js:111,8]

It looks like there are some solutions here, i havent tried any yet.
joeeames/WebpackFundamentalsCourse#3

Any advice?

Hello! I was having difficulties installing Redux Framework inside wordpress plugins directory and keep tonik/gin inside vendor, so I made some minor changes to achieve this, which I'm Pull Requesting right now...
#56
tonik/gin#7

I'm just looking at some ways to speed up the deployments, and I noticed in the docs and in the travis.yml file you are running both:

npm run development
npm run production

Is there a reason you need to run both? If you wanted to deploy to a production / staging environment it should be fine to just run npm run production correct?

Thanks!

Add paths for files to watch to default config of browsersync:

https://browsersync.io/docs/options/#option-files

"files": [
    "*.php",
    "app/**/*.php",
    "resources/templates/**/*.php",
    "resources/assets/fonts/**/*",
    "resources/assets/js/**/*.js",
    "resources/assets/sass/**/*.scss",
    "resources/assets/images/**/*.{jpg,jpeg,png,gif,svg}"
]

Just feel that having that documented will make it more user friendly.

Images and fonts have to be stored in resources folder and built to the public folder.

That way we can gitignore entire public folder.

settings.styleLint should accept object which should be passed to the webpack StyleLintPlugin initiation.

https://github.com/JaKXz/stylelint-webpack-plugin

Add wp_default_scripts action in src/Http/assets.php which moves jquery lib to the footer.

// Moves jQuery to the footer on frontend.
add_action('wp_default_scripts', function ($wp_scripts) {
    if ( ! is_admin()) {
        $wp_scripts->add_data('jquery', 'group', 1);
        $wp_scripts->add_data('jquery-core', 'group', 1);
        $wp_scripts->add_data('jquery-migrate', 'group', 1);
    }
});

How can i fix this?

We plan to remove current front-end stack on Foundation, so the starter will ship without any by default.

A developer will have the ability to spin different boilerplates on starter initializing with our CLI. This gives us the option to introduce various boilerplates (foundation, bootstrap, bulma etc.) and still give space for those who don't want any.

I am using https://github.com/jjgrainger/wp-custom-post-type-class . It works in every way except for the "has_archive" option is ignored. I found a similar issue in their repo that i think may be the problem (linked below). Is there any way i can use this class in this theme?

"I suspect the problem is that I initialize a theme using an init class,
hooked to after_theme_setup. Putting the class inside a class was probably
creating unpredictable results."

"new CPT() should not be included in a hook, it sets up the hooks in __construct, so if you are using CPT in a hook then it's probably not working at all and being loaded too late."

jjgrainger/wp-custom-post-type-class#26

Import bootstrap scripts as module and compile separately with webpack.

// ./resources/assets/js/bootstrap.js
import Bootstrap from 'bootstrap-sass';

// ./gulpfile.js
mix.webpack('bootstrap.js')

Prepare resources/assets/js/theme.js boilerplate file and compile with webpack too.

// gulpfile.js
mix.webpack('theme.js')

Enqueue new files in src/Http/assets.php by default.

wp_enqueue_script('bootstrap', asset_path('js/bootstrap.js'), ['jquery'], null, true);
wp_enqueue_script('theme-scripts', asset_path('js/theme.js'), ['bootstrap'], null, true);

On theme bootstrapping, new Config instance is bonded twice when located config file was found (https://github.com/tonik/theme/blob/master/bootstrap/theme.php#L28-L36).
$config variable need to be overwritten with merged one when this happens.

$config = require __DIR__ . '/../config/theme.php';

if ($locatedConfig = locate_template('config/theme.php', false, false)) {
    $config = array_merge_recursive($config, require $locatedConfig);
}

$theme->bind('config', new Tonik\Gin\Foundation\Config($config));

Hi there

I'm having an issue with Tonic. I'm following this tutorial : http://labs.tonik.pl/theme/docs/installation/

Everything runs smooth, but when I try to activate the theme, it become HTTP error 500, and I cannot open wp-admin. So I have to delete tonic theme folder.

I'm trying to increase PHP memory limit, but still no luck. I'm using MAMP by the way, with PHP 7.1.6.

Any help would be greatly appreciated

Thanks!

[UPDATE]

After activate WP_DEBUG and WP_DEBUG_LOG, I get this error instead :

Parse error: syntax error, unexpected '}', expecting \\ (T_NS_SEPARATOR) in /Applications/MAMP/htdocs/web/wordpress/wp-content/themes/tonictheme/src/helpers.php on line 3

Templates rendering specific functions and actions should be moved from app\Setup\actions.php to dedicated app\Structure\templates.php.

This will prevent from mixing standard actions with these templates specific.

I'm trying to import the fonts from app.scss @import "~material-design-icons/iconfont/material-icons";

but getting the error that no font files found:
ERROR in ./~/css-loader?{"sourceMap":true}!./~/postcss-loader?{"sourceMap":true}!./~/sass-loader/lib/loader.js?{"sourceMap":true}!./resources/assets/sass/app.scss Module not found: Error: Can't resolve './MaterialIcons-Regular.eot' in 'c:\OpenServer\domains\project.dev\web\app\themes\tonik\resources\assets\sass'
and so for the every file.

May I ask for a help, what is the correct way of importing fonts?

Hi @jedrzejchalubek

My wordpress skill maybe not well, but i like this starter theme and i want contribute that.
I have idea. If you accept, i will do it.

Create new folder:

• Services: This folder contain all class service.

Example:
PostService.php -> this class management post
NotificationService.php -> this class management push notification to mobile, slack,...
ApiService.php -> this class for build rest api
...

• Providers: This folder contain all class will register, init services.

Example:
PostServiceProvide.php -> we are init PostService here
ApiServiceProvide.php -> we are init ApiService here
...

And we register all ServiceProvide in theme.php
example:

$theme->register(App\Providers\PostServiceProvide::class);
$theme->register(App\Providers\ApiServiceProvide::class);

And package tonik/gin we will refactor binding, resolved method with class not a function.
In the feature we can using for Dependency Injection

Sorry my english not well :(

Move files like header.php, footer.php, 404.php etc. to separate /controllers folder.

Use roots/sage trick to tell WordPress where to find these files
https://github.com/roots/sage/blob/9.0.0-alpha.4/functions.php#L14-L37

• app.scss should include variables.scss and bootstrap.scss.
• bootstrap.scss file needs to include Bootstrap's components directly form node_modules/ folder

Mac OS X Sierra, running Local by Flywheel as the local dev environment.

npm run watch opens a browser tab at localhost:3000 but never loads.

Can access localhost:3001 to reach browsersync ui

Can also access tonik.dev directly just fine.

Thoughts on how to debug browsersync issue?