Are you a GenerateCustomer?

Do you have an active GP Premium or GenerateBlocks Pro license key?

Create a GenerateSupport account for GeneratePress and GenerateBlocks support in one dedicated place.

Create an account
Already have a GenerateSupport account? Login

Just browsing?

Feel free to browse the forums. Support for our free versions is provided on WordPress.org (GeneratePress, GenerateBlocks).

Want to become a premium user? Learn more below.

Horizontal “As Featured In” Logo Scroll

  • Hi!

    I have an “as featured in” section of my website. I want to prominently display all the logos of the brands I work with.

    How can I make this section like a banner where it automatically loops through all the logos (no scrollbars).

    That way I can keep everything on one line. I’m currently using a grid and had to make each container like 15% to fit them all, but this is way too small.

    Thanks!

  • Hi there,

    Do you have a CPT for the brands?

    How are you adding the logos?

  • Currently, I have a bunch of containers within a GB grid. One container for each logo. Each container has an image logo that I’ve uploaded inside it. Is there a better way?

  • 1. If you want to create a loop to automatically add the logos, you need to create a custom post type, and use GB’s image block in a query loop block to dynamically pull the data from the CPT to show the images.

    2. You would need to make that section full width like the section below, so each logo can gets a bit wider.

  • That’s quite complicated for something that seems very simple.

    To be clear, I manually upload the logos.

    Is there no horizontal scrolling effect?

    I don’t care about the automatic horizontal scrolling as much as I do effectively fitting the logos on the screen.

    Is there a best practice with GP/GB to accomplish this some other way?

    Thanks Ying

  • Is there no horizontal scrolling effect?

    I thought you didn’t want to use horizontal scroll based on your original topic:

    How can I make this section like a banner where it automatically loops through all the logos (no scrollbars).

    If you want it to scroll, try this CSS:

    .gb-grid-wrapper.gb-grid-wrapper-99ea9948 {
        overflow-x: scroll;
        flex-wrap: nowrap;
        justify-content: flex-start;
    }
    
    .gb-grid-wrapper.gb-grid-wrapper-99ea9948 > .gb-grid-column {
        width: 20%;
        flex-shrink: 0;
    }
  • Yes I know how to show scrollbars and do it that way. I’m wanting the logos to automatically scroll and loop through.

    Or at the very least to show arrows so that the users can manually click through the loop.

    Just like many major websites do.

  • Or at the very least to show arrows so that the users can manually click through the loop.

    You need custom JavaScript for that.

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.