Jump to content

Can I use javascript to parse an xml/text file uploaded to my squarespace site?

Recommended Posts

Hi, I am an artist who is in the process of setting up my squarespace 7.0 website. I have my gallery page set up and my contact page almost set up, using a lot of javascript in code injection, which is working fine. I have teamed up with 3rd party apps zapier and airtable to send confirmation emails to my customers even though although I have chosen not to use an online store. I will exclusively use paypal invoices to handle all monetary transactions, because shipping costs are heavily dependent upon the shipping address. What I would like to do now is to make it easy to display and change the price and size data data associated with each piece of artwork. One idea for a solution is to store this information in an xml file which would be made accessible to the site, and then let my javacript handle things from there. Ideally I would be able to upload the file to reside on the site, and have some javascript parse the file whenever the information is needed. If I want to change some of the information I would only have to re-upload the single file to the site. But I have not been able to figure out if it is possible to somehow upload a non-image file to my 7.0 site; nor have I been able to determine if code-injection javascript would be able to access the file for parsing, even if that file could be saved on the site. Note that I prefer not to use the feature whereby metadata can be uploaded with each image, because In the confirmation emails I have included references to artwork thumbnails, and these references need to stay valid across price changes. Does anyone know if these things can be done? If I can't do it this way I will have to come up with another plan. Thanks!

Link to comment
  • Replies 1
  • Views 351
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

I don't have a solution but here are some of my thoughts.

It sounds like you are familiar with JavaScript.

Although you might be able to come up with a upload a file to somewhere which you can then read with JavaScript, I suggest you upload your data into a JavaScript template literal in your site. Going this route would avoid the pain of dealing with CORS issues which can often happen with using JavaScript to access data.

Folks. Just a note here. Browsers and JavaScript are two totally different methods of accessing data on the web. In other words JavaScript is not a web browser. Web browsers are taking care of a lot of overhead for you that JavaScript doesn't do by default.

While you can parse XML with plain JavaScript, to some degree, I'd probably tend to use jQuery for dealing with XML. Keeping in mind that neither of these methods are specifically designed for XML processing.

So you might have a bit of code like the following. This is just example XML and not specific the your effect.

