A Few Things! Should be easy fix

Hi there.

  1. On the ‘Our Team’ carousel, i’d only have two people up because it’s a small business at the moment. All I need to do is make sure the two items in that section are centered. Is there something I’m missing in the Elementor editor or would this take custom css?

  2. For the gallery section on the home page, I have photos of our facility. For some reason, its cutting off the gallery until I choose one of the categories, so it looks a little ‘off’. How can I get this to be set on the “Show All” category by default?

  3. In the Elementor editor for my home page, the gallery section title and the ‘our team’ section is overlapping, but when I preview the page, there is a large white space between them that is unnecessary.

This kind of seems like a lot, but I think they should be simple fixes, any help would be greatly appreciated!

Regards,
Luke

Hello Luke,

Thank you for reaching our to us. I’d like to help with the first query. Please use one topic for one question. Because it’ll help us easier track progress and assist you better way.

1

Do you have a link to the related page to share? We might be able to add a couple lines of CSS code to do that. I need to get the exact selector to use based on your setup.

Regards,
Kharis

Thank you for responding! I will be sure to keep each post limited to one inquiry from now on.

Here is the link to our home page:

http://www.neoshoeventcenter.com

Thank you for sharing.

Please try doing the below steps:

  1. Install and activate the TC Custom JavaScript plugin
  2. Go To Appearance > Custom JavaScript
  3. Paste the following code into the provided box
    ;(function($) {
      if ( $().owlCarousel ) {
        $("body .roll-team:not(.roll-team.no-carousel)").owlCarousel({
          navigation : false,
          pagination: true,
          responsive: true,
          items: 2,
          itemsDesktopSmall: [1400,2],
          itemsTablet:[970,2],
          itemsTabletSmall: [600,1],
          itemsMobile: [360,1],
          touchDrag: true,
          mouseDrag: true,
          autoHeight: false,
          autoPlay: false,
        }); // end owlCarousel
      } // end if
    })(jQuery);
  1. Update
  2. Then add this CSS code to Appearance > Customize > Additional CSS from dashboard.
    @media only screen and (min-width: 900px) {

      .elementor-widget-athemes-employee-carousel {
        max-width: 800px;
        margin-left: auto;
        margin-right: auto;
      }

    }

Regards,
Kharis

Thank you! After the page comes up, it takes a minute but the gallery does fix itself. The photos are centered without delay each time the page loads. I hate to be picky, but do you know why the red line working as a separator between the title and the actual gallery is hugging the title so close? Also, spacing between the sections is better, but it’s not quite the same padding still as the other sections. Sorry to be complicated, just want to try and make it as perfect as possible

Actually, the gallery is still having photos cut off and the padding above it is still there, but if you click the show all button, it corrects itself.

Hello there,

What’ll happen if you try disabling site caching from W3 Total Cache settings panel. Because there might be script conflict with it.

Regards,
Kharis