Prerequisites
The.com Basics
Intro
UpContent helps curate articles for you to share on your website.
To get UpContent on your The.com Site, you'll first need to get the articles you've curated in an UpContent Collection.
-
Associate your website and staging domain with your UpContent account.
-
Create the styles for how you want your articles to look on your site.
-
Associate the desired Collection with the styles you created.
Once you've completed the three steps above, it's time to access and add the code to your The.com website. To access the code that you need to add, follow the video above.
Add Codes to the Head
There are a few codes that you need to add, so let's start with the ones that need to go in the <head> of your Page Sheet. Notice that the codes here are split into two groups: links and scripts.

Add External Links
The steps for adding the link tags are the same for each one, so do the following for each.
-
Copy the link's href attribute value.
-
Make sure you are on the
<head>
of your Page. -
Create an External Link Element.
-
Paste the URL into the href attribute.
-
Type "stylesheet" into the Relationship attribute.

Do this for the three link tags. These links are only styling the content that is displayed by UpContent, so now we can connect the scripts to reach out and get the data.
Add Scripts
The steps for adding all three scripts are the same for each.
-
Copy the src attribute value from the code given by UpContent.
-
Make sure you are in the <head> of your Page Sheet.
-
Create a Script Element.
-
Paste the URL into the Source attribute.

Repeat this process three times, so there is a Script Element for each unique URL. Rename them to keep organized. Make sure they appear in the same order as directed by UpContent.
Add Content to the Body
So far, you have only added the calls to UpContent but haven't specified where or what data to show. UpContent will give you another code snippet to add to the page.
This time, however, it is not a script. Each gallery you've created will have a separate code snippet, shown below.

-
Copy the code for whichever gallery you want to display.
-
Go to the
<body>
of the Page. -
Create a containing element (a Section or Div is fine) wherever you want the UpContent gallery to show.
-
Nest a Raw HTML Element inside of the container.
-
Paste the code in the Text attribute.

If you refresh the site preview, you'll notice that nothing happens! This is expected. Since the domain of The.com's editor is not the same as the domain that you set up in UpContent, it won't work in the preview.
Deploy your page and view it in the browser. You'll see the content displayed properly. You might want to add some styling to the containing element to better suit your layout.
Comments
0 comments
Please sign in to leave a comment.