Slim

First of all, thank you so much for purchasing Slim!

I've tried to make the documentation as extensive as possible. If you have any questions after reading it, do let me know, if you've ran into some trouble, I've added a quick help guide below.

If you're enjoying Slim, it would mean a lot to me if you left a five-star rating on the Slim download page.

Thanks again for your purchase and have fun!

Package Contents

If you want to alter Slim you can use the included source files. If not, the files ending with .min are the ones you're looking for. The .min indicates this file has been minified, or compressed so to say.

Apart from the slim.min.css file the slim folder contains the following .js files.

Some choices to make it seems but not to worry, it's not as difficult as it looks. All of the above files contain the Slim library but are useful for different projects.

  1. If you don't know which file to pick, you probably need the slim.kickstart.min.js file. This version of Slim will automatically initialise Slim croppers when the website has loaded.

  2. If you plan to use the Slim jQuery API it's best to pick the jQuery file. This version will not load automatically, you'll have to parse the DOM for Slim nodes yourself using the following JavaScript snippet $('body').slimParse();

  3. The other files might be useful if you're an experienced JavaScript Developer.

    • Use the AMD version if you're using something like RequireJS;
    • CommonJS might be handy if you're running Browserify;
    • The Global variant exposes Slim on the window object;
    • The Module version is for use with ES6 projects;
    • Then there's the React, Angular 1.x and Angular 2.x wrappers (the React and Angular 2.x wrappers have slim.module.js as a dependency).

Client Setup

To use Slim you have to upload both slim.css and the .js file you picked above to a folder on your website. For the code snippets below we'll assume it's the slim.kickstart.js version and the folder we are uploading to is named slim.

Copy the following HTML snippet in the <head> of your web page.

<link href="/slim/slim.min.css" rel="stylesheet">

Then copy the following snippet and place it just before the closing </body> tag.

<script src="/slim/slim.kickstart.min.js"></script>

Make sure the paths in the above code snippets match the location of the CSS and JS files.

Information on how to customise Slim or use the APIs can be found on the product website.

Server Setup

The included server files allow you to quickly setup a PHP server that handles the uploaded files.

The slim.php file contains the Slim helper class. You can use this class to quickly get to and save the uploaded files.

The sync.php file contains the same code that's used on the product site to handle classic form POSTs. See the avatar sample on the product site for more details.

The async.php file contains the code used for the AJAX examples on the product site.

Always make sure your server is secure. Allowing users to upload files creates a security risk. A Google query on "php secure file upload" will give you some quick pointers on what to take into account.

Help

Alright, unfortunately you've run into an issue. Don't panic, we're gonna get this fixed!

  1. Take a moment to look over the Slim FAQ page on CodeCanyon. I try to add the most common problems to the FAQ, so the answer might be in there.

  2. If the answer to your question is not in the FAQ and you've carefully read the documentation, contact me via CodeCanyon support, I will be more than happy to help you.

Try to send me as much information as possible, this makes it a lot easier for me to help you resolve the problem. The following information is always useful.