Display one row in Services Widget

[Elaina]

Hi,

Currently, the theme is showing 2 rows of services with 3 columns on the front page. How can I change it to only show one row?

Thanks in advance 🙂

[Rabindra Tharu]

Hi, Elaina

We have this features in our pro version of the theme. So either you have to use our pro version of theme or you can customize the theme js file but be sure you modify it by creating a child theme.

Thanks!

[Elaina]

When I created a child theme using the Orbisius Child Theme creator plugin, it changed the fonts. Is there a child theme plugin that you would recommend?

Thanks so much for all your help 🙂

[Elaina]

Also, what is the name of the js file or where can I find it in Editor? There is quite a few.

[Rabindra Tharu]

Hi, Elaina

Personly I used Child Theme Configurator plugin for creating a child theme.

Our theme js is located in custom.js file inside js folder. Just to service slider part and changed slidesPerColumn: 1,

Thanks!

[Elaina]

Hi Rabindra,

I have made some changes to the custom.js file, but I can’t see any changes. Have I done something wrong? This is what the code currently looks like:

// Service Slider
jQuery(‘.pt-service-section’).each(function(index, element){
var container = jQuery(this).find(‘.pt-services-slider’);
var slideCount = jQuery(this).find(‘.swiper-slide’).length;
var nextButton = jQuery(this).find(‘.pt-more-arrow .pt-arrow-right’);
var prevButton = jQuery(this).find(‘.pt-more-arrow .pt-arrow-left’);

if ( slideCount < 3 ) {
var courtyard_services_slider_per_col = 1;
}
if ( slideCount >= 3 ) {
var courtyard_services_slider_per_col = 1;
}
if ( courtyard_window_width <= 580 ) {
var courtyard_services_slider_per_col = 1;
}

var pt_services_slider = new Swiper(container, {
nextButton: nextButton,
prevButton: prevButton,
spaceBetween: 0,
preventClicks: false,
slidesPerView: courtyard_services_slider_num,
slidesPerColumn: courtyard_services_slider_per_col,
touchEventsTarget: ‘swiper-wrapper’,
speed: 800
});
});

[Rabindra Tharu]

Hi, Elaina

The code seems fine for me. Could you please clear your browser cache and check it once.
Have you made a child theme and changed the code or directly you apply in the main theme js file.

Thanks!

[Elaina]

Hi Rabindra,

I couldn’t find the js file once I created the child theme and had to change it in the parent. Is that wrong?

Sorry, I’m still learning about child themes

[Elaina]

It seemed like the cache just needed time to be refreshed. It’s working now 🙂

[Rabindra Tharu]

Hi, Elaina

Ya, or you can do it by hard refresh with pressing the button ctrl+alt+r key.

Thanks!

[Elaina]

Thanks! I’ve actually tried it now a few times but it doesn’t seem to do anything when I press the combination. Is it the same as pressing F5 on my keyboard?

[Elaina]

Hi, after I’ve done a theme update, the custom.js file changed back to having two columns in the services section. I tried to copy the old code and also tried editing the new code, but nothing seemed to work. I’ve also done a hard refresh and cleared the cache. Do you perhaps have another solution to only display one row of the services?
Thanks in advance 🙂

[Rabindra Tharu]

Hi @Elaina,

Sorry for the delayed reply, are you still facing the above issue on your site?

Thanks!

[Elaina]

Hi Rabindra,
Yes I am. I would appreciate your help 🙂

[Rabindra Tharu]

Hi @Elaina,

Could you please allow us your site URL.

Thanks!

[Author]

Posts