Jump to content

Help needed to implement api code correctly!

Recommended Posts

Hi!

I have an issue of not getting things to work the way I want it to.
Sorry the language is n Norwegian in the webpage, but I´ll try to describe the issue nevertheless.

On https://play.bilmc.no/ you will now see how the new site looks like.
On the attached image I´ve shown an example of how I can make usage of the api with css customization, and the strings in the code will help me show what data to present to the vistor.

On https://bergenbilogmcskole.tabs.no/kursoversikt you´ll see the data I want to present on play.bilmc.no.
The creators of that page is the same company who produced the api.

One of the attached images shows how to be able to use the api.
On that "code-image" it says that "To use the JSON-endpoints it needs to register the IP adresss of the server used.
I´ve told them to "open up" and approve 4 IP-adressess who is attached to Squarespaces servers.
That means that the developers opens these four IP´s as whitelisted.
https://www.nslookup.io/domains/play.bilmc.no/webservers/
 

Further on is says "Kurs" and "HTML" on the third attached image to this post.
Both with <script> and <div code.

My questions are to you;

Where do I put the different codes?
If I put this in the header:

$client = new GuzzleHttp\Client();
$res = $client->request(
'GET', 'https://api.tabs.no/api/v2/course', [

'headers' => ['ApiKey' => 'c4e844824823f69be8305a98696b96d5'],

'query' => ['officeId' => 304], ]);

It will only appear as black text and white background all the way on top.
 

I don´t understand how to add a Query-parameter...

 

When I include this in code-block;
 

<script>var officeId = {ID};</script>
<script
src="https://api.tabs.no/js/api.js?v2.0.0"></script>

I will have a "No preview when logged in box" and nothing when published...


How can I make the data appear on my page?

Hopefully someone can make me understand!

bilmc-ex.jpg

Skjermbilde 2023-01-12 kl. 07.53.40.png

Skjermbilde 2023-01-12 kl. 08.05.01.png

Link to comment
6 hours ago, Bilmc said:

Help needed to implement api code correctly!

Some of the code above is PHP and can only be installed on a website server. It is not suitable for use on Squarespace, but I cannot understand the guide in the screenshot to know if this one alternative or the only method available.

If TABS have confirmed that their API can be installed on a "serverless" web builder like Squarespace then please provide us with a link to the API documentation as well as any custom JavaScript they have supplied.

Did this help? Please give feedback by clicking an icon below  ⬇️

Edited by paul2009

About: Squarespace Circle Leader since 2017. I value honesty, transparency, diversity and great design ♥.
Work: Squarespace Developer and founder of SF Digital, building the features Squarespace didn't include™. 
Content: Links in my posts may refer to SF Digital products or may be affiliate links.

Catch up on all the release notes and announcements 2023 [for Circle members only]. There's a public version here too!
If I helped, you can thank me by clicking one of the emojis below. If you prefer, you can buy me a coffee.
Improve your online store with our extensions.

Link to comment
38 minutes ago, paul2009 said:

The code above is PHP and can only be installed on a website server. It is not suitable for use on Squarespace.

If TABS have confirmed that their API can be installed on a "serverless" web builder like Squarespace then please provide us with a link to the API documentation as well as any custom JavaScript they have supplied.

Did this help? Please give feedback by clicking an icon below  ⬇️

Thanks, Paul!

Here's the documentation I have:

https://drive.google.com/file/d/16ueKq7rw-NtR9R0DVhuR4ZT8DsmBK0GT/view?usp=drivesdk

Let me know if the link doesn't work.

Are you ok with Norwegian language in the text? I assume the code is multilingual 😉

I did use it previously, but at that time it was on Weebly. I haven't checked, but I believe they have similar solution as SS.

Link to comment

What is your ID?

<script>var officeId = {ID};</script>

 

About: Squarespace Circle Leader since 2017. I value honesty, transparency, diversity and great design ♥.
Work: Squarespace Developer and founder of SF Digital, building the features Squarespace didn't include™. 
Content: Links in my posts may refer to SF Digital products or may be affiliate links.

Catch up on all the release notes and announcements 2023 [for Circle members only]. There's a public version here too!
If I helped, you can thank me by clicking one of the emojis below. If you prefer, you can buy me a coffee.
Improve your online store with our extensions.

Link to comment

Sorry, I should have been more specific 🙂. I should have said that your ID is missing from the code on your site and so I see this error:

image.png.94bf6836e36a990c2a2d00a7ff96f053.png

You will need to edit the code that you added to replace {ID} (all the characters in bold) with your ID.

Having done this, you can add the HTML on page 4 of the guide to a Code Block to create the element (a 'div') that will show the course information. This isn't something I can test because the API is, as you mentioned, locked to your site. However, I hope this gives you enough to get started.

If you need more specific help, I recommend hiring a developer.

Did this help? Please give feedback by clicking an icon below  ⬇️

About: Squarespace Circle Leader since 2017. I value honesty, transparency, diversity and great design ♥.
Work: Squarespace Developer and founder of SF Digital, building the features Squarespace didn't include™. 
Content: Links in my posts may refer to SF Digital products or may be affiliate links.

Catch up on all the release notes and announcements 2023 [for Circle members only]. There's a public version here too!
If I helped, you can thank me by clicking one of the emojis below. If you prefer, you can buy me a coffee.
Improve your online store with our extensions.

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.