[astuteimageParticipant]

Hello!

I am using the integrity stack here. I love xtheme so far. Just trying out conrnerstone for the first time and it is having some weird results.

I am using an IDX plugin to display home listings inside of the Cornerstone Tab element. They are supposed to display in a grid format. instead they are stretching to fill the entire tab container. I have tried adjusting the width of the container, floating, wrapping the IDX shortcode in its own Div with style modifications and nothing has worked. Is there anything anyone might advise?

http://xenb4.hosts.cx/anthem-nv-homes-for-sale/

[astuteimageParticipant]

Ok so on the page i tried to add another section below the tabbed section.

I added a raw content element and pasted the idx shortcode in there. That one was stretched out but the one in the tabbed section was displaying normally. Very strange. Any thoughts are appreciated.

[astuteimageParticipant]

it happens even when it is not in the tabbed element

[Rue NelModerator]

Hello There,

Thanks for writing in! Upon checking on the url you shared, it is no longer displaying your site. Would you mind activating again the temporary url of your site? This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

Thank you.

[astuteimageParticipant]

Hey thank you so much for your reply. I am very frustrated haha.

here is the url
http://yv8h2.hosts.cx/anthem-nv-homes-for-sale/

[Rue NelModerator]

Hello There,

Thanks for the updates!

Upon checking your site, there are JS error showing in the console. http://prntscr.com/8ppvwa
Can you please test for a plugin conflict? You can do this by deactivating all third party plugins, and seeing if the problem remains. If it’s fixed, you’ll know a plugin caused the problem, and you can narrow down which one by reactivating them one at a time.

Please let us know how it goes.

[astuteimageParticipant]

Ok. well I do know that those listings are a plugin. so I cant really deactivate it to test. The plugin sure does use JS to show the listings on the page. I overcame the issue by implementing some custom CSS here:

.ihf-grid-result.col-xs-12 {
float: left !important;
max-width: 32%;
margin-left: 1%;
}

but even with this css the true sizes do not appear until I inspect element in chrome. With these rules there should be three listings per row. When I load the page there are two listings per row, but when I inspect element it detects the true rules and becomes three listings per row.

I will go attempt the deactivation of certain plugins to see if that fixes it. I cannot deactivate the Optima Express plugin though as that is the one that produces the listing on the page.

[astuteimageParticipant]

I deactivated all plugins until the only two that remained active were Optima Express and Cornerstone. I absolutely need to figure out how to make this work as Optima Express is the leading IDX plugin that my clients enjoy and myself and my development team love using Xtheme now that we have given it a try. We do not want to ever go back to Genesis lol.

[RadModerator]

Hi there,

The grid is based on resize event in which it calculates the width of its container to compose its grid size (not just css). Since tabs are hidden element (unless active), then it’s probably computed the width as null, thus no columns.

When you inspect the element, it triggers the resize event which fixes it. What you need to do is trigger the resize event on tab selection and on load.

Add this code at Admin > Appearance > Customizer > Custom > Javascript.

jQuery ( function( $ ) {

$(window).on('scroll', function() { $( this ).trigger('resize'); } );

$(document).ready( function() {

setTimeout( function() { $( window ).trigger('resize'); }, 300 );

} );

} );

But, this might not work since your plugin is throwing error that could affect this. That error should be fix first, there should be a way to disable maps from your since it can be available from other source like the theme.

Thanks.

[astuteimageParticipant]

the map is generated from the plugin. I will try adding the js and see what happens. .

[astuteimageParticipant]

yeah that one did not work.

[astuteimageParticipant]

it also does not work when disabling the map. Im pretty bummed out about this. What is in the theme that is generating a JS error? I use this plugin on many theme with zero issue.

I will just have to build css and media queries to provide my own sizing parameters. Really a shame that I also need to include this css for every single page and not just global stylesheet. Cornerstone is becoming quite cumbersome

[JackKeymaster]

Hi there!

We’d love to get this working for you, so you can X, can you post your WP admin details and FTP in a private reply please so we can debug this for you and see if there’s any workaround. 🙂

Also did it work without any problems if you use the Twenty Fifteen theme?

Thank you!

[astuteimageParticipant]

This reply has been marked as private.

[astuteimageParticipant]

This reply has been marked as private.

[Author]

Posts