How to use commercial themes with meteor.js

I am a newbie trying to create a meteorite app and I have been looking for a little while using a commercial theme. Let's take this as an example:

http://themeforest.net/item/metronic-responsive-admin-dashboard-template/4021469?WT.ac=category_item&WT.seg_1=category_item&WT.z_author=keenthemes

I have two options:

1) Use html to create meteor templates using spatial symbol tags etc. But how would you implement javascript themes? isn't that contradicted by the meteor?

2) Use angular.js as the theme is provided in angular.js format other than plain html. But wouldn't that create conflicts? is this the best approach?

In general, what is the easiest and best way to use commercial themes with meteor?

+3


source to share


1 answer


I bought similar themes on wrapbootstrap. I think this is the same problem. (for Angular theme I don't know as it would be more difficult I think to integrate with upload)

Typically, with themes like this, you have a lot of 3rd part JS libraries. You must get them. The first option, you will find similar packages in the atmosphere and you can add it. (Many jQuery libraries are simply wrapped in packages).

Second option, there is no such package (you can make and add it and it will help the community :)). You can import them to the desired page using the wait-on-lib package

You can import libraries where you need them. But I think the first option is cleaner.

And you will probably have several custom.js for every other page you have in your template, you have to carry that logic over when rendering the template. For example, custom.js for the index file in your template will be converted to:

Template name index where you can put HTML and

Template.index.rendered = function(){
/* your custom js */
}

      

For CSS, you can just copy the files from the client / css file (for example), the files will be loaded.



I don't know if I was very clear, but I managed to integrate such topics into the meteor project. And don't forget to remove unneeded files, for example, when you add bootstrap package, you can remove bootstrap css and js files integrated into your template.

PS: You may have to search / replace path in css and js files from templates to load some images, eg. Put all such files (like images) in the shared folder where you want, but don't forget to rewrite the path in your css and js files. For example, if you have a template where they have a folder:

folder_css
folder_image
...

      

the path is written as follows:

/* css files */
background-image: url(../folder_image/myimage.png);

      

But in the meteor project, all files in the shared folder are in the root of the project, so you can rewrite your path like something like this:

/* css files */
background-image: url(img/myimage.png);

      

Rewrite the path in the JS files and I think it should work.

+6


source







All Articles