Build a JavaScript-based mobile web cms--add jquery Plugin

When you see the Qi CMS menu and turn it into a toolbar, it makes sense. Then continue to see how such a CMS sidebar is composed.

Requirejs and jquery plugin examples

A simple combination example is shown below, adding the following in Main.js

Requirejs.config ({"    shim": {        "Jquery-cookie"  : ["jquery"]    }});

Then add it in a different file.

define (["jquery"], function       ($) {           //Add functions});

This allows us to complete the addition of a simple plugin.

Ink qi cms add jquery plugin jquery Sidr

the Best JQuery plugin for creating side menus and the easiest-a-Z for doing your menu responsive

This is the best and simplest tool for creating a responsive sidebar, so we need to download jQuery.sidr.min.js to the directory and then modify the Main.js:

Require.config ({    baseUrl: ' lib/',    paths: {        ' text ': ' Text ',        jquery: ' Jquery-2.1.1.min ',        async: ' Require/async ',        json: ' Require/json ',        mdown: ' Require/mdown ',        router: '. /router ',        templates: '. /templates ',        jquerysidr: ' Jquery.sidr.min ',        markdownconverter: ' Require/markdown.converter '    },    Shim: {        jquerysidr:["jquery"],        underscore: {            exports: ' _ '}}}    ); require ([' ... /app '], function (APP) {    app.initialize ();});

Add Jquery.sidr.min to the inside.

JQuery Sidr and Requirejs collaboration

Reference the official sample code

$ (document). Ready (function () {  $ (' #simple-menu '). Sidr ();});

We need to add the above initialization code to the initialization of the App.js,

define ([    ' jquery ',    ' underscore ',    ' backbone ',    ' router ',    ' JQUERYSIDR '], function ($, _, backbone , Router) {    var initialize = function () {        $ (document). Ready (function () {            $ (' #menu '). Sidr ();        });        Router.initialize ();    };    return {        initialize:initialize    };});

This opens the Ink Qi CMS to see the final effect.

Related Resources

QQ Discussion Group: 344271543

SOURCE Github:https://github.com/gmszone/moqi.mobi

Build a JavaScript-based mobile web cms--add jquery Plugin