<script>

  window.myData = `
  
    <?xml version="1.0" encoding="UTF-8"?>
    <rss xmlns:excerpt="http://wordpress.org/export/1.2/excerpt/" xmlns:content="http://purl.org/rss/1.0/modules/content/" xmlns:wfw="http://wellformedweb.org/CommentAPI/" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:wp="http://wordpress.org/export/1.2/">
      <channel>
        <title>Your Site Title</title>
        <link>https://wedge-synthesizer-xy2y.squarespace.com</link>
        <pubDate>Tue, 17 May 2022 01:20:55 +0000</pubDate>
        <description />
        <language>en-US</language>
        <wp:wxr_version>1.2</wp:wxr_version>
        <wp:author>
          <wp:author_id>-364611387</wp:author_id>
          <wp:author_login>tom@tomsweb.consulting</wp:author_login>
          <wp:author_email>tom@tomsweb.consulting</wp:author_email>
          <wp:author_display_name><![CDATA[]]></wp:author_display_name>
          <wp:author_first_name><![CDATA[]]></wp:author_first_name>
          <wp:author_last_name><![CDATA[Thomas Creedon]]></wp:author_last_name>
        </wp:author>
        <wp:category>
          <wp:cat_name><![CDATA[null - null]]></wp:cat_name>
          <wp:category_nicename>null-null</wp:category_nicename>
          <wp:category_parent />
        </wp:category>
        <item>
          <guid isPermaLink="false">https://wedge-synthesizer-xy2y.squarespace.comx/blog/blog-post-title-one-zgywh</guid>
          <title>Blog Post Title One</title>
          <link>/blog/blog-post-title-one-zgywh</link>
          <content:encoded><![CDATA[<div
            class="
              image-block-outer-wrapper
              layout-
              design-layout-inline
          
          
          
            "
            data-test="image-block-inline-outer-wrapper"
        >

      

      
            <figure
                class="
                  sqs-block-image-figure
                  intrinsic
                "
                style="max-width:458px;"
            >
          
        
        

        
          
            
              <div
              
              
                  class="image-block-wrapper"
                  data-animation-role="image"
              
      data-animation-override

              >
                <div class="sqs-image-shape-container-element
              
          
        
              
                " style="
                    position: relative;
                
                      padding-bottom:75.10916900634766%;
                
                    overflow: hidden;
                  "
                  >
                  <noscript><img src="https://images.squarespace-cdn.com/content/v1/6282f87723685802c1af82a6/1654480973453-TQV9D99B9AW749L1Z26P/3b5532_0eeee48dc723408db9cfb85b508a3edc%7Emv2.webp" alt="" /></noscript><img class="thumb-image" src="https://images.squarespace-cdn.com/content/v1/6282f87723685802c1af82a6/1654480973453-TQV9D99B9AW749L1Z26P/3b5532_0eeee48dc723408db9cfb85b508a3edc%7Emv2.webp" data-image="https://images.squarespace-cdn.com/content/v1/6282f87723685802c1af82a6/1654480973453-TQV9D99B9AW749L1Z26P/3b5532_0eeee48dc723408db9cfb85b508a3edc%7Emv2.webp" data-image-dimensions="458x344" data-image-focal-point="0.5,0.5" alt="" data-load="false" data-image-id="629d604b36ad5457be8a8aed" data-type="image" />
                </div>
              </div>
        
          
        

        
      
            </figure>
      

        </div>
  

    ]]></content:encoded>
          <excerpt:encoded><![CDATA[It all begins with an idea.]]></excerpt:encoded>
          <wp:post_name>blog/blog-post-title-one-zgywh</wp:post_name>
          <wp:post_type>post</wp:post_type>
          <wp:post_id>1</wp:post_id>
          <wp:status>publish</wp:status>
          <pubDate>Mon, 11 Mar 2019 17:15:07 +0000</pubDate>
          <wp:post_date>2019-03-11 17:15:07</wp:post_date>
          <wp:post_date_gmt></wp:post_date_gmt>
          <category domain="post_tag" nicename="one-tag"><![CDATA[one tag]]></category>
          <category domain="post_tag" nicename="two-tag"><![CDATA[two tag]]></category>
          <category domain="category" nicename="three-category"><![CDATA[three category]]></category>
          <category domain="category" nicename="four-category"><![CDATA[four category]]></category>
          <dc:creator>tom@tomsweb.consulting</dc:creator>
          <wp:comment_status>closed</wp:comment_status>
          <wp:postmeta>
            <wp:meta_key>_thumbnail_id</wp:meta_key>
            <wp:meta_value><![CDATA[2]]></wp:meta_value>
          </wp:postmeta>
          <wp:comment>
            <wp:comment_id>1</wp:comment_id>
            <wp:comment_approved>0</wp:comment_approved>
            <wp:comment_author><![CDATA[Jim]]></wp:comment_author>
            <wp:comment_author_url />
            <wp:comment_author_IP></wp:comment_author_IP>
            <wp:comment_date></wp:comment_date>
            <wp:comment_date_gmt>2022-05-29 20:59:23</wp:comment_date_gmt>
            <wp:comment_content><![CDATA[<p>Very nice!</p>]]></wp:comment_content>
            <wp:comment_type />
            <wp:comment_parent>0</wp:comment_parent>
          </wp:comment>
        </item>
        <item>
          <wp:attachment_url>https://images.squarespace-cdn.com/content/v1/6282f87723685802c1af82a6/1654485256893-BJN3IEEO9I4ZHRI714O6/20140301_Trade-151_0124-copy.jpeg</wp:attachment_url>
          <link></link>
          <title></title>
          <wp:post_name></wp:post_name>
          <wp:post_type>attachment</wp:post_type>
          <wp:post_id>2</wp:post_id>
          <wp:status>inherit</wp:status>
          <content:encoded><![CDATA[]]></content:encoded>
          <excerpt:encoded><![CDATA[]]></excerpt:encoded>
          <pubDate></pubDate>
          <wp:post_date></wp:post_date>
          <wp:post_date_gmt></wp:post_date_gmt>
          <dc:creator></dc:creator>
        </item>
      </channel>
    </rss>
    
    `;
    
  </script>

Of course the data doesn't need to be on the window. You could  include it as part of your script for the parsing part of things.

Let us know what you come up with.

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

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.