remove vm categorie image so it displays only the tekst as clickable link

Started by thewizzz, May 25, 2015, 17:02:25 PM

Previous topic - Next topic

thewizzz

Hi there :)

Joomla version 2.5.14
Virtuemart version 2.6.17

site live url (where the catagorie images are a problem) http://www.retrogamedealer.com/index.php/nl/consoles

I want the virtuemart categories to be shown as text (clickable links) instead of being shown as tekst + image for a categorie.

Before making this post I already read a lot of topics about this subject, but there no clear answer. I did notice that many moderators suggested to use the firebug tool of firefox to see where to fix this in the code.

So I did use the firebug tool to see where in the code I can edit this. I managed to make the image boxes smaller to a format that it will only show the tekst (clickable link) and not the image below the text.

I changed height 300 to 35 to get this to work.


div.category-view div.spacer {
}
div.spacer {
    position: relative;
    overflow: hidden;
    height: 300px;


Well this solution works fine. I though I fixed it. But now I see that this does not only apply for the categories, but also for the product images (and that is not what I want).

Seems like the rules for these image box sizes on the categories also apply for the product images.




But I only want the categories to be shown as clickable links and not display the image, and NOT the normal products.

any suggestions?

jenkinhill

.category-view .row .category .spacer h2 a img {
   display:none;
}
Kelvyn
Lowestoft, Suffolk, UK

Retired from forum life November 2023

Please mention your VirtueMart, Joomla and PHP versions when asking a question in this forum

thewizzz

Dear jenkinhill.

thanks for your suggestion. I was starting to wonder if I might have done something really wrong in my other posts wich result in the fact that nobody answers to my posts, Guess I just have to be patient :) . your suggestion make my category images dissapear (good thing), but did not adjust the spacer height and other stuff so I would get exactly what I wanted as stated in this post.

But your suggestion did help me a lot. Now I know in what direction I had to look to get it fixed. Havent programmed or looked at codes for over 8 years, so I am very rusty. But I fixed it now and I would like to share my solution in case someone else wants to do the same.

So what I did was:

1: I added a // before this line to disable it
.category-view .row .category .spacer h2 a img{margin-top:6px;max-width:100%;height:auto;}

2: then I added this line below it, this results in the images of the categories not being shown
.category-view .row .category .spacer h2 a img{
  display:none;
}


3: I added a new height for the spacer of the categories:
div.category-view div.spacer{
  height:40px; // added this line to set a new height for the categories
}


4: I adjusted the font size. I put 13px instead of the original 18px
.category-view .row .category .spacer h2 a{font-size:13px;display:block;text-align:center;}

5: I made the font BOLD. I added font-weight:bold; to the line below
.category-view .row .category .spacer h2 a{font-size:13px;display:block;text-align:center;font-weight:bold;}

Now it all seems to be working how I wanted it.


jenkinhill

I hope you used the revised css as an override.  http://docs.virtuemart.net/tutorials/templating-layouts/106-override-vmsite-ltr-css.html

I usually combine css changes with template overrides to have total control over layout, which will not be overwritten by the next VM update.

BTW you should not be using J2.5.14 as that is known to be insecure.  http://forum.virtuemart.net/index.php?topic=118683.0
Kelvyn
Lowestoft, Suffolk, UK

Retired from forum life November 2023

Please mention your VirtueMart, Joomla and PHP versions when asking a question in this forum