the shortcode doesn’t work properly. (categories sort)

[Ilay]

Is there any other way to sort it?
The shortcode doesn’t work properly and it doesn’t look good and designed.

It looks like I just throw the categories on homepage, while I can’t control how many in 1 line, put it in the middle, and choose the size of the square.

Also can you write me a shortcode of displaying the featured-products section?

[Andy]

That’s very strange… it should look exactly the same, because the homepage categories use the same code as the shortcode.

You can control how many in 1 line with the columns part of the shortcode.
This is 4 on one line:
[product_categories ids="5,3,87,23" columns="4"]

If you want 3 on one line, you would do this:
[product_categories ids="5,3,87,23" columns="3"]

Do you have the shortcode on a page on your website that I can take a look at?

[Andy]

The shortcode for featured products is:

[featured_products columns="4"]

Some more examples;

If you want 2 lines of 4 in each line, do this:

[featured_products columns="4" limit="8"]

If you want 3 lines of 3 in each line, do this:

[featured_products columns="3" limit="9"]

[Ilay]

Ok it works, But the order doesn’t change, how do I set the order of the categories?

[Andy]

Sorry, I forgot to say that to make the order the same as the order you put them in the shortcode, you need to add orderby="include" to the shortcode.

e.g.:

[product_categories ids="42,27,24,28" columns="4" orderby="include"]

[Ilay]

How do I put the featured products (through shortcode) in the middle.

[Andy]

The shortcode for featured products is:

[featured_products columns="4"]

Some more examples;

If you want 2 lines of 4 in each line, do this:

[featured_products columns="4" limit="8"]

If you want 3 lines of 3 in each line, do this:

[featured_products columns="3" limit="9"]

[Ilay]

I did it. I have only 1 and its perfect, but its on the right side and I want to put it in the middle.
https://bonimstore.com

How do I do it?

[Yazmin]

You will need to add an extra CSS class to the shortcode like so:

[featured_products columns="5" class="product-centered"]

Now add this ‘Additional CSS’ to make only this product centered:

.product-centered ul.products li.product {
    float: none;
    margin-left: auto;
    margin-right: auto;
}

[Author]

Posts