Jump to content

Archived

This topic is now archived and is closed to further replies.

ketri

Embedded video (in MediaBox OR TextBox) next to a slider is on a different vertical level

Recommended Posts

ketri

The problem is illustrated in the screenshot.

If I add for example an image slider next to an embedded video, they are on a different level.
How should I proceed?

1. is it possible to insert images or embed videos in a way that does not add any padding/margin above or below the inserted media?
MediaBox and TextBox adds margin or something above and below it so it looks like it's on a different level. 
I tried the  pl_raw -shortcode but had no results with

  1. [pl_raw]
  2. [pl_video type="vimeo"id="42811051"]
  3. [/pl_raw]

In either MediaBox or TextBox

2. Should I write LESS to remove the paddings/margins manually? 

What is the easiest way to make video-embeds or images be level with other compnents?

Share this post


Link to post
Share on other sites
ketri

How can I add an image to a comment?

I solved this problem by 

1. using a MediaBox
2. embedding the video without any shortcodes (<iframe width="640" height="360" src="//www.youtube.com/embed/xQmQeKU25zg" frameborder="0" allowfullscreen></iframe>)
3. I added a class "mediaboxvid" to the media box
4. wrote LESS: 

.mediaboxvid {
  p{
   margin:0;
  }
}

Seems to work for now...

Is there a smarter way? Should you add some kind of clickbox or do some work with thr video-embed-shortcodes? I read somewhere on the  that it's known that they have some issues and I understand that. But what's the status, what to do and what to expect in the future?

Thanks!

Share this post


Link to post
Share on other sites
ketri

Monologue continues...

I ran into an issue with the solution I posted above: Translating.

First of all, Am I doing this right: 
1. I Created a page-template called "home". I then add stuff to it, videos, imagesliders, Hero, pageloop etc...
2. Click Update Template with Current Configuration. Both my Finnish and English versions of the homepage use the same "home" -template. Now they both get updated with all the new stuff BUT I can chooce what content is inside of them
3. Write the correct content to the english Hero-section etc.

Should I be using the same template for both languages?

With the video-embedding solution I posted above this method of using the same template and setting the content of the sections in the right language doesn't work. It has the same video in both languages. 

Should I have a different template for both languages or use a different method in embedding the video? Do TextBox and MediaBox behave differently when using the same template in different languages? 

Thank you.
 

Share this post


Link to post
Share on other sites
James B

Hi there, I'm not sure how've set up the language translation but usually it will use the same template for both. It uses one page template and just translates the text on that page into the other language.

 

I'm not sure I'm following what you mean about the video 100%. Are you saying that depending on the language you want the video embed to change?


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites
ketri

Hopefully the uploading works now..

The embedded video is on a different vertical level than other elements like an image slider. Is there another way to fix?

Should I use textbox or mediabox for videoembeds?

Share this post


Link to post
Share on other sites
James B

Hi there, it could be that they are aligned, but an element in the html is adding a margin or padding. If you look in the web inspector in chrome at the embed, check to see if there is a margin added to the <p> tag, usually this is where that effect will occur. If you have a live link to the site we'll take a look for you.


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites

×