Theme without boostrap

User avatar
c0mp0ser
Posts: 67
Joined: Mon Jan 02, 2017 11:59 am

Re: Theme without boostrap

Post by c0mp0ser »

Hello, I am trying to make a new theme for Wonder CMS (3.3.1), using Materialize CSS framework. I am in the prototype phase for now. Unfortunately after enabling this theme a white page appears. I don't know what I am doing wrong. Can someone take a look at the code?

Code: Select all

<?php global $Wcms ?>

<!DOCTYPE html>
<html lang="en">
    <head>
        <!-- Encoding, browser compatibility, viewport -->
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <!-- Search Engine Optimization (SEO) -->
        <meta name="title" content="<?= $Wcms->get('config', 'siteTitle') ?> - <?= $Wcms->page('title') ?>" />
        <meta name="apple-mobile-web-app-title" content="<?= $Wcms->get('config', 'siteTitle') ?>">
        <meta name="description" content="<?= $Wcms->page('description') ?>">
        <meta name="keywords" content="<?= $Wcms->page('keywords') ?>">
        <meta property="og:url" content="<?= $this->url() ?>" />
        <meta property="og:type" content="website" />
        <meta property="og:site_name" content="<?= $Wcms->get('config', 'siteTitle') ?>" />
        <meta property="og:title" content="<?= $Wcms->page('title') ?>" />
        <meta name="twitter:site" content="<?= $this->url() ?>" />
        <meta name="twitter:title" content="<?= $Wcms->get('config', 'siteTitle') ?> - <?= $Wcms->page('title') ?>" />
        <meta name="twitter:description" content="<?= $Wcms->page('description') ?>" />
        <!-- Admin CSS -->
        <?= $Wcms->css() ?>

        <!-- Website and page title -->
        <title><?= $Wcms->get('config', 'siteTitle') ?> - <?= $Wcms->page('title') ?></title>

        <!-- Theme CSS -->
        <link rel="stylesheet" href="<?=$Wcms->asset('css/materialize.css') ?>">
        <link rel="stylesheet" href="<?=$Wcms->asset('css/style.css')?>">

    </head>

    <body>
        <!-- Admin settings panel and alerts -->
        <?= $Wcms->settings() ?>
        <?= $Wcms->alerts() ?>

        <nav>
            <div class="nav-wrapper">
                <a href="<?=wCMS->url() ?>" class="logo center"><?= $Wcms->get('config', 'siteTitle') ?></a>
            </div>
        </nav>

        <ul class="sidenav right" id="navigation">
            <?= $Wcms->menu() ?>
        </ul>

        <div class="container" id="content">
            <a href="#!" data-target="navigation" class="sidenav-trigger  menu-trigger"><img src="<?= $Wcms->asset('icons/menu-icon.png') ?>"></a>
            <div class="section">
                <div class="row">
                    <?= $Wcms->page('content') ?>
                </div>
            </div>
        </div>

        <footer class="page-footer">
            <div class="container">
                <div class="row">
                    <div class="col s12 l6">
                        <?= $Wcms->block('subside') ?>
                    </div>
                    <div class="col s12 l6">
                        <h5>Menu</h5><!-- Tytuł -->
                        <ul class="col s12 l6 footer-menu">
                            <?= $Wcms->menu() ?>                          
                        </ul>
                    </div>
                </div>
            </div>
            <div class="footer-copyright">
                <div class="container">
                    <?= $Wcms->footer() ?>
                </div>
            </div>
        </footer>

        <!-- Javascript -->
        <!-- Admin JavaScript. More JS libraries can be added below -->
        <?= $Wcms->js() ?>
        <script src="<?= $Wcms->asset('js/jquery.min.js') ?>"></script>
        <script src="<?= $Wcms->asset('js/materialize.min.js') ?>"></script>
        <script>
            $(document).ready(function(){
                $('.sidenav').sidenav({edge: 'right'});
            });
        </script>

        <!-- Javascript - koniec -->
    </body>
</html>
It's just me, an unmeasurable particle of the cosmos ...
https://pawelkruzel.m00n.link
https://m00n.link
https://materialize-wcms.m00n.link

User avatar
wiz
Admin
Posts: 749
Joined: Sat Oct 30, 2010 12:23 am

Re: Theme without boostrap

Post by wiz »

Hello c0mp0ser.

This line has two mistakes:

Code: Select all

<a href="<?=wCMS->url() ?>" class="logo center">

Code: Select all

<?=wCMS->url() ?>
should be

Code: Select all

<?= $Wcms->url() ?>
(missing $ and wrong capitalization)


Did you copy this in from of the WonderCMS docs? In that case I'd love to see it fixed asap, so other people don't run into the same issue.

User avatar
c0mp0ser
Posts: 67
Joined: Mon Jan 02, 2017 11:59 am

Re: Theme without boostrap

Post by c0mp0ser »

Unfortunatelly, I don't remember where I copy this from. Thanks for reviewing my code. I'll let you know if it helps or if not. ;)
It's just me, an unmeasurable particle of the cosmos ...
https://pawelkruzel.m00n.link
https://m00n.link
https://materialize-wcms.m00n.link

User avatar
wiz
Admin
Posts: 749
Joined: Sat Oct 30, 2010 12:23 am

Re: Theme without boostrap

Post by wiz »

Most welcome - I tested it and it should definitely solve your issue.

I rechecked docs and it's already correct :)

User avatar
c0mp0ser
Posts: 67
Joined: Mon Jan 02, 2017 11:59 am

Re: Theme without boostrap

Post by c0mp0ser »

