I have been warned about it and I knew I will need it first, well I have finally made up my mind to go with OC3 and first thing I need is to understand creating / customizing theme. I already understand twig / php / css stuff but so far what I can see that there is no clear guide guiding you to make OC3 themes. Everyone wants you copy default theme and then modify it.
Unfortunately default theme still uses Bootstrap 3 while we have BS 5 on way and by no way default theme is lightweight. but yes, it works. I would like to know if there is some kind of hierarchy in theme for OC3 and if yes then why there is no documentation, is it intentional ?
Professional OpenCart extensions, support and custom work.
Contact me via email or Skype by support@thekrotek.com
The theme has little to do with that.this way they are hampering wider adaptation of OC
Anybody who knows twig/css/js needs no guide, anybody who doesn't buys a template/theme.
Crystal Light Centrum Taiwan
Extensions: MailQueue | SUKHR | VBoces
“Data security is paramount at [...], and we are committed to protecting the privacy of anyone who is associated with our [...]. We’ve made a lot of improvements and will continue to make them.”
When you know your life savings are gone.
Dedication and passion goes to those who are able to push and merge a project.
Regards,
Straightlight
Programmer / Opencart Tester
catalog/view/theme/my-theme/template/*/*.twig
catalog/view/theme/my-theme/stylesheet/stylesheet.css
catalog/view/theme/my-theme/image/*.png
catalog/view/javascript/bootstrap4/*
The template folder only needs twig files which are different from the default twig files. If your theme doesn't contain a certain twig template file it will fall back to the default one. You will at least need a modified catalog/view/theme/my-theme/template/common/header.twig for your theme because of e.g. using bootstrap4.
In the admin backend, all you have to do is to keep the store default theme, just change the theme folder to your new my-theme.
Export/Import Tool * SpamBot Buster * Unused Images Manager * Instant Option Price Calculator * Number Option * Google Tag Manager * Survey Plus * OpenTwig
If this solution is really working ... perhaps I could add this in the FAQ for future forum users who might be looking for ways to upgrade their bootstrap versions with new or existing custom themes ...JNeuhoff wrote: ↑Mon Apr 13, 2020 9:05 pmSince you already know twig, css, and php the easiest way to do a new theme is to use the following new folders structure:
catalog/view/theme/my-theme/template/*/*.twig
catalog/view/theme/my-theme/stylesheet/stylesheet.css
catalog/view/theme/my-theme/image/*.png
catalog/view/javascript/bootstrap4/*
The template folder only needs twig files which are different from the default twig files. If your theme doesn't contain a certain twig template file it will fall back to the default one. You will at least need a modified catalog/view/theme/my-theme/template/common/header.twig for your theme because of e.g. using bootstrap4.
In the admin backend, all you have to do is to keep the store default theme, just change the theme folder to your new my-theme.
Dedication and passion goes to those who are able to push and merge a project.
Regards,
Straightlight
Programmer / Opencart Tester
Some web themes are more complex and may require additional settings, in which case you'd also need these files:
admin/controller/extension/theme/my-theme.php
admin/language/*/extension/theme/my-theme.php
admin/view/template/extension/theme/my-theme.php
The theme settings are stored in the OpenCart DB table oc_setting. If you use these additional theme settings, then, in the OpenCart admin backend, you'd have to switch the theme from 'default' to 'my-theme' at System > Settings > edit > tab General > Theme.
Export/Import Tool * SpamBot Buster * Unused Images Manager * Instant Option Price Calculator * Number Option * Google Tag Manager * Survey Plus * OpenTwig
While the OC admin - > extensions - > extensions - > themes(x) page also needs to be configured, the observation above was about Bootstrap implicitly ... not only about adding / troubleshooting the custom themes themselves.JNeuhoff wrote: ↑Mon Apr 13, 2020 11:16 pmYes, it should work, though I haven't tried bootstrap 4 yet. But as regards to the other folders, yes, I have done it several times for different OpenCart sites, and it keeps it pretty much compatible with most 3rd party extensions.
Some web themes are more complex and may require additional settings, in which case you'd also need these files:
admin/controller/extension/theme/my-theme.php
admin/language/*/extension/theme/my-theme.php
admin/view/template/extension/theme/my-theme.php
The theme settings are stored in the OpenCart DB table oc_setting. If you use these additional theme settings, then, in the OpenCart admin backend, you'd have to switch the theme from 'default' to 'my-theme' at System > Settings > edit > tab General > Theme.
Dedication and passion goes to those who are able to push and merge a project.
Regards,
Straightlight
Programmer / Opencart Tester
Thanks for clarifying and sharing your experience about hierarchy in themes. So there is no xml or json kind of file where you store theme related info like name, version or anything which is then used by OC to show info about theme (say in admin panel) ?JNeuhoff wrote: ↑Mon Apr 13, 2020 9:05 pmSince you already know twig, css, and php the easiest way to do a new theme is to use the following new folders structure:
catalog/view/theme/my-theme/template/*/*.twig
catalog/view/theme/my-theme/stylesheet/stylesheet.css
catalog/view/theme/my-theme/image/*.png
catalog/view/javascript/bootstrap4/*
The template folder only needs twig files which are different from the default twig files. If your theme doesn't contain a certain twig template file it will fall back to the default one. You will at least need a modified catalog/view/theme/my-theme/template/common/header.twig for your theme because of e.g. using bootstrap4.
In the admin backend, all you have to do is to keep the store default theme, just change the theme folder to your new my-theme.
BTW, I need to add here that BS3 to BS4 migration will need significant changes , will not just work switching form BS3 to BS4 Css. I hope in upcoming version, OC uses some lighter frontend framework.
Besides, I have edited my first post, wanted to say that default theme with BS3 is not lite (and add with Jquery), have you ever looked into pureCSS (purecss.io) by Yahoo. Its light and its built on approach where you add elements as needed. Although has most of the basic things already included. I will not suggest going to BS4 , rather we should wait for BS5 which is expected to be lighter and Jquery removed.
I understand but if you ever closely follow any popular open source project, then you will find that they have very comprehensive documentations, its one of the reason for the popularity as then developer can save their time by actually working on the part which they need instead of going through lots of code and understanding its flow. Most of them have documentation in WIKI format so that anyone with suggestion can edit it , which can be later reviewed and merged. I don't know system here yet but , for example, phalcon framework, they encourage members to contribute to docs a lot. Comprehensive docs means more future developers which means active project.
Lastly, I would like to add that a guide also helps you to know proper way of doing things in a system, otherwise even for greatest developer, it takes a good time to understand project properly.
My Github OC Site: https://github.com/IP-CAM
5'200 + FREE OC Extensions, on the World's largest private Github OC Repository Archive Site.
Users browsing this forum: No registered users and 7 guests