{"id":416,"date":"2019-09-03T06:48:38","date_gmt":"2019-09-03T06:48:38","guid":{"rendered":"https:\/\/docs.theironnetwork.org\/vuely\/?page_id=416"},"modified":"2019-09-24T09:15:30","modified_gmt":"2019-09-24T09:15:30","slug":"customization","status":"publish","type":"page","link":"https:\/\/docs.theironnetwork.org\/vuely\/customization\/","title":{"rendered":"Customization"},"content":{"rendered":"\n<h4> How to add a New Page <\/h4>\n\n\n\n<p> To add a new page follow the instructions given below: <\/p>\n\n\n\n<p> 1. Create a file with the extension <code>.vue<\/code> under the <code>vuely-laravel->resources->js->views<\/code> directory. You can also create your file under the <code>your-page-name<\/code> directory. See the given below example we have taken an example of TestPage that we are going to create. <\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">&lt;template&gt;<br>    &lt;div class=\"\"&gt;<br>        &lt;h4&gt;I'm your Test Page&lt;\/h4&gt;<br>    &lt;\/div&gt;<br>&lt;\/template&gt;<\/pre>\n\n\n\n<p> 2. After created file you need to declare its route where it can be serve on the browser, suppose you created page will be serve on the route like <code>http:\/\/localhost:8080\/test-page<\/code> . To access this page define its routes in the <code>vuely-laravel -> resources -> js -> router -> index.js<\/code> file. <\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">import Vue from 'vue'<br>import Router from 'vue-router'<br> <br>\/\/routes<br>...<br>...<br> <br>Vue.use(Router)<br> <br>export default new Router({<br> mode: 'history',<br> routes: [<br> ...,<br> {<br> path: '\/test-page',<br> component: resolve => require(['..\/views\/test-page\/TestPage.vue'], resolve),<br> meta: {<br> title: 'message.testPage',<br> breadcrumb: 'Test Page'<br> }<br> }<br> ]<br>}) <\/pre>\n\n\n\n<p> After defining the route you need to add a new menu in the sidebar or horizontal navigation. To add the menu go to the <code>vuely-laravel->resources->js->store->modules->sidebar<\/code> directory and open data.js file. <\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">\/\/ Sidebar Routers<br>export const menus = {<br> 'message.general': [<br> ...,<br> {<br> action: 'zmdi-view-dashboard',<br> title: 'Test Page',<br> path: '\/test-page',<br> items: null<br> }<br> ]<br>} <\/pre>\n\n\n\n<p>After completing these above steps you need to run the command <code>npm run dev<\/code> command in the project directory. After running this process you need to run the command <code>php artisan serve<\/code> . It will serve your app on the localhost.<\/p>\n\n\n\n<p>For more customization you can follow the same steps that is in the other documentation topics.<\/p>\n<div class=\"pld-like-dislike-wrap pld-template-1\">\n    <div class=\"pld-like-wrap  pld-common-wrap\">\n    <a href=\"javascript:void(0);\" class=\"pld-like-trigger pld-like-dislike-trigger \" title=\"\" data-post-id=\"416\" data-trigger-type=\"like\" data-restriction=\"cookie\" data-ip-check=\"0\" data-user-check=\"1\">\n                        <i class=\"fas fa-thumbs-up\"><\/i>\n                    <\/a>\n    <span class=\"pld-like-count-wrap pld-count-wrap\">    <\/span>\n<\/div><div class=\"pld-dislike-wrap  pld-common-wrap\">\n    <a href=\"javascript:void(0);\" class=\"pld-dislike-trigger pld-like-dislike-trigger \" title=\"\" data-post-id=\"416\" data-trigger-type=\"dislike\" data-ip-check=\"0\" data-restriction=\"cookie\" data-user-check=\"1\">\n                        <i class=\"fas fa-thumbs-down\"><\/i>\n                    <\/a>\n    <span class=\"pld-dislike-count-wrap pld-count-wrap\"><\/span>\n<\/div><\/div>\n\n","protected":false},"excerpt":{"rendered":"<p>How to add a New Page To add a new page follow the instructions given below: 1. Create a file with the extension .vue under the vuely-laravel->resources->js->views directory. You can also create your file under the your-page-name directory. See the given below example we have taken an example of TestPage that we are going to [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":39,"comment_status":"closed","ping_status":"closed","template":"","meta":[],"_links":{"self":[{"href":"https:\/\/docs.theironnetwork.org\/vuely\/wp-json\/wp\/v2\/pages\/416"}],"collection":[{"href":"https:\/\/docs.theironnetwork.org\/vuely\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/docs.theironnetwork.org\/vuely\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/docs.theironnetwork.org\/vuely\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/docs.theironnetwork.org\/vuely\/wp-json\/wp\/v2\/comments?post=416"}],"version-history":[{"count":3,"href":"https:\/\/docs.theironnetwork.org\/vuely\/wp-json\/wp\/v2\/pages\/416\/revisions"}],"predecessor-version":[{"id":685,"href":"https:\/\/docs.theironnetwork.org\/vuely\/wp-json\/wp\/v2\/pages\/416\/revisions\/685"}],"wp:attachment":[{"href":"https:\/\/docs.theironnetwork.org\/vuely\/wp-json\/wp\/v2\/media?parent=416"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}