Canvas Support

portrait or square video

9 replies · opened Oct 14, 2022

RrenzodidoOct 14, 2022

Hey,

Currenty I amusing the Agency template as a portfolio, I really like it, but I can't make an article item which displays in 9x16 or 1x1 resolution. The “container” only displays 16x9 (landscape) resolution. How can I fix this?

Kind regards,
Renzo.

The current code I am using for each Article item is...

<article class="portfolio-item col-md-4 col-sm-6 col-12 pf-media pf-icons">
<div class="grid-inner">
<div class="portfolio-image">

attachment

            &lt;div class="bg-overlay"&gt;
              &lt;div class="bg-overlay-content dark" data-hover-animate="fadeIn"&gt;
                [](images/videos/ik-ben-pionier.mp4)
              &lt;/div&gt;
              &lt;div class="bg-overlay-bg dark" data-hover-animate="fadeIn"&gt;&lt;/div&gt;
            &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="portfolio-desc"&gt;
            &lt;h3&gt;SGS&lt;/h3&gt;&lt;span&gt;Ik ben pionier&lt;/span&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/article&gt;
SSemicolon WebSTAFFOct 16, 2022

Hello,

Unfortunately, the Lightbox Video resolution cannot be controlled. You will need to instead use the Inline Lightbox: https://themes.semicolonweb.com/html/canvas/lightbox.html and embed the Video within it with your desired resolution to apply the square effect. This is currently the only way to achieve this.

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

RrenzodidoOct 16, 2022

Hey,
I tired to ude an .mp4 in the suggested lightbox, but it still does not work. Any suggestions?

SSemicolon WebSTAFFOct 17, 2022

Hello,

You will need to either use the Video with 1x1 Ratio or use a Custom Solution. Since this functionality is not included with Canvas, you will need to make the Customizations yourself or you can also consider checking the Embed Ratio helper: https://getbootstrap.com/docs/5.2/helpers/ratio/ .

We will also consider including this functionality in future versions of Canvas.

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

RrenzodidoOct 17, 2022

Can you help me out with how to implement the embed ratio helper code in my current code?

SSemicolon WebSTAFFOct 18, 2022

Hello,

Apologies for the Inconveniences caused but since this functionality or feature is currently not included with Canvas, this comes under customization. And since we currently do not provide Customization Services, you will need to wait for this feature to be available in future updates or make these customizations yourself.

Thanks for Understanding.

Meanwhile, do let us know if we can help you with anything else or if you find any further issues with Canvas.

RrenzodidoOct 18, 2022

Understand, i'll figure it out. But for videoportfolio it would he great to have this option asap. Because video comes in all shapes and sizes. 16x9 is broadcast only.

Kind regards.

SSemicolon WebSTAFFOct 18, 2022

Hello,

You can try something like this:
[ch_pre]

[/ch_pre]

But the Video also needs to be of the same resolution. Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

RrenzodidoOct 19, 2022

Thx, but this is not the solution. The ratio class has to be inserted somewhere in the in the current article code. The look has to be the same for all the thumbnails. The only difference is that some videos will be displayed in 16x9 and others in 1x1 or 9x16 resolution.

RrenzodidoOct 19, 2022

But, no worries, hopefully this option will be added soon.

Thx!!!

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard