How to make transparent image (png) in thumbnails?

Hi

I have new problem... How to change jpg image in NSP to png with transparent background? White backround is not good on my site:-) See in attachment...

Thanks for help

What is the data source for your module as NSP does keep png transparency.

Its K2, but i change any jpg on png format in code K2 like in this forum topic: http://community.getk2.org/forum/topics/pngs-transparency-not.

NSP convert image on jpg file? From NSP take thumbnails image? From K2?

On my page in k2 image have png format with transparency.

http://eclipse-sound.com/

Thank for reply and help.
Best regards

Easy way to do is do not use image tab in K2 Item but use image option in WYSIWYG editor buttons itself and add the image before text. This way you can see NSP keeps transparency of PNG files.

See you around...

For me is good way, but my client want simple add image in k2 option. When I add image use WYSIWYG editor buttons, image not display in category K2 ex. Is there any way. With change code k2 or gavick NSP?

Plese help is very important to me:-)

Ok so after you have made changes into K2 code then you have used image function in K2 and uploaded a png file , what was the final result of file extension in k2 cache after it has converted.

This needs few testing so no promises but I ll take a look into NSP code to see if anything I can do.

See you around...

Yes. I have reupload image from k2 item. When i reupload - images have transparent background. From now are png files.

Thanks

Just to inform you i have made few attempts on this and still working/testing on it. I ll post my findings in here.

See you around...

Just to inform you i have made few attempts on this and still working/testing on it. I ll post my findings in here.

See you around...

Hi. Any good news in my problem?

I have spend limited time on this and k2 does not show the image in full item view despite changes so i left it at that i am afraid as i was very limited with time.

I have spend limited time on this and k2 does not show the image in full item view despite changes so i left it at that i am afraid as i was very limited with time.

Ok. Big thanks for help anyway. I try do this, after hours. If i resolve this problem, i wrote in this topic. Once more thanks.

PS. If i try send ticket, coder help me with this? I have developer account.

Make following jpg to png changes.
Find File: \administrator\components\com_k2\models\items.php
Change following jpg to png

Code: Select all

   Line 441:          $sourceImage = JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'src'.DS.md5("Image".$item->id).'.jpg';
   Line 442:          $sourceImageXS = JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$item->id).'_XS.jpg';
   Line 443:          $sourceImageS = JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$item->id).'_S.jpg';
   Line 444:          $sourceImageM = JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$item->id).'_M.jpg';
   Line 445:          $sourceImageL = JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$item->id).'_L.jpg';
   Line 446:          $sourceImageXL = JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$item->id).'_XL.jpg';
   Line 447:          $sourceImageGeneric = JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$item->id).'_Generic.jpg';
   Line 487:          JFile::copy($sourceImage, JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'src'.DS.md5("Image".$row->id).'.jpg');
   Line 489:          JFile::copy($sourceImageXS, JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$row->id).'_XS.jpg');
   Line 491:          JFile::copy($sourceImageS, JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$row->id).'_S.jpg');
   Line 493:          JFile::copy($sourceImageM, JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$row->id).'_M.jpg');
   Line 495:          JFile::copy($sourceImageL, JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$row->id).'_L.jpg');
   Line 497:          JFile::copy($sourceImageXL, JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$row->id).'_XL.jpg');
   Line 499:          JFile::copy($sourceImageGeneric, JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$row->id).'_Generic.jpg');
   Line 628:          if (JFile::exists(JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'src'.DS.md5("Image".$row->id).'.jpg')) {
   Line 629:             JFile::delete(JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'src'.DS.md5("Image".$row->id).'.jpg');
   Line 631:          if (JFile::exists(JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$row->id).'_XS.jpg')) {
   Line 632:             JFile::delete(JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$row->id).'_XS.jpg');
   Line 634:          if (JFile::exists(JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$row->id).'_S.jpg')) {
   Line 635:             JFile::delete(JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$row->id).'_S.jpg');
   Line 637:          if (JFile::exists(JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$row->id).'_M.jpg')) {
   Line 638:             JFile::delete(JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$row->id).'_M.jpg');
   Line 640:          if (JFile::exists(JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$row->id).'_L.jpg')) {
   Line 641:             JFile::delete(JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$row->id).'_L.jpg');
   Line 643:          if (JFile::exists(JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$row->id).'_XL.jpg')) {
   Line 644:             JFile::delete(JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$row->id).'_XL.jpg');
   Line 646:          if (JFile::exists(JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$row->id).'_Generic.jpg')) {
   Line 647:             JFile::delete(JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$row->id).'_Generic.jpg');


Find File: \administrator\components\com_k2\models\item.php
Change following jpg to png

Code: Select all

   Line 215:             $handle->image_convert = 'jpg';
   Line 228:             $handle->image_convert = 'jpg';
   Line 244:             $handle->image_convert = 'jpg';
   Line 260:             $handle->image_convert = 'jpg';
   Line 276:             $handle->image_convert = 'jpg';
   Line 292:             $handle->image_convert = 'jpg';
   Line 308:             $handle->image_convert = 'jpg';
   Line 332:          if (JFile::exists(JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'src'.DS.$filename.'.jpg')) {
   Line 333:             JFile::delete(JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'src'.DS.$filename.'.jpg');
   Line 336:          if (JFile::exists(JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.$filename.'_XS.jpg')) {
   Line 337:             JFile::delete(JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.$filename.'_XS.jpg');
   Line 340:          if (JFile::exists(JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.$filename.'_S.jpg')) {
   Line 341:             JFile::delete(JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.$filename.'_S.jpg');
   Line 344:          if (JFile::exists(JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.$filename.'_M.jpg')) {
   Line 345:             JFile::delete(JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.$filename.'_M.jpg');
   Line 348:          if (JFile::exists(JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.$filename.'_L.jpg')) {
   Line 349:             JFile::delete(JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.$filename.'_L.jpg');
   Line 352:          if (JFile::exists(JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.$filename.'_XL.jpg')) {
   Line 353:             JFile::delete(JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.$filename.'_XL.jpg');
   Line 356:          if (JFile::exists(JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.$filename.'_Generic.jpg')) {
   Line 357:             JFile::delete(JPATH_ROOT.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.$filename.'_Generic.jpg');


Find File: \administrator\components\com_k2\views\item\view.html.php
Change following jpg to png

Code: Select all

   Line 337:       if (JFile::exists(JPATH_SITE.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$item->id).'_L.jpg')){
   Line 338:          $item->image = JURI::root().'media/k2/items/cache/'.md5("Image".$item->id).'_L.jpg'.$timestamp;
   Line 341:       if (JFile::exists(JPATH_SITE.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$item->id).'_S.jpg')){
   Line 342:          $item->thumb = JURI::root().'media/k2/items/cache/'.md5("Image".$item->id).'_S.jpg'.$timestamp;


Find File: \components\com_k2\models\item.php
Change following jpg to png

Code: Select all

   Line 118:       if (JFile::exists(JPATH_SITE.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$item->id).'_XS.jpg')){
   Line 119:          $item->imageXSmall = JURI::base(true).'/media/k2/items/cache/'.md5("Image".$item->id).'_XS.jpg';
   Line 125:       if (JFile::exists(JPATH_SITE.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$item->id).'_S.jpg')){
   Line 126:          $item->imageSmall = JURI::base(true).'/media/k2/items/cache/'.md5("Image".$item->id).'_S.jpg';
   Line 132:       if (JFile::exists(JPATH_SITE.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$item->id).'_M.jpg')){
   Line 133:          $item->imageMedium = JURI::base(true).'/media/k2/items/cache/'.md5("Image".$item->id).'_M.jpg';
   Line 139:       if (JFile::exists(JPATH_SITE.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$item->id).'_L.jpg')){
   Line 140:          $item->imageLarge = JURI::base(true).'/media/k2/items/cache/'.md5("Image".$item->id).'_L.jpg';
   Line 146:       if (JFile::exists(JPATH_SITE.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$item->id).'_XL.jpg')){
   Line 147:          $item->imageXLarge = JURI::base(true).'/media/k2/items/cache/'.md5("Image".$item->id).'_XL.jpg';
   Line 153:       if (JFile::exists(JPATH_SITE.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$item->id).'_Generic.jpg')){
   Line 154:          $item->imageGeneric = JURI::base(true).'/media/k2/items/cache/'.md5("Image".$item->id).'_Generic.jpg';
   Line 292:       if ($params->get('feedItemImage') && JFile::exists(JPATH_SITE.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$item->id).'_'.$params->get('feedImgSize').'.jpg')){
   Line 293:          $item->description.= '<div class="K2FeedImage"><img src="'.JURI::base(true).'/media/k2/items/cache/'.md5('Image'.$item->id).'_'.$params->get('feedImgSize').'.jpg" alt="'.$item->title.'" /></div>';


Find File: \components\com_k2\models\itemlist.php
Change following jpg to png

Code: Select all

   Line 737:                if (JFile::exists(JPATH_SITE.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$item->id).'_XS.jpg'))
   Line 738:                      $item->imageXSmall = JURI::root(true).'/media/k2/items/cache/'.md5("Image".$item->id).'_XS.jpg';
   Line 740:                if (JFile::exists(JPATH_SITE.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$item->id).'_S.jpg'))
   Line 741:                      $item->imageSmall = JURI::root(true).'/media/k2/items/cache/'.md5("Image".$item->id).'_S.jpg';
   Line 743:                if (JFile::exists(JPATH_SITE.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$item->id).'_M.jpg'))
   Line 744:                      $item->imageMedium = JURI::root(true).'/media/k2/items/cache/'.md5("Image".$item->id).'_M.jpg';
   Line 746:                if (JFile::exists(JPATH_SITE.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$item->id).'_L.jpg'))
   Line 747:                      $item->imageLarge = JURI::root(true).'/media/k2/items/cache/'.md5("Image".$item->id).'_L.jpg';
   Line 749:                if (JFile::exists(JPATH_SITE.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$item->id).'_XL.jpg'))
   Line 750:                      $item->imageXLarge = JURI::root(true).'/media/k2/items/cache/'.md5("Image".$item->id).'_XL.jpg';
   Line 752:                if (JFile::exists(JPATH_SITE.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$item->id).'_Generic.jpg'))
   Line 753:                      $item->imageGeneric = JURI::root(true).'/media/k2/items/cache/'.md5("Image".$item->id).'_Generic.jpg';


Find File: \modules\mod_k2_content\helper.php
Change following jpg to png

Code: Select all

   Line 251:                if (JFile::exists(JPATH_SITE.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$item->id).'_XS.jpg')){
   Line 252:                    $item->imageXSmall = JURI::base(true).'/media/k2/items/cache/'.md5("Image".$item->id).'_XS.jpg';
   Line 258:                if (JFile::exists(JPATH_SITE.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$item->id).'_S.jpg')){
   Line 259:                    $item->imageSmall = JURI::base(true).'/media/k2/items/cache/'.md5("Image".$item->id).'_S.jpg';
   Line 265:                if (JFile::exists(JPATH_SITE.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$item->id).'_M.jpg')){
   Line 266:                    $item->imageMedium = JURI::base(true).'/media/k2/items/cache/'.md5("Image".$item->id).'_M.jpg';
   Line 272:                if (JFile::exists(JPATH_SITE.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$item->id).'_L.jpg')){
   Line 273:                    $item->imageLarge = JURI::base(true).'/media/k2/items/cache/'.md5("Image".$item->id).'_L.jpg';
   Line 279:                if (JFile::exists(JPATH_SITE.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$item->id).'_XL.jpg')){
   Line 280:                    $item->imageXLarge = JURI::base(true).'/media/k2/items/cache/'.md5("Image".$item->id).'_XL.jpg';
   Line 286:                if (JFile::exists(JPATH_SITE.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$item->id).'_Generic.jpg')){
   Line 287:                    $item->imageGeneric = JURI::base(true).'/media/k2/items/cache/'.md5("Image".$item->id).'_Generic.jpg';


Find File: \modules\mod_news_pro_gk4\tmpl\layout.parts.php
Change following jpg to png

Code: Select all

   Line 232:       if(JFile::exists(JPATH_SITE.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$news_id).'_L.jpg')){ 
   Line 233:          $img_src = JURI::root().'media/k2/items/cache/'.md5("Image".$news_id).'_L.jpg';
   Line 235:         }elseif(JFile::exists(JPATH_SITE.DS.'media'.DS.'k2'.DS.'items'.DS.'cache'.DS.md5("Image".$news_id).'_S.jpg')){ 
   Line 236:          $img_src = JURI::root().'media/k2/items/cache/'.md5("Image".$news_id).'_S.jpg';


You might also need to use below css as k2 adds white color to image background.

Code: Select all

span.latestItemImage img, span.genericItemImage img, span.userItemImage img, span.itemImage img, span.catItemImage img { background: none; border: none; }


See you around...

You might also need to use below css as k2 adds white color to image background.

Code: Select all

span.latestItemImage img, span.genericItemImage img, span.userItemImage img, span.itemImage img, span.catItemImage img { background: none; border: none; }


See you around...

Which file does the above code go?? please give details, i have done everything else but nothing has changed yet. Could you please tell me where this CSS code has to be inserted?

You can include that css in override.css file which is located in templates/gk_templatename/css/override.css and enable it in template settings > advanced settings > Css override "on".

See you around...

Thing is i'm using a rocket theme template... there is no override directory like that... can i put that in the template.css file of the template? or directly in the module file, but which CSS file? which exact one?

I have a strange issue now.. just one thumb image has a black bg and others are fine.

Depending on which css file loads last add the code in that file.

As for black background on one of the images only, it might be that one item has a different css class, such as leading items etc etc...

See you around...

Hi There,

Thank you for the prompt reply, the one item issue, i got fixed once by editing the code like this:

https://www.gavick.com/forums/news-show-pro-gk4/thumbnail-image-not-transparent-16614.html

but now, that file is not loading, i dont know why, i've cleared the caches and tried to empty joomla cache and also the cache folder inside the module, but i still have the same issue.

If only i can fix this one item issue here, everything else is perfectly set now. please let me know, what i can do next to resolve it. how to completely uninstall and re-install the module, maybe that might help?

Thanks in adv.
Cheers!

Please post a link to your website if it is online so we can see clearly.

See you around...

Please post a link to your website if it is online so we can see clearly.

See you around...

I've got it working by completely re-installing the module and doing the same tweaks i have tried.

Its all good now, i will show it once the website is online. Thanks a lot...

There is one more thing, how can i show an extra field, like you show a category or hits, etc.. using the %EXTRAFIELD, i tried by adding the extra field to an item and typing the name of the field with a "%" in front (%EXAMPLE) but on the front end it just shows what i type. Could you please tell me how i can do this with k2 and this module?

Fields you want has to be prepared in php code to display any output you specify and Its not simple as changing few lines as far as i can see. However they are all related to articles, such as category, id, author etc. What is it you are trying to accomplish?

See you around...

Fields you want has to be prepared in php code to display any output you specify and Its not simple as changing few lines as far as i can see. However they are all related to articles, such as category, id, author etc. What is it you are trying to accomplish?

See you around...

Thanks for the hint, but i dont know which file or code to edit exactly? I just want to show some custom text below the heading before the intro text. These text fields will be changed at times, so it would be very ideal if its the extra fields or if i can add it same way it shows, category, author, etc.. please refer to attached image.

Also a good example is here on this live website, i think they also have done something similar using k2 and news pro.
(See under top trips)
http://www.geckosadventures.com/

I've manage to show the price using k2 Store, but i need to edit the "Price:" this word to "Starting From"

So it will say "Starting From: US $350"

Please

Please post a link to your website so we can make a suggestion.

See you around...