Features list - remove text at end of paragraph + icon clickable

Support
#1

We are using the following JS code to make the title and feature list icon clickable, and to remove the the link at the end of the paragraph.

jQuery(function($) {
$(’.x-feature-box-text a:last-child’).each(function() {
$(this).closest(’.x-feature-box’).find(’.x-feature-box-graphic’).wrap(’’);
$(this).closest(’.x-feature-box’).find(’.x-feature-box-title’).wrap(’’);
$(this).remove();
});
});

This code works, but it loads a bit janky and we would like to do this in the child theme and not thorugh JS. Any counsel would be greatly appreciated. Private note attached withe more details.

#2

Hi there,

The problem that you are experiencing is because of the Custom CSS code. It wraps the anchor tag around the Title and the images. It breaks the original code and that is why the vertical alignment is not working.

I suggest that you replace the custom code with the Javascript code below:

jQuery('.speciallist > li').each(function() {
	var theHref = jQuery(this).find('.x-feature-box-content .x-feature-box-text a').attr('href');
	jQuery(this).find('.x-feature-box-graphic img').on('click', function() {
		window.location.href = theHref;
	});
	jQuery(this).find('.x-feature-box-title').on('click', function() {
		window.location.href = theHref;
	});
});

and also add the CSS code below to X > Theme Options > CSS:

.speciallist .x-feature-box-graphic img,
.speciallist .x-feature-box-title {
	cursor: pointer;
}

.speciallist .x-feature-box-title {
    display: inline-block;
}

.speciallist .x-feature-box-content .x-feature-box-text a {
    display: none;
}

Please make sure that you add the speciallist class to the Class option of the Feature List Main Options Section:

That should do the trick for you. Thank you.

#3

WORKED! Thanks! When will this be made standard in Pro?

#4

Hi there,

There is no plan to have such a feature in our Pro theme. We can add this as a feature request in our issue tracker if you are interested.

The feature requests are assessed by our development team and if it is feasible and there are enough requests for the request it will be considered to be implemented.

Thank you.

#5

The code APPEARED to work, but the list items are actually not clickable. Please see link from private note.

#7

Hi,

There is a syntax error in your js Code.

Please remove this code in Theme Options > JS

.speciallist .x-feature-box-graphic img,
.speciallist .x-feature-box-title {
	cursor: pointer;
}

.speciallist .x-feature-box-title {
    display: inline-block;
}

.speciallist .x-feature-box-content .x-feature-box-text a {
    display: none;
}

It shoud be added in Theme Options > CSS

Thanks

#8

Ah… user error on my part. That certainly did not look like JS lol Thanks!

#9

Glad to hear it’s sorted.

Cheers!

#10

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.