Ryan Ray

Hi @digitljaved,

That seems like something in the child theme is causing issues, but I also see that Storefront is pretty out of date.

Your version is 2.2.4 and the lastest version is 2.5.0. 🙂

Nonetheless, the problem you mentioned…

The product filtering by capacity doesn’t work for this category for some reason. The same site and files are on 3 other servers and it works fine, the site is on Cloudways and the filtering by capacity on the page in question does not work. I’m at loss in how I can resolve this problem.

Just to clarify, looking at the URL you shared you are saying you aren’t able to use these two dropdowns? I ask as I was able change the options in those two dropdowns?

Link to image: https://cld.wthms.co/RB9wgo

Hi @katherinemasters,

Thanks for the clarification, I don’t think you need to (or want you to) switch from Elementor to using the block editor if Elementor is working for you!

When you are editing that page, does it happen to give you a section that looks like this? In the Document settings there is a Page Attributes section that lets you choose a template. I ask because I’ve recreated my own homepage in Storefront using blocks, and when I use the Full width template and set it as my front page in WordPress the page title is hidden automatically for me.

Link to image: https://cld.wthms.co/nYkNMl

BACKEND:

Link to image: https://cld.wthms.co/hwAp1C

FRONTEND:

Link to image: https://cld.wthms.co/Ofhpda

Perhaps Elementor takes over any of those options, but I was just hoping that we could get the same thing to happen. Regardless of that I think there is a slight CSS issue with the main cover image (not sure what Elementor calls it). Here are some tweaks to that in addition to removing the page title on the home page only.

.home .entry-header {
    display: none;
}

.home.page:not(.page-template-template-homepage) .site-header {
    margin-bottom: 0;
}

@media (min-width:768px) {
  .elementor-section.elementor-section-height-full {
    height: auto;
  }
}

Try that out to see if that was more what you had in mind.

Hi @strictlyonlinebiz,

Happy to help! 🙂

Hi @mariofrancoz,

Could you please share a copy of your site’s System Status? You can find it via WooCommerce > Status.
Select “Get system report” and then “Copy for support”.  Once you’ve done that, paste it here in your response.

One other thing that may help as well is looking for any clues in the fatal errors log files. You can find those under WooCommerce > Status > Logs. There in the dropdown find the latest fatal errors log and view it. If you see anything there feel free to copy and paste it here in a reply as well.

Hi there @ace90v1,

Looking at that product page I currently see the sticky add to cart working, had you perhaps figured this out?

Link to image: https://cld.wthms.co/mLzeUy

Hi @strictlyonlinebiz,

It is definitely possible to tweak the widths between the main column and sidebar. There is a general container div with the class .col-full. This gets a calculated property (based on the number of columns and their width), but to make things simpler the max width it allows is max-width: 66.4989378333em;. If you wanted to make that wider you’ll want to first change that width, try something like 80em.

Beyond that the .col-full div has the primary content area and the secondary widget area within it. You can then adjust your width of each of these divs in a percentage based calculation that eventually adds up to 100% in the end.

These are again calculated with some fun SCSS formulas, but they are currently as follows if your sidebar is on the right side of the site.

@media (min-width: 768px) {

  .right-sidebar .content-area {
      width: 73.9130434783%;
      margin-right: 4.347826087%;
  }

  .right-sidebar .widget-area {
      width: 21.7391304348%;
      margin-right: 0;
  }

}

Just to confirm that does all add up, 73.9130434783% + 4.347826087% + 21.7391304348% = 100%

So for what you are after you’ll want to make the .right-sidebar .content-area width a little smaller. Then increase your .right-sidebar .widget-area appropriately. For example, this would make the sidebar wider and main content a little thinner and add up to 100%.

@media (min-width: 768px) {

  .right-sidebar .content-area {
        width: 70%;
        margin-right: 3%;
  }

  .right-sidebar .widget-area {
      width: 27%;
      margin-right: 0;
  }

}

Here is a before & after for how that looks.

BEFORE:

Link to image: https://cld.wthms.co/hJUNjM

AFTER:

Link to image: https://cld.wthms.co/RTlKTK

• This reply was modified 6 years, 11 months ago by Ryan Ray.
• This reply was modified 6 years, 11 months ago by Ryan Ray.
• This reply was modified 6 years, 11 months ago by Ryan Ray.
• This reply was modified 6 years, 11 months ago by Ryan Ray.

Hi there @katherinemasters,

I think I see what you are talking about, I see the page title “Home” when resizing my browser window.

Can you first tell me how you’ve built the homepage? I ask as I have a page using the full-width template and blocks via the new block editor. I then don’t have the same issue with my page title showing. Any insight would be great, if you don’t mind sharing.