wiz wrote:
Sun Apr 17, 2022 3:07 pm
Most welcome - I tested it and it should definitely solve your issue.

I rechecked docs and it's already correct :)
OK. It seems working now (!). But as I can see, another problems occurs.
1. Summernote plugin is not showing on my theme. Maybe it might be worth reworking the plugin so that it works with themes without Bootstrap...? I can't do that.
It's just me, an unmeasurable particle of the cosmos ...
https://pawelkruzel.m00n.link
https://m00n.link
https://materialize-wcms.m00n.link

OneManLaptop
Developer
Posts: 68
Joined: Tue Mar 16, 2021 3:29 pm

Re: Theme without boostrap

Post by OneManLaptop »

c0mp0ser wrote:
Sun Apr 17, 2022 3:26 pm
1. Summernote plugin is not showing on my theme. Maybe it might be worth reworking the plugin so that it works with themes without Bootstrap...? I can't do that.
The thing is, I researched this myself and Summernote (https://summernote.org) was actually developed specifically to be a Bootstrap based editor. Work on the plugin has slowed down a lot and from what I can tell the team has been whittled down to one or two people looking to take the project forward. You can read about their future plans here:

https://github.com/summernote/summernote/issues/4159

Whilst there does appear to be some activity, I'm personally worried about the longterm viability of the project and what that will mean for Wonder CMS. Are there even any viable alternatives in active development? I think I shared one possibility in my mega thread but I haven't researched it further.

All that said, the core functionality works... the WCMS team are clearly comfortable working with it and it has the possibility to be extended with custom plugins if needed but a huge part of WCMS is dependent on Summernote and I fear being anchored to it might not be viable long term.

User avatar
c0mp0ser
Posts: 67
Joined: Mon Jan 02, 2017 11:59 am

Re: Theme without boostrap

Post by c0mp0ser »

OneManLaptop wrote:
Tue Apr 19, 2022 7:33 am
c0mp0ser wrote:
Sun Apr 17, 2022 3:26 pm
1. Summernote plugin is not showing on my theme. Maybe it might be worth reworking the plugin so that it works with themes without Bootstrap...? I can't do that.
Whilst there does appear to be some activity, I'm personally worried about the longterm viability of the project and what that will mean for Wonder CMS.

All that said, the core functionality works... the WCMS team are clearly comfortable working with it and it has the possibility to be extended with custom plugins if needed but a huge part of WCMS is dependent on Summernote and I fear being anchored to it might not be viable long term.
There are many plugins for Summernote. And they work with Lite version of this editor. It's a significant advantage. Summernote's Lite version is framework agnostic. So, i have no idea why some WCMS plugins still uses Bootstrap. It's a barrier which harming entire WCMS development. It's confused a little. ;) I don't know if Summernote itself development will be maintained, but imo it's not important at this moment.
It's just me, an unmeasurable particle of the cosmos ...
https://pawelkruzel.m00n.link
https://m00n.link
https://materialize-wcms.m00n.link

User avatar
c0mp0ser
Posts: 67
Joined: Mon Jan 02, 2017 11:59 am

Re: Theme without boostrap

Post by c0mp0ser »

c0mp0ser wrote:
Sun Apr 17, 2022 3:26 pm
1. Summernote plugin is not showing on my theme.
It's out of date now. But when I look at how many scripts and stylesheets are loaded while the editor/cms is running, I'm shocked. :o It seems to me that even though it all works, it all needs a lot of optimization. I'll leave that for your consideration.
It's just me, an unmeasurable particle of the cosmos ...
https://pawelkruzel.m00n.link
https://m00n.link
https://materialize-wcms.m00n.link

Goodwill
Posts: 1
Joined: Thu Apr 21, 2022 9:35 am

Re: Theme without boostrap

Post by Goodwill »

The good news is, that the first part of Wonder CMS, completely detached from the Bootstrap library, ended with many improvements such as easy editing, animations, and UX enhancements.

User avatar
wiz
Admin
Posts: 749
Joined: Sat Oct 30, 2010 12:23 am

Re: Theme without boostrap

Post by wiz »

OK. It seems working now (!). But as I can see, another problems occurs.
1. Summernote plugin is not showing on my theme. Maybe it might be worth reworking the plugin so that it works with themes without Bootstrap...? I can't do that.
Could you post your whole theme somewhere so we can test it out?
A theme without bootstrap should still work with Summernote, as the Summernote plugin already includes the necessary Bootstrap libaries.
But when I look at how many scripts and stylesheets are loaded while the editor/cms is running, I'm shocked. So, i have no idea why some WCMS plugins still uses Bootstrap.
Please understand that WonderCMS is completely free, open source and we also depend on user contributions. Most of the main contributors help out as a hobby while having regular jobs, families, so it's not easy to take dedicated time for all user requests - the internal team main focus is to keep the core of WonderCMS clean, secure and up to date and not shoot focus on user based themes and plugins.

The amount of libraries that are included only happens for logged in users and doesn't affect the performance of your website. If you feel like experimenting with any of the other ones, you can also post progress and hopefully you'd also get some help from the community, as you know it might take some effort.

Whilst there does appear to be some activity, I'm personally worried about the longterm viability of the project and what that will mean for Wonder CMS. Are there even any viable alternatives in active development? I think I shared one possibility in my mega thread but I haven't researched it further.
The Summernote that is packed in the plugins repo should continue working even if they drop support. However there is an alternative (the monaco editor), albeit not that user friendly as Summernote. All in all, I agree and I would also love to see the community (possibly in the future) create additional editors (or implement ones) that would create value for users.

Post Reply