[James Lee]

I have tried everything and I cannot seem to get the business name below the logo. Could you help me?

[Steven Zahm]

@ James

re: I have tried everything and I cannot seem to get the business name below the logo. Could you help me?

Sorry, but with Gridder, the name will overlay the image. You can try to use some custom CSS to override it but I am not sure the results will be acceptable. If you wish to give it a try, add the following to the theme’s custom CSS area:

#cn-gridder span.cn-gridder-overlay {
    position: relative !important;
    margin-bottom: 20px !important;
    display: block;
}

[James Lee]

I am not talking about when you hoover of the picture.

Take a look at your samples

https://connections-pro.com/add-on/gridder/

See how the name of the agent is under his picture. I want to do the same thing with our directory

http://www.rcoc.com/memership-directory/

I only see business logos and no name of the organization appear below like your sample.

PLEASE HELP

[Steven Zahm]

@ James

re: I am not talking about when you hoover of the picture. Take a look at your samples See how the name of the agent is under his picture. I want to do the same thing with our directory

The name is actually overlaying the image, it is not below it. See Demo 1 and Demo 2. There you can see the images are pretty much the same size. When mouseover the images in Demo 2 you’ll see the name overlay is in the same position, which is, overlaying the image beneath it.

re: I only see business logos and no name of the organization appear below like your sample.

This is the default behavior, to show the name. You configured the template to only display the name when you mouse over it as seen in the Demo 2. Demo 1 shows how it the template template is confgured by default for the name overaly, just with a different color shown on the Gridder template product page

All that said… what you need to do is remove overlay=hover from the Connections shortcode.

Hope that helps.

[James Lee]

aw I see, ok two questions
1. How do I make the font smaller and not bold)
2. How do I remove the + on every word?

[Steven Zahm]

@ James

re: 1. How do I make the font smaller and not bold)
2. How do I remove the + on every word?

This can only be done with custom CSS to override the template’s default styling. Add the following to the theme’s custom CSS area:

#cn-gridder .cn-gridder-overlay span.fn, #cn-gridder .cn-gridder-name span.fn {
    font-size: 12px !important;
    font-weight: normal !important;
}
#cn-gridder .cn-gridder-toggle.cn-gridder-toggle-top-right {
    display: none !important;
}

Hope that helps!

[James Lee]

Perfect, this is great I appreciate your quick response.

Two more request
1. Can the text be centered?
2. How do I move the text down little bit to showcase the logos?

[Steven Zahm]

@ James

re: Can the text be centered?

Use this CSS:

#cn-gridder .cn-gridder-overlay {
    text-align: center;
}

re: How do I move the text down little bit to showcase the logos?

Not possible, will it is, be not easily. Upload you logos with more white space on the bottom.

[Author]

Posts