Vagrant Setup: With WordPress Multisite (Multiple proxys)

[zslabs]

Hi all, So I've seen http://quick.as/q0rs9jz which seems to lend to the idea that we can use Browser-Sync within a Vagrant setup by specifying the IP address of the Vagrant box, but within a WordPress multisite environment, I have multiple domains that are passed through to WordPress which renders each site. I cannot use just the IP address because when opened from Browser-Sync, it does not see the IP address as a valid WordPress Multisite instance. Any pointers on how I'd get around this?

[zslabs]

Wanted to check back-in if anyone has figured out this one - I've been toying around it with it for quite a while, but LiveReload has been my fallback for now.

[shakyShane]

You can use BrowserSync in the same way as live reload by omitting the proxy option, a snippet will output into the console for you to paste into the footer of your pages...

[shakyShane]

RE: Multisite - Not sure if it's even going to be possible.

What we really need is for someone to take 30 mins to provide us with a sample project with vagrant config & wordpress setup etc.

This would be a massive help for us :)

[zslabs]

Thanks - I'm going to give omitting the proxy a shot. My Vagrant setup is a bit complex to replicate publicly, but believe VVV might be the best "quick" setup to test. Looks like there's been talks about Browser-Sync in there as well. Thanks.

[akeemw]

Not sure if this is helpful in your situation but this looked like it worked for me in my multiple vhost Vagrant machine. I forwarded one of my host ports over to browsersyncs port in the Vagrant box and used the vhost ServerName as the proxy.

BrowserSync: proxy: 'VHOSTNAME.dev', xip: true

Vagrant File: config.vm.network "forwarded_port", guest: 3000, host: 3333, auto_correct: true

With all that I am able to connect to the particular vhost I want with this: http://127.0.0.1.xip.io:3333/

Of course this will only allow for one Browsersync session at a time but that was a normal use case for me anyway.

[onnimonni]

You can use our wordpress layout with pre-configured vagrant: https://github.com/Seravo/wordpress

We fixed this by having nginx proxy all requests to wordpress through browsersync (but only if it is running).

Our layout is similiar to bedrock.

For example:

$ git clone https://github.com/Seravo/wordpress ~/wordpress-dev
$ cd ~/wordpress-dev
$ cp config-sample.yml config.yml
# Add your multisite domains into config.yml
$ echo "    - site1.wordpress.dev" >> config.yml
$ vagrant up
$ vagrant ssh -c "wp core multisite-convert --subdomains"
$ vagrant ssh -c "wp site create --slug=site1 --title=Site1 --email=vagrant@wordpress.dev"
$ vagrant ssh -c "cd /data/wordpress && gulp serve"
# then open up your multisite at: site1.wordpress.dev
# and you will be connected to the site using browsersync as middleware :)
# Edit gulpfile.js so it's suited for your own purposes

Only problem is that browsersync will sync all pages in same path: eg. http://site.wordpress.dev/ and http://site2.wordpress.dev/. So they will sync eachother if one of them changes, but for our workflow that hasn't been a problem since this is local and we are only developing one of the sites at a time.

Using this you can even use browser-sync in the admin-panel :).

[lkraav]

We are already working with @shakyShane to separate this subsite setup into separate talking channels within browser-sync. Unfortunately, client work and other things are getting priority so it's been slow to move along. But looks like technically it can be done.