Search Results for 'COLUMNS'

[Arkadiusz]

Arkadiusz

#292174

Hello,

I am creating website with tables for a client *Login to see link
In the table I have first column blocked.
How can I set this first column so that especially on mobile when scrolling the columns to the left the content of another columns should not be visible under the first column. I need the background of this first column not to be transparent. Please help.

Kind regards,
Arek

[Arkadiusz]

Arkadiusz

#292174

Hello,

I am creating website with tables for a client *Login to see link
In the table I have first column blocked.
How can I set this first column so that especially on mobile when scrolling the columns to the left the content of another columns should not be visible under the first column. I need the background of this first column not to be transparent. Please help.

Kind regards,
Arek

[marisa-3772]

marisa-3772

#292126

I’m working on my website and finding it very difficult to scroll through the icon options since there are only a few rows & columns displayed a time in the block settings icon choice. I’m trying to identify best icons for certain activities and finding the right related word to search (if the exact term doesn’t come up) is cumbersome…

Is there a full icon library visible on one page somewhere, so I can visually scan it more easily?

Thanks!

[marisa-3772]

marisa-3772

#292126

I’m working on my website and finding it very difficult to scroll through the icon options since there are only a few rows & columns displayed a time in the block settings icon choice. I’m trying to identify best icons for certain activities and finding the right related word to search (if the exact term doesn’t come up) is cumbersome…

Is there a full icon library visible on one page somewhere, so I can visually scan it more easily?

Thanks!

[pedro.meireles]

pedro.meireles

#292109

Hi Eve,

That did the trick! I wasn’t aware that you could click in “Individual” to define the number of columns for the various screen sizes.

Thank you very much for your help.

Regards,
Pedro

[Eze]

Eze

#292098

Hi Pedro,

Happy to help!

Are you referring to the Kadence Product Carousel block?

If yes, you can individually set the number of columns in the block General tab.

Here is a screencast for your reference:
https://share.zight.com/L1u25nz4

You can change the number of columns for the different screen sizes. Here’s a breakdown of what devices are typically represented by those screen sizes:

1. Screen Above 1500px:
Devices: Large desktop monitors (including 4K displays), ultra-wide monitors.

2. Screen 1200px – 1499px:
Devices: Standard desktop monitors, large laptops (15-inch and 17-inch screens).

3. Screen 992px – 1199px:
Devices: Smaller desktop monitors, standard laptops (13-inch to 15-inch screens).

4. Screen 768px – 991px:
Devices: Tablets (iPads, Android tablets) in landscape mode.

5. Screen 544px – 767px:
Devices: Tablets in portrait mode.

6. Screen Below 543px:
Devices: Smartphones.

I hope this helps.

Cheers,
Eze

[spencersukel]

spencersukel

#292077

Hi,

I’m working on a layout and need some help with a hover effect. Here’s what I’m trying to achieve:

I have a row with multiple columns.
When I hover over a specific column, I want the background of the entire row to change to a specific image associated with that column.
The row starts with a default dark grey background.

I’m trying to mimic something like the service area on the home page here: *Login to see link I know it’s not WP, but hopefully, it’s possible.

[spencersukel]

spencersukel

#292077

Hi,

I’m working on a layout and need some help with a hover effect. Here’s what I’m trying to achieve:

I have a row with multiple columns.
When I hover over a specific column, I want the background of the entire row to change to a specific image associated with that column.
The row starts with a default dark grey background.

I’m trying to mimic something like the service area on the home page here: *Login to see link I know it’s not WP, but hopefully, it’s possible.

[pedro.meireles]

pedro.meireles

#292031

Hi,

Is there any way to have a different column number for the product carousel on mobile and desktop? I have my product carousel set to 5 columns and in mobile it just looks awful. I’m trying to avoid having two carousels, one for each use case, and hiding them accordingly.

Thank you.

Regards,
Pedro

[pedro.meireles]

pedro.meireles

#292031

Hi,

