tuanphan

Can you share link to a course page? We can check easier

We can use custom CSS to achieve this if you can share url, we can check easier Or you can use plugin to build custom navigation for Member Area Header

You can use Gallery Slideshow first, then share page url, I can check easier

You can add this code to Page Header Code Injection or Code Block <style> /* header color */ header#header.shrink { background-color: white !important; } header#header.shrink img { filter: invert(0); } /* navigation items */ header#header.shrink div.header-nav-item>a { color: #000 !important; } /* Burger Icon */ header#header.shrink .burger-inner>div { background-color: #000 !important; } /* Burger X Close icon */ body.header--menu-open header#header.shrink .burger-inner>div { background-color: #000 !important; } </style>

I see your header are overlap left navigation item So, move both to these positions?

You can add a Code Block in Tyler Stalman > Paste this code <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css" integrity="sha512-KfkfwYDsLkIlwQp6LFnl8zNdLGxu9YAA1QvwINks4PhcElQSvqcyVLLD9aMhXd13uQjoXtEKNosOWaZqXgel0g==" crossorigin="anonymous" referrerpolicy="no-referrer" /> <ul class="t-social"> <!-- instagram --> <li> <a href="https://instagram.com"> <i class="fab fa-instagram"></i> </a> </li> <!-- Youtube --> <li> <a href="https://youtube.com"> <i class="fab fa-youtube"></i> </a> </li> <!-- Twitter --> <li> <a href="https://twitter.com"> <i class="fab fa-twitter"></i> </a> </li> <!-- Tiktok --> <li> <a href="https://tiktok.com"> <i class="fab fa-tiktok"></i> </a> </li> </ul> <style> /* code block padding top bottom */ .code-block { padding-top: 0; padding-bottom: 0; } /* social icons code */ .t-social { display: block; margin: 0 auto; padding-top: 5px; text-align: center; padding-left: 0; } .t-social li { display: inline-block; margin: 0; line-height: 100%!important; } .t-social li i { font-size: 30px; margin: 0 20px; color: white; } </style> Replace example Instagram, Tiktok, Twitter... with your new url

To achieve this, you can First, add a section in Site Footer > Design this layout Next, edit that section > Add a Code Block > Paste this line <span class="close-popup">X</span> Next, edit Header button > Enter this url #popup Next, let me know, I will test some code to make this section become popup when clicking Contact Button

h1.blog-title { font-family: nineties !important; }

Do you use Personal or Business or Commerce Plan? With these images, will require script code

Can you check it again? It looks like you haven't clicked Save or haven't set option yet

Remove your code & use this new code nav.header-nav-list>div:nth-child(1) { position: absolute; left: 0; top: 50%; transform: translateY(-50%); } nav.header-nav-list>div:nth-child(2) { position: absolute; right: 0; top: 50%; transform: translateY(-50%); } Also, I see your font-face code has invalid code, so I guess it didn't work on some devices

I think you can use Gallery Block Slideshow or Gallery Section Slideshow, then use CSS code to rotate thumbnails to right of page If you share link to page, I can check & give the code

You can share link to this page, we can check & give the code

Hi, What is site url?

#1. It looks fine to me. Can you take a screenshot? #2. I don't see video thumbnail on this page

Where did you add popup code? Code Block, Code Injection or Page Header? If Code Block/Embed Block, you can use this code to Website Tools > Custom CSS (however it still appears under Header, because we can't change z-index of this section > z-index of header) [data-section-id="6581c02002632c6accb52de0"] { z-index: 9999999 !important; } You should add Popup code to Page Header Code Injection or Site wide Code Injection Footer, we can fix problem easier

What should it look like on mobile? Use another image or change white space color?

Can you share link to that page? We can check easier

Can you share link to website where you get Scrollify.JS code?

Add this code to last line in Code Injection > Footer <script> $(function(){ $(".slide img").each(function(){ var title = this.alt; $('<span class="t-caption">'+ title +'</span>').insertAfter($(this).parent()); }); }); </script> <style> div.slide + .t-caption { display: none !important; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); z-index: 999999; } div.slide.sqs-active-slide + .t-caption { display: block !important; } </style>

It is site default color, you can use this new code <style> header#header, footer.sections { display: none; } body { background-color: white; } </style>

I see you have a syntax error in CSS box. Can you send all current code in CSS box? We can check problem easier

Yes. Need a script code, if you still need help, let me know, I can do a quick guide

Change this line .ProductItem-gallery-slides { width: 100%; } to this .ProductItem-gallery-slides { width: 100%; margin-bottom: 10px !important; }

See this