> For the complete documentation index, see [llms.txt](https://guide.swiftxr.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://guide.swiftxr.io/plugins/cargo.md).

# Cargo

## Introduction

SwiftXR is a powerful platform for creating and sharing interactive 3D, augmented reality (AR), and virtual reality (VR) experiences on the web. With the SwiftXR (3D/AR/VR) Integration for Cargo, you can easily integrate SwiftXR Projects into your Cargo website, enabling you to create immersive and interactive web experiences.

**Creating a Project in SwiftXR**

Navigate to the SwiftXR Hub: Begin by visiting the SwiftXR Hub, or alternatively click on this link: <https://swiftxr.io/hub>
\
Initiate Project Creation: Once on Hub, click the “Create Project” button and enter your desired project name.
\
Design or Develop: Utilize the intuitive editor to effortlessly add and customize SwiftXR components, bringing your 3D vision to life.

<figure><img src="/files/HR2jeVSuLwBqF84u0Q5U" alt=""><figcaption></figcaption></figure>

**Publishing your SwiftXR Project**

* Utilize the editor to create your 3D vision using the SwiftXR components. Once satisfied with your creation, press the “Publish” or “Update” button to make your project live.

<figure><img src="/files/DstnZXwhxMDb6kGs1Cqe" alt=""><figcaption></figcaption></figure>

**Copy Embed Code**

* After publishing, click the dropdown button beside the “Update” button and select “Share.” Within the Share modal, click the “Copy Embed” button to copy the embed code for your project.

<figure><img src="/files/aRK33yr3RWui0OL0ZbPV" alt=""><figcaption></figcaption></figure>

**Integrating SwiftXR into Bravenet Website**

* Go to <https://cargo.site> and sign in (or create a free account).
* Choose one from the below templates you wish to work with.

<figure><img src="/files/g9h5RBOHbUVmNo81uZfj" alt=""><figcaption></figcaption></figure>

**Editing your Cargo Website**

* After you have chosen a template, you would be directed to the page below
* Click on “Edit” in the top left corner of your page to enter Cargo’s editing mode.

<figure><img src="/files/nN2HC3UqvaZsZhtSOInh" alt=""><figcaption></figcaption></figure>

**Add an HTML Element**

* In Cargo’s edit mode, you would see in the top right corner the HTML tag (\</>).
* Click on it.

<figure><img src="/files/VCUWopsz6nyr6devJCac" alt=""><figcaption></figcaption></figure>

**Paste your SwiftXR Embed Code**

* Paste your SwiftXR iframe code into the Custom HTML editor box in Cargo.
* Click outside the editor to save the code

<figure><img src="/files/acoLCjJqbsxwCo0bwaFj" alt=""><figcaption></figcaption></figure>

**Viewing your Product in the Website**

* After pasting your SwiftXR iframe embed code, you would see the result in the website.

<figure><img src="/files/VqLRfP3ey9HEV3mGv7JP" alt=""><figcaption></figcaption></figure>

**Copying the URL to your Live Site**

* Click on the URL icon in the right hand side of your page and click on “Cargo URL”
* Copy the URL and click on “OK”.

<figure><img src="/files/DRB57g9zlxPBQKugrgfK" alt=""><figcaption></figcaption></figure>

**Viewing your Scene in the Web, AR or VR**

* Paste the link you copied in a different tab and your SwiftXR 3D/AR project should now appear embedded on the page.

<figure><img src="/files/XlXAS7a7CIeAM3gUe9f7" alt=""><figcaption></figcaption></figure>

**Conclusion**

Integrating SwiftXR with Cargo makes it easy to embed immersive 3D and AR content into your site. This combination enhances your design with interactive experiences, giving visitors a more engaging and modern way to explore your work.

<br>