I can see that you can add a link using st.write using the markdown format, but can you add an affiliate link with a picture, like an amazon.com affiliate link?
You can insert arbitrary HTML with components.
st.components.v1.html("<p>whatever</p>")
(There’s also st.markdown with the unsafe_allow_html parameter, but that won’t allow scripts.)
If that’s not clear, can you share more details about exactly what you want to embed?
Thank you! I just want to see if you can add affiliate marketing from amazon.com or ebay.com, but I do not know their format at this time. I will try the HTML component out and see if it works.
I created an amazon affiliate link and added it to my streamlit app. When I press the link on my streamlit app, I get this:
www.amazon.com refused to connect
Does anyone have any insight on why this might happen and how to get around it?
Can you share your code?
I was able to get a basic link working using this method: Streamlit hyperlink - #2 by Caroline
My code that did not work for st.components.v1.html that did not work is very simple:
st.components.v1.html('<a href="https://amzn.to/XXXXXXX">Item</a>')
Where XXXXXXX is my affiliate code.
If you are simply putting a plain link in your document without any additional formatting, images, or JavaScript, you can just do it with markdown like in Caroline’s post. That’s effectively doing this:
st.markdown("[Item](https://amzn.to/XXXXXXX)")
You can also use markdown for HTML like this:
st.markdown("<a href='https://amzn.to/XXXXXXX'>Item</a>", unsafe_allow_html=True)
The code you show for st.components.v1.html looks correct to me. Are you getting the refused to connect message like above? If so, how are you viewing your app? I would expect that message with some code that’s trying to open Amazon in an iframe instead of a new tab. Sites can restrict people from opening them in iframes. This is a security measure.
That error comes up both in community share and local deployments. I am viewing them both on chrome. I have tried in an incognito window with the same results.I am not sure why st.markdown works but st.components.v1.html doesn’t work.
My understanding is that the html version does not use its own iframe and for that, I would have to run st.components.v1.iframe so I am not sure why I am getting the refuse to connect message.
I also wanted to try to run some bidirectional affiliate marketing using st.components.v1.iframe but I don’t think it can be done because I don’t think it is possible to install node.js or npm in community share.
Hmm, now I am getting errors for all links including the st.markdown links.
I see that the st.markdown links work from my local deployed site, but they no longer work in my community cloud site. Now they are refusing to connect or are being reset.
Test link from community cloud site does this now when activated:
The reset error looks like this:
The st.markdown links all work properly from my local deployment, though the st.component.v1.html links are refused from my local deployment.
The st.markdown and st.write links are both working fine now.
1 Like
This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.