Is there any way to have a different column number for the product carousel on mobile and desktop? I have my product carousel set to 5 columns and in mobile it just looks awful. I’m trying to avoid having two carousels, one for each use case, and hiding them accordingly.

Thank you.

Regards,
Pedro

[tianaoliviaphotography]

tianaoliviaphotography

#291962

For some reason, images on my website have suddenly become fuzzy, but it’s only images that are in columns. I have the resolution set to Full and the images were fine a few weeks ago. I’ve tried changing the photos to advanced photos, to a gallery, to individual photos in columns, but nothing makes them clear. You can see an example of what I’m talking about in my bio on my homepage, *Login to see link

[tianaoliviaphotography]

tianaoliviaphotography

#291962

For some reason, images on my website have suddenly become fuzzy, but it’s only images that are in columns. I have the resolution set to Full and the images were fine a few weeks ago. I’ve tried changing the photos to advanced photos, to a gallery, to individual photos in columns, but nothing makes them clear. You can see an example of what I’m talking about in my bio on my homepage, *Login to see link

[Xoonity]

Xoonity

#291913

I can reproduce the issue on a new page:

Add the “Post Grid/Carousel” block
“Number of items” = 6
“Layout Settings”/Layout = Carousel
“Columns” = 3
“Image Settings / Align image = Top

[arabnas]

arabnas

#291724

Also, Fixed add to cart show two columns with woo product add-ons (plugin)

[arabnas]

arabnas

#291723

Also, popup cart shows in two columns.

[arabnas]

arabnas

#291715

Hello Chito
First thanks for your help.
Your code fixed the single product issue (split in two columns) but since you could make report I would like to add: Product menu – Woo Templates – Some fields did not appear when it’s selected from Customize WooCommerce section on Kadence website. Such as extras and payments sections in single product template. screenshot attached show custom single product template page opened in wordpress customize wooCommerce options and extras/payments not appearing same as normal single product page in the second screenshot.

Regards

[Pascal]

Pascal

#291707

Hello friends
There is a drop in the third column of my portfolio grid for window art. How can I rectify this ?
*Login to see link

Pascal

[Pascal]

Pascal

#291707

Hello friends
There is a drop in the third column of my portfolio grid for window art. How can I rectify this ?
*Login to see link

Pascal

[arabnas]

arabnas

#291677

Hello,

Issue: on RTL wooCommerce product page split on two columns, two screenshots attached for LTR and RTL single product page shows the issue.

Kindly advise how to fix the RTL product page to be one column same as original LTR product page.

Thanks

[arabnas]

arabnas

#291677

Hello,

Issue: on RTL wooCommerce product page split on two columns, two screenshots attached for LTR and RTL single product page shows the issue.

Kindly advise how to fix the RTL product page to be one column same as original LTR product page.

Thanks

[vivian123]

vivian123

#291662

Hello Chito,

I don’t use any plugin, Kadence blocks and the adv Query loop. If you mean custom post plugin, ACF.
Exactly as you show in the video but with one column.
So, I will try the two columns solution.
Thank you !

• This reply was modified 1 year, 5 months ago by vivian123.

[Kim]

Kim

#291515

I am not sure how to explain what I want to do. I have two row layout. Both rows have three columns of different widths.
Attached is an example of what I am working on.

These are currently images within each block. Not background images.

I have a few questions.

#1 What size I need to make the images for each of the three blocks in order for them to line up correctly.

#2 How to I make it so the top row and the bottom row meet in the middle and the images are perfect like they are in my example.

Oddly I have this on 2 different pages and on one page they meet perfectly on the 2nd page there is horizontal spacing that I cannot find.

More importantly, am I better off using background images to keep the images in line on the top and bottom?

Thank you for your time.

[Kim]

Kim

#291515

I am not sure how to explain what I want to do. I have two row layout. Both rows have three columns of different widths.
Attached is an example of what I am working on.

These are currently images within each block. Not background images.

I have a few questions.

#1 What size I need to make the images for each of the three blocks in order for them to line up correctly.

