Post by hmadawy007 » Thu Apr 16, 2015 1:44 am

how to change category image size

Attachments

cat.jpg

cat.jpg (71.79 KiB) Viewed 3663 times


New member

Posts

Joined
Tue Apr 07, 2015 8:17 pm

Post by shahid21290 » Thu Apr 16, 2015 2:30 pm

admin->setting->image->Category Image Size change here

For quick, professional OpenCart support please email scf8127@gmail.com


User avatar
New member

Posts

Joined
Fri May 03, 2013 8:32 pm

Post by hmadawy007 » Thu Apr 16, 2015 4:33 pm

thanks for help
but after change still does not working

Attachments

setting.png

setting.png (40.43 KiB) Viewed 3654 times


New member

Posts

Joined
Tue Apr 07, 2015 8:17 pm

Post by shahid21290 » Sun Apr 26, 2015 2:06 am

hmadawy007 wrote:thanks for help
but after change still does not working

Then its programming issue, please check code in catalog/conroller/product/category.php line no 143

any other code to replace with

if ($category_info['image']) {
$data['thumb'] = $this->model_tool_image->resize($category_info['image'], $this->config->get('config_image_category_width'), $this->config->get('config_image_category_height'));
} else {
$data['thumb'] = '';
}

For quick, professional OpenCart support please email scf8127@gmail.com


User avatar
New member

Posts

Joined
Fri May 03, 2013 8:32 pm

Post by Helalien » Tue May 05, 2015 4:50 pm

I had this issue myself and have resolved this, this seems to be a CSS issue, go to catalog/view/javascript/bootstrap/css/bootstrap.min.css

If you search for the code below:

.img-thumbnail{
padding:4px;line-height:1.428571429;background-color:#fff;border:1px solid #ddd;border-radius:4px;-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out;display:inline-block;max-width:100%;height:auto
}

If you comment out or remove "max-width:100%;height:auto" the settings in admin/settings category image size will work. You have to play around with the image sizeing as to get the image to display how i wanted i had to change the image dimension size in setting as you would normally but the image size is different to the image size used to get it to display how i wanted, this however does not display well on the mobile site.

The other option which i am currently using is in the same CSS file, search:
.col-sm-2{
}
and add: margin-bottom:20px;

so it displays:
.col-sm-2{
margin-bottom:20px;
}

This puts the category description below the category image and means you can use a much wider image and this displays correctly on the mobile site

I wrote my own VQmod to replace this whole css file with my own so as not to alter any core files or you can alter the code directly.

I am using opencart version 2.0.1.1

Newbie

Posts

Joined
Tue May 05, 2015 4:41 pm

Post by dbrooksuk » Wed May 27, 2015 6:02 am

Thank you for your solution. I have removed the height wiidth line so the image resizes correctly but I'm having no luck with the image description which now sits across the top of the correctly sized image. I am using 2.02.

Any help would be appreciated.

New member

Posts

Joined
Mon Jun 13, 2011 5:31 pm

Post by viethemes » Wed May 27, 2015 10:02 pm

Could you provide your site URL, so we can take a look at the problem closers?

http://www.viethemes.com - OpenCart turtorials, news, tips and stricks, extension

Our extensions:
Visual Theme Editor - Powerful tool for customizing style of any theme visually
Live Theme Editor - Customize layout, colors, backgrounds, fonts of the default theme
Theme Animation - Animation Editor for any theme

Extra Positions PRO, Custom JavaScript, Custom CSS and others


User avatar
Active Member

Posts

Joined
Thu Jan 08, 2015 12:17 pm


Post by dbrooksuk » Wed May 27, 2015 10:21 pm

The website is currently viewable here:

http://judesemporium.co.uk/index.php?ro ... path=25_32

but I will be putting it into back into maintenance mode later this evening as you can see it is a work in progress.

Ignore the error on the homepage, I am trying to get a %off mod to work on featured/specials/latest as well as the products page.

New member

Posts

Joined
Mon Jun 13, 2011 5:31 pm

Post by alber99 » Fri Aug 07, 2015 12:03 am

dbrooksuk wrote:Thank you for your solution. I have removed the height wiidth line so the image resizes correctly but I'm having no luck with the image description which now sits across the top of the correctly sized image. I am using 2.02.

Any help would be appreciated.
Had same problem. Instead of editing the CSS, the solution that worked for me is:

Bootstrap uses a 12 column responsive grid. You can change (widen) the Bootstrap column sizes as follows:

catalog>view>theme>yourtheme>template>product>category.tpl

at about line 21:

original code looks like this:

<div class="col-sm-2"><img src="<?php echo $thumb; ?>" alt="<?php echo $heading_title; ?>" title="<?php echo $heading_title; ?>" class="img-thumbnail" /></div>
<?php } ?>
<?php if ($description) { ?>
<div class="col-sm-10"><?php echo $description; ?></div>

change code to this:

<div class="col-sm-3"><img src="<?php echo $thumb; ?>" alt="<?php echo $heading_title; ?>" title="<?php echo $heading_title; ?>" class="img-thumbnail" /></div>
<?php } ?>
<?php if ($description) { ?>
<div class="col-sm-9"><?php echo $description; ?></div>

cheers!

New member

Posts

Joined
Sun Apr 08, 2012 9:14 am
Who is online

Users browsing this forum: No registered users and 24 guests