Hi Christoph,

Amelia can only be used in a WordPress environment, as you probably know,

but we have another product called Trafft, which is a SaaS based online booking system,

and it can be embedded outside of WordPress.

You can check out Trafft on this website,  and you can ask any questions to our Trafft Support Team,

if you wish, on the bottom right corner in the Chat bubble.

I hope that might help perhaps as an easier solution for this use case.

-

When it comes to Amelia, something like what you described is not currently possible with any built-in functionalities or solutions.

It would maybe be possible with custom work,

but that is not provided from our Support.

I will ask our developers to see if they can advise to get you started in the right direction, if you have coding skills or your own developer.

As soon as they advise, we will report back to see if they know of any way you could try this with our current Amelia's capabilities.

Thank you for your patience.

Let me know if you decide to perhaps try out Trafft in the meantime for this particular use case.

Hi Christoph,

my apologies, i just re-read your description of the use-case again, and realise i might have misunderstood it.

Because when you wrote this first part :

We have a non-wordpress app that has the requirement to embed Amelia so that users can book an appointment inside the app.

At first my impression was that you wish a solution for customers to be able to book an appointment from that APP which is outside of WordPress.

But then when you wrote

Inside the App, we already have the username and email address. We want to hand this information to Amelia so the user doesn’t have to enter them again.

The second part seems like you wish to send the Customer's details to Amelia on WordPress,

so perhaps when a Customer goes to a WP Page where you have Amelia,

to have the Customers information already filled out in the Form?

-

Could you elaborate a bit more, is this perhaps going to go through an API or something like that,

and do you need the entire booking to be processed from that APP that is outside of WordPress,

but to have Amelia somehow store it in its data?

Maybe it's best if we clarify the use case in more details,  then we can check with our developers if something like that can be done even with custom work.

Thank you.

Hi Christoph,

Thank you for this, i think it clarifies what you're trying to achieve.

I will ask our 2nd level Team if this is possible with our other SaaS based product, Trafft,

and what could be the chances of adding something like this with Amelia.

As soon as they advise, we will report back.

Thank you for your patience.

Hi Christoph,

Thank you for your patience, we have been advised what you can do with Amelia.

You can place Amelia's content on a WP Page, and then embed the entire WP Page somewhere outside of WordPress.

There is also a way to input name and last name from a Customer in order to pre-populate it,

here is a script which you can use to input data ( name and last name) via URL :

<script>
  var getUrlParams = function (url) {
    var params = {};
    var parser = document.createElement('a');
    parser.href = url;
    var query = parser.search.substring(1);
    var vars = query.split('&');
    for (var i = 0; i < vars.length; i++) {
      var pair = vars[i].split('=');
      params[pair[0]] = decodeURIComponent(pair[1]);
    }
    return params;
  };
  window.urlParams = getUrlParams(window.location.href);
  window.beforeConfirmBookingLoaded = function () {
    var firstName = document.querySelector(""#am-confirm-booking > div:nth-child(1) > form > div.am-confirm-booking-data.el-row > div:nth-child(3) > div > div > div > input"");
    var lastName = document.querySelector(""#am-confirm-booking > div:nth-child(1) > form > div.am-confirm-booking-data.el-row > div:nth-child(4) > div > div > div > input"");
    if ('firstName' in window.urlParams) {
      firstName.value = window.urlParams.firstName;
      firstName.dispatchEvent(new Event('input'));
    }
    if ('lastName' in window.urlParams) {
      lastName.value = window.urlParams.lastName;
      lastName.dispatchEvent(new Event('input'));
    }
  }
</script>

If we input this in URL 

https://localhost/ameliafull/index.php/booking/?firstName=John&lastName=Doe

Then "John Doe" will be auto populated in the Amelia's Form fields on front-end.

If you add this to the Email template :

https://localhost/ameliafull/index.php/booking/?firstName=%customer_first_name%&lastName=%customer_last_name% 

Then it will input name and last name of the Customer.

I hope that helps.

Hi Christoph,

To begin, I want to extend my heartfelt apologies for the delayed reply, 

which is due to an unexpectedly high volume of inquiries. 

We truly value your patience during this period.

-

I see what you mean, when we visit the Page , as you said - any of the Customer details are not being automatically populated in the Form.

I am honestly not sure how much our Support can cover on this,

because it is a custom solution.

We usually just provide an idea for custom solutions but don't cover any troubleshooting.

That being said, i will still do my best to check with our senior Team if we could provide any advice/ assistance in this matter.

Could you send us the Script you used, and if you can tell me more details in which way did you add the Script to this Page?

If it has any kind of sensitive data, please send it as a PRIVATE reply, for safety reasons.

In the meantime, we will also check to see how much assistance we can provide.

Thank you.

Hi Christoph,

Firstly, I would like to sincerely apologize for the delayed response as we have been experiencing an unusually high number of tickets. I am sorry that it has taken longer than usual to respond to your concern and your patience is highly appreciated.

-

We got advised by our developers.

This script was designed for a previous version of the booking form. 

Please consider using the following updated script instead:

<script>
window.ameliaActions = {
SelectService: function (success = null, error = null, data) {
    
var getUrlParams = function (url) {
    var params = {};
    var parser = document.createElement('a');
    parser.href = url;
    var query = parser.search.substring(1);
    var vars = query.split('&');
    for (var i = 0; i < vars.length; i++) {
      var pair = vars[i].split('=');
      params[pair[0]] = decodeURIComponent(pair[1]);
    }
    return params;
  };
  window.urlParams = getUrlParams(window.location.href);
console.log(window.urlParams)
console.log(data)
data.booking.customer.firstName =  window.urlParams.firstName
data.booking.customer.lastName =  window.urlParams.lastName
data.booking.customer.email =  window.urlParams.email
  },
}
</script>

We hope that helps.

Hi Christoph,

To begin, I want to extend my heartfelt apologies for the delayed reply, 

which is due to an unexpectedly high volume of inquiries. 

We truly value your patience during this period.

-

We will check with our devs for additional advice.

As soon as they advise, we will report back right away.

Thank you for your patience again.

Hi Christoph,

Good news, one of our developers found what you can change and it works on his test.

Please change the hook name to "ViewContent" instead of "SelectService", we didn't see that you preselected the service, employee and location the first time, after further inspection we realised it.

<script>
window.ameliaActions = {
ViewContent: function (success = null, error = null, data) {
    
var getUrlParams = function (url) {
    var params = {};
    var parser = document.createElement('a');
    parser.href = url;
    var query = parser.search.substring(1);
    var vars = query.split('&');
    for (var i = 0; i < vars.length; i++) {
      var pair = vars[i].split('=');
      params[pair[0]] = decodeURIComponent(pair[1]);
    }
    return params;
  };
  window.urlParams = getUrlParams(window.location.href);
console.log(window.urlParams)
console.log(data)
data.booking.customer.firstName =  window.urlParams.firstName
data.booking.customer.lastName =  window.urlParams.lastName
data.booking.customer.email =  window.urlParams.email
  },
}
</script>

It should work like that.  Let us know how it goes.