FAQ Q265: How can I integrate planyo with my website created with Wix?

First of all, if you don't yet have a website, we'd strongly encourage you not to use Wix but instead to either host your website yourself using a CMS such as Wordpress, Drupal or Joomla, or to use a hosted website creator which will allow copying and pasting HTML code WITHOUT creating iframes (a great example would be Weebly or Jimdo, both of which we strongly recommend). This way the integration with Planyo will be much easier and you will be free to use millions of code widgets available on the internet without being limited to preselected apps. As many articles on the internet prove, hosting your website or choosing a website creator which allows you to work with any HTML code widget will in the end cost you less money and will give you more possibilities.

If, however, you'd like to integrate Planyo with Wix, you have two choices:
In this FAQ question we show you how to create your own private app. This process is relatively straightforward and is presented step-by-step here, even though some parts of it are not documented on the Wix website. Unfortunately you cannot use the "Copy&paste of HTML code" integration method with Wix because Wix will always embed the HTML code into an iframe which will break some of the functionality.

1. Log into your Wix account and then go to http://dev.wix.com

2. click on "Add your app" on top of the screen. In the "App Name" field enter something like "Online booking" (exact name is not important), then click on the "Register your App" button to continue.



3. Fill in your contact details in the next step and click the "Start building your app" button.

4. Now you'll need to edit the app settings. Set the App type to "Page". Then expand the "Set App endpoints" section and set the "Page URL" to http://www.planyo.com/wix-app
Update: Wix will no longer accept planyo.com URLs in this field. Use a service like goo.gl or TinyURL in order to convert this URL to a shorter version. Then paste the resulting URL in this field.



5. Expand the "Set App Settings endpoints" section and set the fields as follows:
Settings URL: http://www.planyo.com/wix-app/settings.php
Update: Wix will no longer accept planyo.com URLs in this field. Use a service like goo.gl or TinyURL in order to convert this URL to a shorter version. Then paste the resulting URL in this field.
Width: 600
Height: 850



Click on "Save and continue". You don't need to and shouldn't continue setting the app parameters because this is your private app which will not be published.

6. Now go to the Wix editor to edit your website and once inside the editor, change the current URL in your browser's location bar by adding the following parameter to the URL:

&appDefinitionId=xxx
Important: xxx above must be replaced by the App key visible in your app settings (Steps 4 and 5).

The full URL will look similar to this:
http://editor.wix.com/html/editor/web/renderer/edit/b34bc7f2-b898-4f1a-aeee-aaaa?metaSiteId=bdd997f6-8fa5-43f4-adb7-aaaa&editorSessionId=089C406A-AE35-445D-8D20-aaaa&appDefinitionId=xxx

Adding the appDefinitionId parameter makes your private app visible in the app market even though it's not officially published.

7. Now click on the Wix App Market icon and click on the "Developer Apps" link (just above Featured). You'll see the "Online booking" app as the only item in the list. Add it to your Wix site.



8. A new page was added to your Wix site, this is the page where the planyo plugin will be found. This page will perform all functions related to your bookings: it will show the search results, resource listing and details, the reservation form etc. You can edit its Settings to change the display name to anything you like. Click on the contents of this page (empty by default) and then click on "App Settings" to edit your planyo plugin settings.



9. Specify the desired settings. The most important one is Planyo Site ID which is the ID of your planyo site. See the following two tutorials: Configuring the availability search and Configuring the presentation of your offer and the reservation process for detailed explanation about the plugin settings.

Back to Frequently Asked Questions