#2 How to I make it so the top row and the bottom row meet in the middle and the images are perfect like they are in my example.

Oddly I have this on 2 different pages and on one page they meet perfectly on the 2nd page there is horizontal spacing that I cannot find.

More importantly, am I better off using background images to keep the images in line on the top and bottom?

Thank you for your time.

[chitocamacho]

chitocamacho

#291459

Hi Sara,

Glad to hear you were able to sort this.

Technically, the header and footer work almost the same, even if the footer has an option for number of columns.

The footer has a maximum of 5 columns. If you try to drag and drop the header widgets, you’d see there can be up to 5 columns as well. Here’s a video: https://share.zight.com/NQu9x8zv

Both can also have one column.

Additionally, we will launch the Advanced Header / Navigation block this week, which has the ability to have only one column or more and customize it further. Here’s an example: https://share.zight.com/v1uqLXJx

Please let me know how I can assist further.

Best,
Chito

[Sara]

Sara

#291443

Ok, after a more tinkering, I realized when I put everything in the middle column then it all centers and fills the full width of the browser window, which solves my issue.

Just out of curiosity, is there a reason why I can choose the number of columns in the footer but not the header?

Thanks!

[Sara]

Sara

#291442

Hi there,

I want to have the header main row be just one column, not three – is this possible? I can do this in the footer but, in the header, I’m forced to use three columns. This is causing my menu to not display properly. Here’s a screenshot of the Customize screen to show what I’m seeing.

Thanks!
Sara

[Sara]

Sara

#291442

Hi there,

I want to have the header main row be just one column, not three – is this possible? I can do this in the footer but, in the header, I’m forced to use three columns. This is causing my menu to not display properly. Here’s a screenshot of the Customize screen to show what I’m seeing.

Thanks!
Sara

[TomH]

TomH

#291268

I did a bit of coding and arrived at this:

PHP

/**
 * Add subcategory links to parent category pages
**/
 

function display_subcategories_after_description() {
    if (is_product_category()) {
        $term = get_queried_object();
        $args = array(
            'child_of' => $term->term_id,
            'taxonomy' => 'product_cat',
            'hide_empty' => false,
        );
        $subcategories = get_terms($args);
        
        if ($subcategories) {
            echo '<div class="subcategory-list">';
            foreach ($subcategories as $subcategory) {
                echo '<a href="' . get_term_link($subcategory) . '" class="subcategory-item">';
                echo '<div>' . $subcategory->name . '</div>';
                echo '</a>';
            }
            echo '</div>';
        }
    }
}
add_action('woocommerce_before_shop_loop', 'display_subcategories_after_description');

CSS

/*Woocommerce subcategory list on category page styling*/
.subcategory-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 20px 0;
}

.subcategory-item {
    flex: 1 0 18%;
    max-width: 18%;
    box-sizing: border-box;
    margin: 10px;
    background-color: var(--global-palette9);
    padding: 20px;
    text-align: center;
    border-radius: 0;
    border: 2px solid var(--global-palette9);
    transition: background-color 0.3s ease;
    text-decoration: none; /* Remove underline */
    color: var(--global-palette4); /* Text color */
    font-weight: bold; /* Bold text */
}

.subcategory-item:hover {
    background-color: var(--global-palette8);
}

/* Mobile Styles */
@media (max-width: 768px) {
    .subcategory-list {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

    .subcategory-item {
        flex: none; /* Disable flex properties */
        max-width: 100%;
        padding: 10px; /* Reduce padding */
        font-size: 14px; /* Smaller font size */
    }
}

[JZ]

JZ

#291262

how do i create a row with 4 columns in and a background image with text over the top linking to an article or page?

something like the example i’ve uploaded, but the images would all be the same size obviously and the text would as well and it would line up

[JZ]

JZ

#291262

how do i create a row with 4 columns in and a background image with text over the top linking to an article or page?

something like the example i’ve uploaded, but the images would all be the same size obviously and the text would as well and it would line up