Tiktok Lightbox Solution

When a TikTok link is posted in a lightbox, it gets really glitchy. Does anyone have a fix or solution for this? I can’t upload the videos to YouTube due to audio copyright, but they look awful and unprofessional on my portfolio from TikTok due to the component.

Really wishing the component accepted these links and was fully fleshed out :frowning:

1 Like

Hi, I didn’t have such a problem. I don’t know, maybe you can try to contact support?

The issue you’re encountering with TikTok links getting glitchy in a Webflow lightbox is common when embedding content from external sources like TikTok. Here are some potential solutions you can try:

  1. Embed TikTok Videos Directly: Instead of using a lightbox, consider embedding the TikTok video directly on your page. You can do this by copying the embed code from TikTok and pasting it into an embed component in Webflow. This often provides better performance and reduces glitches.
  2. Use a Third-Party Service: There are services like “Embedly” that can help to better integrate TikTok videos into your website. These services optimize the embed code and might resolve some of the issues you’re seeing.
  3. Custom Code: If you’re comfortable with custom coding, you could write a script to handle TikTok embeds more effectively within the lightbox. This might involve adjusting the iframe settings or applying specific styles to the lightbox when a TikTok video is played.
  4. Optimize the Lightbox: Ensure that the lightbox component isn’t interfering with the embedded video. Sometimes, applying CSS fixes like overflow: hidden; or tweaking z-index values can help smooth out the glitches.
  5. Consider a Different Layout: If the lightbox continues to cause issues, consider presenting your videos in a different layout, such as a dedicated video section on your page that doesn’t rely on lightboxes.

By implementing one of these methods, you should be able to reduce or eliminate the glitches and present your TikTok content in a more professional manner.