Is It Possible to remove Border Around Video?

Solved
Highlighted
Tourist
13 0 0

Hi, my question is for video border or frame. Is it possible to remove it from an uploaded video that's on product pages? The theme I am using is Debut. Here is a product link with video. That blue border I would like to remove it from all product video

https://jenesaisquoishop.com/collections/with-this-ring/products/aeaw-2-carat-ct-8mm-round-cut-df-co...

 

Also is it a way to change the layout of my footer? As of now, these pages/links go straight across, but I would like them as below. Is this possible to do in Debut?

 

Shipping Policy

Returns And Refund Policy

Terms Of Service

Privacy Policy

Contact Us

 

Thanks in advance

0 Likes
Excursionist
10 4 3

Hi @ametress 

 

I was not able to see the blue border around the video player. 

 

The layout of your footer could be changed. It is possible to do in the Debut theme, as a default when the link list (menu) is the only content occupying this space, it will show as inline. Look for the following on the footer.liquid file located under sections (when editing the code of the theme):

 

 {%- when 'link_list' -%}
                {%- assign footer_linklist = block.settings.menu -%}
                  <ul class="site-footer__linklist
                            {% if inline_list %}list--inline{% endif %}">
                    {%- for link in linklists[footer_linklist].links -%}
                      <li class="site-footer__linklist-item">
                        <a href="{{ link.url }}"
                          {% if link.current %} aria-current="page"{% endif %}
                        >
                          {{ link.title | escape }}
                        </a>
                      </li>
                    {%- endfor -%}
                  </ul>

            {%- endcase -%}

change it to: 

{%- when 'link_list' -%}
                {%- assign footer_linklist = block.settings.menu -%}
                  <ul class="site-footer__linklist">
                    {%- for link in linklists[footer_linklist].links -%}
                      <li class="site-footer__linklist-item">
                        <a href="{{ link.url }}"
                          {% if link.current %} aria-current="page"{% endif %}
                        >
                          {{ link.title | escape }}
                        </a>
                      </li>
                    {%- endfor -%}
                  </ul>

            {%- endcase -%}

Then under the assets section edit the theme.scss.liquid file. Under line 6242 and 6246 you will find the following: 

 

.site-footer__linklist-item {
  display: block;
  padding: ($grid-gutter / 2) 0;

  @include media-query($medium-up) {
    padding: 0 $grid-gutter 5px 0;
  }

Change the padding of the include in line 6246 to:

 

 @include media-query($medium-up) {
    padding: 15px 0;
  }

This will make your list now appear as you have listed on this thread. If you want the links to be closer together than the padding will need to be decreased, for example instead of 15px make it 5px. 

 

Hope this answers your question about your footer links.

Inspired by Unique Creativity - info@icyborgs.com
0 Likes
Tourist
13 0 0

@Icyborgs Thanks so much I will do what you have advised. 

 

The video has a blue outline sort of speak in the shape of a box when the video is touched by the mouse. When the video is clicked to play the box appears when it's clicked to stop it still stays. It disappears when you tap away from the video if that makes sense. I did not see it via mobile but it's there via laptop screening. Strange I know.

 

Also, is it possible to mute video sound?

0 Likes

Success.

Excursionist
10 4 3

@ametress 

 

You are welcome, glad that I could help. 

 

That is weird, I visited the link in my laptop and saw the video without seeing the blue box. I also tried viewing the video found on that product page with Chrome, Edge, and Internet explorer and was not able to see a blue box, border, or outline. I did see that edge and explorer had the progress bar blue while Chrome had it white, it might be a browser issue.

 

It is possible to have the video load without any sound (muted). If you currently use the "upload video" function in the product description box, just add the muted="true" to the video tag that you currently have.

 

<video width="320" height="240" controls="controls" muted="true">
    
  <source src="video's URL goes here" type="video/mp4" />
  <source src="movie.ogg" type="video/ogg" />
Your browser does not support the video tag.
</video>

 

Inspired by Unique Creativity - info@icyborgs.com
0 Likes
Tourist
13 0 0
That is so weird. IDK what that's about... Thanks for all your help I followed your instructions and achieved what I needed. I will add the code to mute the videos.
Just one more thing is it possible to make the footer area smaller? It's huge right now almost like another section of the site. Thanks again for your time and help.
0 Likes