Spacing of products and categories
- GK User
- Mon Sep 12, 2016 9:51 am
http://valkyri.co.za/store
On this particular page of the site i have my categories floated right with a width of 75%.
I did this so that my CherryPicker filter would fit in on the left side.
The problem I have encountered now is that the css i set for the categories also affects my products causing them to be floated right and 75% wide.
Removing the float:right, width:75% causes some styling called "store" to then take preference making my categories 66.6667% wide.
I have tried several other ways of getting around this problem but I'm not a developer so my solutions are limited to CSS and settings within Joomla.
Ideally i would like the /store landing page to be spaced as is and to have freedom to change the products css in a way that would not affect anything else
On this particular page of the site i have my categories floated right with a width of 75%.
I did this so that my CherryPicker filter would fit in on the left side.
The problem I have encountered now is that the css i set for the categories also affects my products causing them to be floated right and 75% wide.
Removing the float:right, width:75% causes some styling called "store" to then take preference making my categories 66.6667% wide.
I have tried several other ways of getting around this problem but I'm not a developer so my solutions are limited to CSS and settings within Joomla.
Ideally i would like the /store landing page to be spaced as is and to have freedom to change the products css in a way that would not affect anything else
-
- Fresh Boarder
- teitbite
- Thu Sep 15, 2016 11:29 am
Hi
Can You please explain it differently ? With screenshots or something like that ? I'm afraid I do not understand.
Can You please explain it differently ? With screenshots or something like that ? I'm afraid I do not understand.
-
- Moderator
- GK User
- Thu Sep 15, 2016 12:31 pm
I apologise if you went to check the site and it wasn't as I described. I hadn't received a response so i made an effort to fix it myself. With no success.
The 2 images attached show my category and product layout. The category layout is how i want it, however the css that affects my category layout also affects my product layout as you can see in the other image.
Ideally i would like my product to not be constrained by the same css as my category so i can style it how i want it using css.
The 2 images attached show my category and product layout. The category layout is how i want it, however the css that affects my category layout also affects my product layout as you can see in the other image.
Ideally i would like my product to not be constrained by the same css as my category so i can style it how i want it using css.
-
- Fresh Boarder
- GK User
- Thu Sep 15, 2016 11:49 pm
Hi. Sorry if I upset ... I have read your post, and visited your website. I have a question: In what position you add the module that goes left ?, as it is called that module ?, because I wanted to use that same position for a module categories ... thanks, greetings ...
-
- Platinum Boarder
- GK User
- Fri Sep 16, 2016 9:40 am
Its the "sidebar" position.
-
- Fresh Boarder
- GK User
- Fri Sep 16, 2016 12:17 pm
Thank you, vey much, greetings from Italy...
-
- Platinum Boarder
- teitbite
- Sun Sep 18, 2016 1:13 pm
Hi
I think best way would be to add a script to Your site which will recognise what type of virtuemart contnent You are using and depending of what it is to add a class to <body> element. This way You will be able to style categories, category or product page differently.
Add this to /layouts/blocks/head.php
I think best way would be to add a script to Your site which will recognise what type of virtuemart contnent You are using and depending of what it is to add a class to <body> element. This way You will be able to style categories, category or product page differently.
Add this to /layouts/blocks/head.php
- Code: Select all
<script type="text/javascript">(function($) {$(document).ready(function() {
if( $('#gkMainbody > .category-view').size() > 0 ) {
$('body').addClass('vm-categories-layout');
}
if( $('#gkMainbody > .browse-view').size() > 0 ) {
$('body').addClass('vm-category-layout');
}
if( $('#gkMainbody > .productdetails-view').size() > 0 ) {
$('body').addClass('vm-product-layout');
}
});})(jQuery)</script>
-
- Moderator
7 posts
• Page 1 of 1