@@ -30,6 +30,8 @@ __CMS Connect App__ - adds the connection between the WordPress CMS and VueFront
30
30
31
31
[ VueFront on Wordpress] ( https://wordpress.vuefront.com/ )
32
32
33
+ ![ VueFront wordpress admin panel] ( http://joxi.net/DmBL9V6SJ1LqWA.jpg )
34
+
33
35
## What does it do?
34
36
This is a wordpress plugin that connects the wordpress CMS with the VueFront WebApp via a GraphQL API. When installed, you will be provided with a CMS Connect URL that you will add to your VueFront WebApp .env file.
35
37
@@ -46,6 +48,79 @@ Php version required >= 5.5, <= 7.2 (this limitation will be removed in the futu
46
48
47
49
You will need the CMS Connect URL to complete the [ VueFront Web App installation] ( https://vuefront.com/guide/setup.html )
48
50
51
+ ## Deploy VueFront Web App to hosting (static website)
52
+ ### via VueFront Deploy service (recommended)
53
+ 1 . Install the VueFront CMS Connect App from this repo.
54
+ 2 . Log in or register an account with VueFront.com
55
+ 3 . Build your first Web App
56
+ 4 . Activate the new Frontend Web App (only avalible for Apache servers)
57
+ > For Nginx you need to add this code to your ` nginx.config ` file right after the ` index ` directive
58
+ ```
59
+ location ~ ^((?!image|.php|admin|catalog|\/img\/.*\/|wp-json|wp-admin|wp-content|checkout|rest|static|order|themes\/|modules\/|js\/|\/vuefront\/).)*$ {
60
+ try_files /vuefront/$uri /vuefront/$uri "/vuefront${uri}index.html" /vuefront$uri.html /vuefront/200.html;
61
+ }
62
+ ```
63
+
64
+
65
+ ### via ftp manually
66
+ 1 . Install the VueFront CMS Connect App from this repo.
67
+ 2 . Log in or register an account with VueFront.com
68
+ 3 . Copy the CMS Connect URL
69
+ 4 . Via Ftp create a new folder ` vuefront ` in the root of your WordPress site on your hosting.
70
+ 5 . Via command line build your VueFront Web App ([ read more] ( https://vuefront.com/guide/setup.html ) )
71
+ ```
72
+ yarn create vuefront-app
73
+ # When promote, provide the CMS Connect URL, which you coppied at step 3.
74
+ yarn generate
75
+ ```
76
+ 6 . Copy all files from folder ` dist ` to the newly created ` vuefront ` folder
77
+ 7 . modify you ` .htaccess ` file by adding after ` RewriteBase ` rule the following rules:
78
+ ``` htaccess
79
+ # VueFront scripts, styles and images
80
+ RewriteCond %{REQUEST_URI} .*(_nuxt)
81
+ RewriteCond %{REQUEST_URI} !.*/vuefront/_nuxt
82
+ RewriteRule ^([^?]*) vuefront/$1
83
+ # VueFront sw.js
84
+ RewriteCond %{REQUEST_URI} .*(sw.js)
85
+ RewriteCond %{REQUEST_URI} !.*/vuefront/sw.js
86
+ RewriteRule ^([^?]*) vuefront/$1
87
+ # VueFront favicon.ico
88
+ RewriteCond %{REQUEST_URI} .*(favicon.ico)
89
+ RewriteCond %{REQUEST_URI} !.*/vuefront/favicon.ico
90
+ RewriteRule ^([^?]*) vuefront/$1
91
+ # VueFront pages
92
+ # VueFront home page
93
+ RewriteCond %{REQUEST_URI} !.*(image|.php|admin|catalog|\/img\/.*\/|wp-json|wp-admin|wp-content|checkout|rest|static|order|themes\/|modules\/|js\/|\/vuefront\/)
94
+ RewriteCond %{QUERY_STRING} !.*(rest_route)
95
+ RewriteCond %{DOCUMENT_ROOT}".$document_path."vuefront/index.html -f
96
+ RewriteRule ^$ vuefront/index.html [L]
97
+ RewriteCond %{REQUEST_URI} !.*(image|.php|admin|catalog|\/img\/.*\/|wp-json|wp-admin|wp-content|checkout|rest|static|order|themes\/|modules\/|js\/|\/vuefront\/)
98
+ RewriteCond %{QUERY_STRING} !.*(rest_route)
99
+ RewriteCond %{DOCUMENT_ROOT}".$document_path."vuefront/index.html !-f
100
+ RewriteRule ^$ vuefront/200.html [L]
101
+ # VueFront page if exists html file
102
+ RewriteCond %{REQUEST_FILENAME} !-f
103
+ RewriteCond %{REQUEST_FILENAME} !-d
104
+ RewriteCond %{REQUEST_URI} !.*(image|.php|admin|catalog|\/img\/.*\/|wp-json|wp-admin|wp-content|checkout|rest|static|order|themes\/|modules\/|js\/|\/vuefront\/)
105
+ RewriteCond %{QUERY_STRING} !.*(rest_route)
106
+ RewriteCond %{DOCUMENT_ROOT}".$document_path."vuefront/$1.html -f
107
+ RewriteRule ^([^?]*) vuefront/$1.html [L,QSA]
108
+ # VueFront page if not exists html file
109
+ RewriteCond %{REQUEST_FILENAME} !-f
110
+ RewriteCond %{REQUEST_FILENAME} !-d
111
+ RewriteCond %{REQUEST_URI} !.*(image|.php|admin|catalog|\/img\/.*\/|wp-json|wp-admin|wp-content|checkout|rest|static|order|themes\/|modules\/|js\/|\/vuefront\/)
112
+ RewriteCond %{QUERY_STRING} !.*(rest_route)
113
+ RewriteCond %{DOCUMENT_ROOT}".$document_path."vuefront/$1.html !-f
114
+ RewriteRule ^([^?]*) vuefront/200.html [L,QSA]
115
+ ```
116
+
117
+ > For Nginx you need to add this code to your nginx.config file right after the index rule
118
+ ```
119
+ location ~ ^((?!image|.php|admin|catalog|\/img\/.*\/|wp-json|wp-admin|wp-content|checkout|rest|static|order|themes\/|modules\/|js\/|\/vuefront\/).)*$ {
120
+ try_files /vuefront/$uri /vuefront/$uri "/vuefront${uri}index.html" /vuefront$uri.html /vuefront/200.html;
121
+ }
122
+ ```
123
+
49
124
## Support
50
125
For support please contact us at [ Discord] ( https://discord.gg/C9vcTCQ )
51
126
0 commit comments