How can I reduce spacing around images?

[alexinsidemedia]

Hi,

We would like to have NO GAP between the images so they completely fill the space. How can we adjust those settings, we tried putting 0 in the margins but that didn’t work.

Also, how do you control the sizing and the audio of the background video? We’d like it to completely in the correct aspect ratio fill the top of this new home page:

https://bondhome.io/new-home-page/

Thanks for your assistance, you can also see the gaps I’m mentioning on this page.

Alex

[Kieran_SQ]

Hi,

Please can you update this ticket with admin credentials so I can take a look at the page in the back-end. Also please let me know which specific images are you trying to remove the 15px padding either side from.

The aspect ratio won’t be automatic if it’s a background video. You’ll need to adjust the height of the row to suit your video. If it’s 16:9 you can use this tool to get an idea of sizes https://www.size43.com/16by9-aspect-ratio-calculator/.

If it’s absolutely imperative that the video displays perfectly each time then you should look at embedding it directly within the row and not as a background video – this way it will always appear as originally intended.

Thanks,

Kieran.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[alexinsidemedia]

This reply has been set as private.

[Kieran_SQ]

Hi,

Thanks for getting back to me, so I do not overwrite any of your page content I created a new page titled ‘New Home Page SQ’ which has the URL of https://bondhome.io/new-home-page-sq/.

What I changed:

– Video row, I clicked on the pencil icon for the row and checked the option ‘Full height row?’ under the tab ‘General’ within WP Bakery (formerly Visual Composer). Let me know if this shows enough of your video or not. See screenshot for how to do this.

– ‘Best of Show’ images row, I clicked on the pencil icon for the individual columns and set the padding value to 0 (left and right) under the ‘Design Options’ tab. See screenshot on how to do this.

– ‘Fireplace / Garage Door’ images row – as above. I clicked on the pencil icon for the individual columns and set the padding value to 0 (left and right) under the ‘Design Options’ tab. See screenshot on how to do this.

– Set the title to not show to be in line with the wireframe image you sent. I scrolled down past the editor to the area titled ‘Theme General Settings’, clicked the tab titled ‘Title section’ and checked the option ‘Hide the title’. See screenshot on how to do this.

Thanks,

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

Attachments:

You must be logged in to view attached files.

[alexinsidemedia]

Hi Kieran,

OK getting there but the video is still not right as now it takes over everything and the ratios are still off. Can the width be set to the “boxed width” dimensions and then just have the height go automatically? Also, can it play the audio?

The section below that with the photo of the BOND and ceiling fan – this needs to have no space between the top of the image and the video above it, also no space below it so the blue background of the next section touches the bottom of the image.

The Upcoming Appliance section is better but I still see space to the right of the image and we’d like it to be flush with the side of the layout.

I really appreciate it as we will use this as guidelines/examples to do the rest of the pages.

Thanks!

Alex

[Kieran_SQ]

Hi,

I’ve gone back into the page to investigate the ratio issue of the video, I found that you had set the video background to the column and not the row. I have changed this and reduced the padding you’re using which shows a lot more of the video. However this still takes up most of the visible space – reducing the px padding used will cause you to see less of the video.

The video height cannot be set automatically because it is a background video, much like a background image, it will only show in the background of the element it is in, so the element needs to be a certain height. For you, this is generated via the padding you have in place. For the same reasons (background) you also cannot have audio in a background video by default.

You can set the padding to 0 for the top and bottom of each row to achieve the effect of no spaces between each row. You can click on the pencil icon for the row, select the general tab and scroll to the padding section.

You can remove the padding at the end of rows by going to each row you wish to have this effect, click the pencil icon for the row, select the tab ‘General’ and scroll to ‘Inner Container’, set this option to no. This will remove the padding left and right from the row.

Sometimes you may need to set a value of 15px for left and right padding with the above feature enabled. You can do that by following the same steps from above but instead scroll to the padding section of the ‘General’ tab.

Thanks,

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

Attachments:

You must be logged in to view attached files.

[alexinsidemedia]

Hm, ok great that all makes alot of sense. Is there another way to have the video in that place with a text overlay so that it would play audio?

[Kieran_SQ]

Hi,

If you have intermediate to advanced HTML skills you could use the KLEO Magic Container within WP Bakery to embed the video in div 1 and overlay your text in div 2. However YouTube doesn’t appear to allow autoplay via embed anymore so your video wouldn’t automatically stater as it does now. There is also the issue that you would need to make this responsive as the above described wouldn’t worked well on mobile without some more advanced CSS.

I will direct this ticket to a developer who may be able to assist you with your need. They’ll be in touch as soon as they can, but they are available Mon to Fri only, East Europe Time. You may have to wait a day or two before you receive a reply depending on their current work load.

Thanks,

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[alexinsidemedia]

Thank you Kieran! 🙂

[Radu]

Hi

Let me know more exactly what you need to achieve ?!

Cheers
R.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[Author]

Posts