How to contain embeds

  • Resolved scottish2

    (@scottish2)


    6 years, 1 month ago

    Hi

    OK so here is the situation. When I embed YouTube videos into my posts I keep the width to 560 wide and this seems OK.

    But I noticed today I posted a link to a White House press release and it popped up a preview panel which I like but problem I have is when it is published it has no width control meaning that the preview image and preview text extend slightly off the right edge of the main post column. Post column being the main column of my theme where the posts are displayed.

    I tried to add a width to the DIV tag but no good it says it doesn’t like that code and refuses to comply with said width.

    Is there a way to force link embeds that pop up previews or any and all embeds to stay within the boundaries of the post column so I don’t have posts extending however far right they wish even overlapping into the right hand column??

    Thanks

    The page I need help with: [log in to see the link]

Viewing 8 replies - 1 through 8 (of 8 total)
  • Moderator Samuel Wood (Otto)

    (@otto42)

    www.remarpro.com Admin

    It’s hard to say without seeing the problem. Can you post a link? Or post the link to embed which is causing the problem?

    Thread Starter scottish2

    (@scottish2)

    I won’t pot anything new for the moment so at the moment is the 3rd and 4th posts down you will see one if a White House Press release and the second is a 2A article and both are slighting going past the right edge of the main area.

    Just need to know if there is a way to control the width of the embedded content or not

    [ See first post for link ]

    One thing I have noticed is the left indent is larger on the links compared to the YouTube embeds further down. Notice on the left margins the videos are closer to the left edge unlike the links posted in the above mentioned posts.

    • This reply was modified 6 years, 1 month ago by scottish2.
    • This reply was modified 6 years, 1 month ago by Jan Dembowski.
    Moderator Samuel Wood (Otto)

    (@otto42)

    www.remarpro.com Admin

    Gotcha. Okay, the problem isn’t the width, but rather that the embed is wrapped in a figure, and by default these figures have a 40 pixel margin on either side of them.

    You can fix this by forcing the left margin to zero on the embed block. Like so:

    
.wp-block-embed {
    margin-left: 0;
}

    Something like that in your theme or Custom CSS rules should correct it without affecting anything else other than the embed blocks.

    Thread Starter scottish2

    (@scottish2)

    Great that got it within the post column borders so i assume now when I post links it will pull up the item (if possible) and then it will automatically left adjust it and the width will be proper to fit the column on the right side edge??

    ———————————

    Also is there anything specific I need to do to get these preview pop ups to work as like the White House Press release I had a hard time getting that to work as I noticed sometimes it would pop up other times it seemed to just post a text link not even an active link. Just that one link seemed to give me a headache the other link seemed to post OK!

    Moderator Samuel Wood (Otto)

    (@otto42)

    www.remarpro.com Admin

    If you put the link in the Embed Block in the new Block Editor, then it will embed right there in the editor, so you can see if the embed is working before publishing the post. If it can’t embed, it will give you an error for that URL.

    Thread Starter scottish2

    (@scottish2)

    Reason I asked is I noticed at times I would get the preview in the editor but when I posted it would some times pop up and sometimes just show a TEXT link. I only noticed this because of the problem the thread was originally addressed for.

    The newest post posted fine and the one from the WH posted fine in the end. So this part of this thread is just more out of curiosity is all.

    Moderator Samuel Wood (Otto)

    (@otto42)

    www.remarpro.com Admin

    If you use the embed block then it sort of pre-loads the embed, so you won’t have that uncertainty problem.

    Thread Starter scottish2

    (@scottish2)

    OK Thanks and thanks for helping sort out the alignment issue!!! Looks great now!!

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘How to contain embeds’ is closed to new replies.