doc: update CDN initialization guide

Author: setaman

README.md

@@ -34,10 +34,10 @@ Install the library via npm:
 ```
 npm i vue-ellipse-progress
 ```
-You can initialize the component globally as a plugin or import it a specific component of your app.
+You can initialize the component globally as a plugin or import it in a specific component of your app.
 
 #### Initialize as Plugin 
-Import and initialize the component in your `main.js`. After initialization, the component is available under `<ve-progress/>`.
+Import and initialize the component in your `main.js`. After initialization, the component is available as `<ve-progress/>`.
 You can also assign a custom name to the component:
 ```js
 import { createApp } from "vue";
@@ -47,21 +47,23 @@ createApp(App).use(veProgress);
 ```
 
 #### Import component
+You also have the option to import the component directly:
 ```js
 import { VeProgress } from 'vue-ellipse-progress';
 ```
 
 ### CDN
-Use this option where you have a global Vue.js instance available. You can customize and get the bundled and minified 
+You can customize and get the bundled and minified 
 component from [JSDelivr](https://www.jsdelivr.com/package/npm/vue-ellipse-progress).
-Just add the following line to your HTML and start using the component, nothing more is required:
-
+Just add the following line to your HTML and initialize the component as plugin:
 ```html
 <script src="https://cdn.jsdelivr.net/npm/vue-ellipse-progress/dist/vue-ellipse-progress.umd.min.js"></script>
+...
+createApp(App).use(veprogress);
 ```
 
 ## Usage
-After you have initialized the component, use it everywhere you want in your application:
+After you have initialized the component, you are ready to create your circles:
 ```html
 <ve-progress 
   :data="circles"                    

package.json

@@ -3,10 +3,10 @@
   "version": "2.0.0-alpha.5",
   "private": false,
   "description": "A Vue.js component to create beautiful animated circular progress bars",
-  "main": "./dist/ve-progress.umd.min.js",
+  "main": "./dist/veprogress.umd.min.js",
   "scripts": {
     "serve": "vue-cli-service serve",
-    "build": "vue-cli-service build --target lib --formats umd-min --name ve-progress ./src/plugin.js",
+    "build": "vue-cli-service build --target lib --formats umd-min --name veprogress ./src/plugin.js",
     "lint": "vue-cli-service lint --fix",
     "test": "vue-cli-service test:unit --colors",
     "publish-beta": "npm run lint && npm run build && npm publish --tag beta"

src/components/Gradient.vue

@@ -1,7 +1,7 @@
 <template>
   <component
     :is="gradientComponent"
-    :id="`ep-${type}-gradient-${id}`"
+    :id="\`ep-${type}-gradient-${id}`"
     x1="0%"
     y1="100%"
     x2="0%"