Issues with widgets embedded on a custom auction site

Hello!
I am running into an issue while embedding Manifold widgets on a custom webpage.I have been building a website on which I want to aggregate all tokens listed for an auction. Integrated widgets as advised on Manifold Docs pages.
The site is hosted on replit.com. Code repository can be seen at https://replit.com/@daqhris/collect-awalkaday-art#index.html.

The first issue is that I can’t get a HTTPS live version. When the site is viewed inside the code editor, it loads up the secure link, minus the “Connect Widget” (https://connect.manifoldxyz.dev).

Outside the code editor, in a normal browser window, I am able to access a HTTP non-secure version. One caveat: the Twitter logo looks overblown in size and one (or more) widget(s) does not load up properly.

The site link is http://collect.awalkaday.art. Its DNS settings have been edited and configured to be run on cloudflare.com. That’s how I managed to turn the default site address collect-awalkaday-art.daqhris.repl.co into a shorter and readable web address.

I spent some time reading the docs and understanding how widgets work. I have also created an account on Manifold Developer Portal and set up 5 apps which are in use in the front-end code repository on Replit.

I am seeking help to solve two issues:

  • failure to load a HTTPS site version (authentication or certificate errors)
  • probable mistake in configuring project ID settings which impacts access to Manifold API

Any suggestion or solution is welcome. Thank you!

After digging more into this, it seems that there is a sort of incident at my hosting provider replit.com.

Just got notified of this crucial issue which then, leads me to believe that there might be no issue with Manifold widgets implementation on the site. I will wait until the hosting platform’s problem gets resolved and report if there are noteworthy changes.

Source: https://status.replit.com/

hey daqhris! the twitter logo being overblown is due to the identity widget’s styling not being fetched correctly. it seems you have two // between the version and the actual stylesheet name.

can you elaborate on what you’re trying to do with the Manifold API?

1 Like

hello manifold team. thanks for taking time to read the code.

The HTTPS issue has been solved, independently by Replit. So the site can be visited by using a secure link.

The side effect of this is that I can paste it in the “Redirect URI” field during app configuration on Manifold Developer Portal. I was scared to cause trouble to underlying systems by linking to a http non-secure site. Resulting in a chicken-and-egg problem.

Screenshot 2023-05-19 at 10-32-18 Manifold Developer Portal

Thanks so much for noticing the two //. It humbles me so much. I will correct the typo and fix my own dumb mistake.

I plan on using Manifold API to sell photos from the awalkaday.art collection, via auction or fixed price listing, directly on the project website. The collection was minted on Ethereum Mainnet nearly 3 months ago. Thanks to a Manifold smart contract (https://etherscan.io/address/0xe31801c2e58b151c3ded2cb29da56147b7f27eb1#code).

I’ve listed some photographs (=tokens) on 2 platforms that enforce on-chain creator royalties: Coinbase NFT and Foundation. So, the next stage for this collection is creating a custom “marketplace”, built by myself, by using tools made available by your team. In this way, there is an option to collect the photos that is not dependent on third-party marketplaces and brings more value to the awalkaday.art brand name.

I don’t plan on accessing the API for stuff that I don’t personally own/created 100%. I’m just trying to carve myself a future as an artist by leveraging my technical and creative skills. For a longer and detailed paragraph about my motivation and build process, have a look at https://about.awalkaday.art (or Twitter: https://twitter.com/awalkadayart).

Thank you for your help in solving the issues.