Brooklyn Theme: How To Center Embedded TikTok Video

Store Design
1

Hi all,

I’m embedding a TikTok video on my website’s homepage using the Custom HTML section. But I can’t center the video, even with adding Embedded Video code . The center html works for an Instagram video, but not a TikTok video for some reason. The example TikTok video embed code is:

@lance210

What she said at the end :joy:

♬ original sound - Lance Stewart

Website: wewantgoodkarma.com

Password: Wewantgoodkarma

Please let me know what I’m messing up because it’s weird that Embedded Video code works for Instagram videos but not TikTok videos. Thank you!

2

Still looking for help with this issue. I’ve tried following all the other posts about centering videos and nothing seems to work for adding this TikTok video in the Brooklyn theme =/ Hoping somebody could help me out. Thank you!

3

Hi @GoodKarmaCo

Good day.

This problem is caused by your style.

You can add this snippet to solve your problem:

.rte blockquote {

padding-left: 0;

padding-right: 0;

width: 100%;

margin: 0 auto;

}

or you can use this snippet:

.tiktok-embed {

width: 100% !important;

margin: 0 auto !important;

}

You need re-check why you’re add this snippet: width: 120%;

and margin-left: -10%; in “.rte blockquote” selector

Link to refer: https://prnt.sc/10z603c

1 Like
4

You’re amazing! The first code worked perfectly added into theme.scss.liquid.

Thank you so much!