Client carousel

[pbi design]

Since all the carousel assets are for very specific purposes, I need to modify the following in the client carousel:
1. I would like to show fewer items at a time – 4 or 5 instead of 6.
2. remove the grey frame and the black frame hover
3. can the client link stay in the same window instead of opening in a new window? I am using the client carousel to link to other pages in my site

thank you

[laranz – SUPPORT]

Hi,

1. If you put that in a 3/4 column it will display 4 columns instead of 6.
2. Put this in the Custom CSS.

.client-item figure { border: none; }

3. Open up \themes\dante\swift-framework\page-builder\builder\shortcodes\clients.php and in line #98 remove this

target="_blank"

Let me know, what you got.

Thanks,
laranz.

[pbi design]

so the border and target window issues are now resolved (thanks!),

but I would like to have the client carousel take up the full width of the page and still display 4 or 5 columns instead of 6. How can I modify that? If I can do it in the clients.php file, can you show me where I can specify how many columns and the client width and height, or will the client element resize if there is 4 or 5 columns?

[laranz – SUPPORT]

Hi,

Glad it solves.. 🙂

Edit it like this http://take.ms/oIbR2

add a line like this $columns = 4; then change the span2 to span3.

Let us know,

Thanks,
laranz.

[pbi design]

that worked! I now have four columns, but there seems to be a lot of “padding” between the icons. I have attached a screen shot. Can I change the max image size? In case that’s too huge, can I simply have 5 columns or is that not feasible? Could you show me how to make the edits for both scenarios – 4 columns with a larger image size or 5 columns?

Much appreciated.

Attachments:

You must be logged in to view attached files.

[laranz – SUPPORT]

Hi,

It aligns with the grid so 5 is not possible. If you want to change the width of the image you can see this line in that file

$client_width = 200;
$client_height = 200;

adjust it according to your needs.

Let us know,

Thanks,
laranz.

[pbi design]

Hi laranz.

I tried changing the client width and height as suggested. I even uploaded a larger image (250px) but it doesn’t change the width of the image in the carousel. What next?

thanks,
Rossitza

[pbi design]

forgot to mention…. even with the default client width and height of 200, the images are actually displaying at 150px.

[laranz – SUPPORT]

Hi,

Could you able to pass me the WP login details ( pass through private reply ), and then install a plugin called WPIDE so that I can see the codes.

Let us know,

Thanks,
laranz.

[pbi design]

This reply has been marked as private.

[laranz – SUPPORT]

Hi,

I added a Custom CSS to fix that height issue, but if you remove the margins it looks like a fifth picture is there, if you still want it, add this in the Custom CSS

.carousel-wrap .carousel-items > li {
    margin-left: 0 !important;
}

Let us know,

Thanks,
laranz.

[pbi design]

Hi laranz,

thanks for the fix! I think the margins are fine as is now, so I won’t be touching that. One last thing on the carousel: how can I remove the opacity that is there by default? I would like to have the images at 100%, like they are on mouse over.

thanks again,
Rossitza

[laranz – SUPPORT]

Hi,

Okay, nice.. If you want to keep 100% opacity use this Custom CSS.

Let us know,

Thanks,
laranz.

[laranz – SUPPORT]

Hi,

Oops forget to give the CSS.

.client-item figure { opacity: 1; }

Let us know,

Thanks,
laranz.

[pbi design]

Hi Laranz,

it’s working great now on a desktop screen, but on a mobile (in portrait and landscape orientation) the images are small or the space between them is very large. Is there a way to specify the size of the images for mobile viewing so it looks better? On portrait viewing it shows just one, which is fine, but it should be larger, full size 250px. And on landscape, there is so much space between that it would look better if it was showing three columns. Is that feasible? Here are the screen shots.

thanks,
Rossitza

Attachments:

You must be logged in to view attached files.