I recommend getting in touch with WooCommerce’s support about this via https://woocommerce.com/my-account/contact-support/ if you have any of their paid WooCommerce products or https://ww.wp.xz.cn/support/plugin/woocommerce/ if you do not.
Ah, ok.
What plugin are you using to manage the products and filter system?
WordPress doesn’t have filtering or eCommerce functionality built-in.
You have a syntax error in this rule:
@media only screen and (min-width: 769px){.home #primary {
display: grid;
gap: 5px;
grid-template-columns: repeat(auto-fill, minmax(323px, 1fr));
padding-right:10px;
grid-template-rows: grid-template-rows: repeat(3, minmax(450px, 1fr));
}
grid-template-rows: occurs twice for the same rule, remove one of them.
I’m unsure where its source is, but it occurs at line 507 of the page’s source HTML. I think it might be originally somewhere in Additional CSS?
Correcting the syntax ought to correct the row height problem you are seeing. You may need to flush your browser’s cache to see the effect of the change.
perfect!
By the way, I have about 1600 lines of css in the customizer, I think it’s time to transfer them to a .css file and put them on the server, what is the most rational procedure?
You can copy/paste move the entire Additional CSS content to your theme’s style.css. Or instead, move it to a new .css file and add a @import line to style.css to cause it to be loaded. Some examples here. The examples use relative file references. We shouldn’t use relative URLs in WP though. Use something like get_stylesheet_uri() to build a full absolute URL.
There’s a chance certain rules may lose their precedence after being moved. You may need to move individual problem rules back to Additional CSS.
using style.css causes less problems than creating a new .css file? I thought maybe it is better to move the rules little by little, not all at the same time
this css is now unclear to me:
.wp-call-button-in-btn {
display: none;
}
I seem to notice that the more css rules I put in the style.css file the slower it is to load, so even the right typefaces can be loaded with a bit of a delay. Maybe there is a way to load one rule faster than others? Like the image preload I already used once
That CSS hides whatever button has the .wp-call-button-in-btn class attribute. Sometimes buttons are initially hidden, then exposed by script once certain criteria is met. Or the button is not needed at all and hiding it was the easiest way to get rid of it.
Yes, larger files take longer to load, but CSS files are not typically all that large compared to image files. Depending on your server configuration, it’s conceivable that Additional CSS would load faster than the same in a .css file. One comes from the DB, the other of course is a text file. If one had a very large DB, loading a text file may be faster.
100 KB of CSS is 100 KB of data regardless of where it comes from. The page has to load it one way or another. It’s infeasible to preload CSS because the order in which it loads impacts precedence. Preloaded CSS is more likely to be overridden by conflicting rules.
If you haven’t already done so consider a plugin that optimizes CSS and JS code to reduce its volume so it loads faster. Some caching plugins have an optimization feature. There are also stand alone plugins such as “Autoptimize”. Caching is probably the best way to speed up CSS and JS loading. The same data can be reused on multiple pages without the need to reload everything.
ok. Maybe it’s better if I do nothing. But it’s not very easy to look for a rule in the customizer if you have 1600 lines. I’ll ask the server manager
Another question. How can I center-align the div containing the booking form? https://test.sacconicase.com/hotels/
Usually margin: 0 auto; centers things, but it’s not working here.
This could work for some screen sizes:
.bookingaff iframe {
margin-left: calc((100% - 770px) / 2);
}
There will need to be media query variants for any screen sizes it doesn’t work for.
You’re rolling multiple topics into one thread here. While I’m happy to help, please start new topics once in a while so others have an opportunity to help as well 😉
