Just customise and add the template files from wpcarmanager to your theme folder see documentation. If your theme supports a populair responsive framework it’s very easy to do by just simple change some css classes!
-
This reply was modified 9 years, 4 months ago by
Patrick.
Thread Starter
kenai7
(@kenai7)
Can someone please help me modifying the template files/css styles to list the cars horizontally with 3 columns? Would be much appreciated!
If you post a link to your website maybe than people here on the support or forums can help you out!
Thread Starter
kenai7
(@kenai7)
My website is yet to be released, so i can’t post a link.
Anyway, using github and the users of your awesome plugin may know the solution 🙂
Can I request a horizontal view update for the next release trough the forums?
Thanks.
can you be more descriptive please?
“Just customise and add the template files from wpcarmanager to your theme folder see documentation. If your theme supports a populair responsive framework it’s very easy to do by just simple change some css classes!”
What templates and does this plugin have its own css files or can i add the css required for this to my theme custom css area?
to be honest the documentation is rather poor on instructions for something you claim to be a simple process.
I dont want to rush out and pay money on something else as i feel this will do the job nicely, i just want the listings to display inline across page not up and down.
site url
http://garage.websites4smallbiz.co.uk
thanks 🙂
This will go in your child theme… and you will need to edit the thumbs generation to make it look OK.
/*--------------------------------------------------*/
/*------------[Horizontal Car Layout]---------------*/
/*--------------------------------------------------*/
/*------[Change the image size in wp-car-manager/src/Plugin.php]----------*/
/*------[Regenerate thumbs after you change the size. I used 250px]-------*/
@media only screen and (min-width: 960px){
/*---[Make sure to change your page ID number to the page you want to change]-----*/
.page-id-41 li.wpcm-listings-item {
display:inline;
float: left;
width: 25%; /*------------[use 33.3 if you want 3 wide]---------------*/
}
.page-id-41 .wpcm-vehicle-listings .wpcm-vehicle-results-wrapper .wpcm-vehicle-results li.wpcm-listings-item a .wpcm-listings-item-description {
display: none; /*------------[hide Listing info]---------------*/
}
.page-id-41 .wpcm-vehicle-listings .wpcm-vehicle-results-wrapper .wpcm-vehicle-results li.wpcm-listings-item a .wpcm-listings-item-meta {
width: 100%;
padding-left: 1em;
text-align: left;
float: left;
}
.page-id-41 .wpcm-title {
display: inline !important; /*------------[Display title]---------------*/
width: 100%;
}
.page-id-41 .wpcm-vehicle-listings .wpcm-vehicle-results-wrapper .wpcm-vehicle-results li.wpcm-listings-item a {
padding-left: 0px;
}
/*------------[Makes the image larger]---------------*/
.page-id-41 .wpcm-vehicle-listings .wpcm-vehicle-results-wrapper .wpcm-vehicle-results li.wpcm-listings-item a .wpcm-listings-item-image-wrapper {
width: 95%;
height: auto;
position: relative;
}
}
}
/*--------------------------------------------------*/
/*--------[End Horizontal Car Layout]---------------*/
/*--------------------------------------------------*/
