Gnuru Posted May 2, 2015 Share Posted May 2, 2015 I use several images in pages articles.What I am used to with wordpress, is that wp builds different dimensions of thumbnail images for previewing / inserting into the article. When clicking on an image, you can view the full image.With IPS the image is resized by the client browser and the full image has to be loaded. (Editing the image url in IPS ckeditor by clicking on the image won't save the url to e.g. another full-sized image (uploaded via ftp))This increases loading time for the end users and produces bad page speed rankings because of the need to load the full sized image in articles.What would you suggest for best practice using images in pages articles regarding best user experience and high page-speed scores? Link to comment Share on other sites More sharing options...
opentype Posted May 2, 2015 Share Posted May 2, 2015 … and the full image has to be loaded.Not really. I have been complaining about this problem sind 3.4 and luckily Pages now has max-image dimension settings for image/upload fields.For the editor attachment the global image settings apply and you can also force smaller versions there. Link to comment Share on other sites More sharing options...
Gnuru Posted May 2, 2015 Author Share Posted May 2, 2015 I understand. I think I am doing something wrong:In one of my article posts, I would like to show an infografik, which is quite large due to it's dimensions.If I attach this image to my article post it's thumbnailed version is as big as the full sized version.I don't know if this is a problem or not regarding user experience and pagespeed. Link to comment Share on other sites More sharing options...
opentype Posted May 2, 2015 Share Posted May 2, 2015 Check the global settings “Maximum image dimensions to save” and “Maximum image dimensions to display”. Link to comment Share on other sites More sharing options...
Gnuru Posted May 2, 2015 Author Share Posted May 2, 2015 Thank you Ralf, this was what I was looking for.... Link to comment Share on other sites More sharing options...
Gnuru Posted May 2, 2015 Author Share Posted May 2, 2015 ok, now better understand how IPS works with images. I have seen that the "Downloads"-App makes use of the "thumbimage". If anybody is interested, I modifed the widgets "Lastest records" and "Record Feed" for DB-Entries to show a thumb image like in Downloads This is the template for "LatestArticles" {{if !empty( $records ) }} <div class='ipsWidget_title ipsType_reset'>{lang="block_latest_records" sprintf="$database->recordWord( 2, TRUE )"}</div> {{if $orientation == 'vertical'}} <div class='ipsPad_half ipsWidget_inner'> <ul class='ipsDataList ipsDataList_reducedSpacing'> {{foreach $records as $record}} <li class='ipsDataItem'> {{if $record->record_image}} <div class='ipsDataItem_icon ipsPos_top'> {template="thumbImage" group="global" app="core" params="$record->record_image, $record->name, 'tiny'"} </div> {{endif}} <div class='ipsDataItem_main'> <!--<div class="ipsCommentCount ipsPos_right {{if ( $record->record_comments ) === 0}}ipsFaded{{endif}}" data-ipsTooltip title='{lang="replies_number" pluralize="$record->record_comments"}'>{expression="$record->record_comments"}</div>--> <h3 class='ipsDataItem_title ipsType_break'><a href="{$record->url()->setQueryString( 'do', 'getLastComment' )}" title='{lang="view_this_topic" sprintf="$record->title"}' class='ipsDataItem_title ipsType_break'>{wordbreak="$record->_title"}</a></h3> </div> </li> {{endforeach}} </ul> </div> {{else}} <div class='ipsWidget_inner'> <ul class='ipsDataList'> {template="recordRow" group="listing" location="database" app="cms" themeClass="IPS\cms\Theme" params="null, null, $records"} </ul> </div> {{endif}} {{endif}} Link to comment Share on other sites More sharing options...
opentype Posted May 3, 2015 Share Posted May 3, 2015 No I started to play with this myself and it’s all really strange. The Pages upload field has a max image size settings, but it does not work for me. I set a low value and uploaded a large pic. The Pic only appears as the original, large file. But this setting is supposed to discard the original and only save the low-res version, doesn’t it? Bug? Does it work for anyone?The Pages upload field doesn’t have a thumbnail size setting — only the one Record Image has that. So I would expect to have the global thumbnail size settings kick in and create a thumbnail of that size. But I am getting a suspicion that was wishful thinking. Can I even have thumbnails for the Pages upload field? (Other than just CSS scaling) Link to comment Share on other sites More sharing options...
Gnuru Posted May 3, 2015 Author Share Posted May 3, 2015 I understand.Being able to use different thumbnailed versions inside the pages app would be terrific. Link to comment Share on other sites More sharing options...
opentype Posted May 3, 2015 Share Posted May 3, 2015 Being able to use different thumbnailed versions inside the pages app would be terrific. Or one. I don’t even need separate versions as in WordPress, but it seems the Pages upload field doesn’t even offer one. Link to comment Share on other sites More sharing options...
estan Posted May 4, 2015 Share Posted May 4, 2015 ok, now better understand how IPS works with images. I have seen that the "Downloads"-App makes use of the "thumbimage".If anybody is interested, I modifed the widgets "Lastest records" and "Record Feed" for DB-Entries to show a thumb image like in Downloads @Gnuru This is exactly what I needed. Thank you!Now how I can add to this, below the article title, the date added and the user by whom it was added? Link to comment Share on other sites More sharing options...
Gnuru Posted May 4, 2015 Author Share Posted May 4, 2015 insert this line where you like<span class='ipsType_light ipsType_small'>{lang="byline_nodate" htmlsprintf="$record->author()->link()"} · {datetime="$record->mapped('date')"}</span> Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.