Skip to content

digital-steps-creatives/pagekit-1

 
 

Repository files navigation

accessibility text

Pagekit

Symfony Vue UIkit Build Status Discord

Homepage - Official home page.

This is an updated build Pagekit CMS (for developers).

Build includes:

  • Pagekit CMS 1.0.18
  • Blog extension
  • Theme One
  • New Admin Template

Download the latest build or install from source before installation.
The installation procedure is the same as in the official documentation.

Marketplace functionality like install, update and remove works the same like in original version. Note! Before enabling extensions, update them for compatibility. Debug mode and debug panel work the same as in the main version.


Major changes:

Several bugs that are present in the original assembly have been fixed, some styles have been changed for ease of use. The mobile version has remained the same with minor changes.

Install from source

You can install Node dependencies, build the front-end components and run scripts via yarn or NPM.

Clone Repository

$ git clone git@github.com:uatrend/pagekit.git project-folder
$ cd project-folder

Install PHP dependencies

$ composer install

Install Node dependencies

$ yarn install
$ npm install

Scripts

Webpack watch:

$ yarn watch
$ npm run watch

Webpack build (minified):

$ yarn build
$ npm run build

Linting with eslint:

$ yarn lint
$ npm run lint

Gulp tasks

Compile LESS:

$ gulp compile

Compile and watch LESS:

$ gulp watch

CLDR locale data for internationalization:

$ gulp cldr

Admin Theme

Theme is fully compatible with UIkit 3. Changed default admin theme - script, layout and colors. Added side and top menus with dropdowns. For individual markup of each page added class page in the body tag generated via php.

Example, class for dashboard page look like:

<body class=“dashboard”>

Editor Settings

Added the ability to select an editor in the settings: HTML Editor, Tinymce or Codemirror. Moved all editor component dependencies to: app/system/modules/editor/app/assets. Added split mode for Tinymce.

Theme Plugin

(added to core /app/system/app/lib/theme.js)

Ability to programmatically configure the buttons, dropdown lists, pagination and search form in the top menu for each component used (see code).

Example: dashboard - index.js

name: 'dashboard',

mixins: [Theme.Mixins.Helper],

...

theme: {
    hiddenHtmlElements: '#dashboard > div:first-child > div:last-child',
    elements() {
        var vm = this;
        return {
            addwidget: {
                scope: 'topmenu-left',
                type: 'dropdown',
                caption: 'Add Widget',
                class: 'uk-button uk-button-text',
                icon: { attrs: { 'uk-icon': 'triangle-down' }},
                dropdown: { options: () => 'mode: click' },
                items: () => vm.getTypes().map((type) => {
                    let props = {
                        on: {click: () => vm.add(type)},
                        caption: type.label,
                        class: 'uk-dropdown-close'
                    }
                    return {...type, ...props}
                }),
            }
        }
    }
}

Adding side menu items through PHP - $view->$data()

'view.data' => function ($event, $data) use ($app) {
    if (!$app->isAdmin()) {
        return;
    }
    $data->add('Theme', [
        'SidebarItems' => [
            'additem' => [
                'addpost' => [
                    'caption' => 'Add Post',
                    'attrs' => [
                        'href' => $app['url']->get('admin/blog/post/edit')
                    ],
                    'priority' => 1
                ]
            ]
        ]
    ]);
}

Updated extensions:


Thanks to Yootheme and developers!
Feel free to ask any questions - I will answer as much as possible.

About

Pagekit CMS

Resources

License

Stars

Watchers

Forks

Packages

 
 
 

Contributors

Languages

  • PHP 72.5%
  • CSS 14.5%
  • JavaScript 6.9%
  • Vue 5.9%
  • HTML 0.2%