How can I pre set pasted image widths and heights ?

[XHIBIT911]

Sometimes when people post tips and how to tutes the entire article along with images is posted in 1 big copy and paste job.
How can I pre set it so that the images are auto resized to fit the parameters of the forum so it doesnt wind up being all stretched outside of the borders ?

[TheListener]

I would either ask the folks to use www.picresize.com

The way I get round this is by making it a rule that ALL images are to be added to my forums gallery first then embedded into a post.

Not everyone wants to do this though.

[Arantor]

Admin > Configuration > Features and Options > Layout > Max width of posted pictures / Max height of posted pictures

Note that the size will only be checked on saving of the post, if the image cannot be found at the time for whatever reason, SMF will not force the size to be any different, nor will it go back and apply the setting to older posts.

[TheListener]

Trust me to overlook the simple stuff.

[XHIBIT911]

So if its a copy and paste job and I have the Max width and height configured its 50/50 that SMF will read it correctly and not scale it ?
Also I actually dont want every image uploaded unto my already cramped server ...I have multiple websites and  copy and pasted images is my friend

[Arantor]

If you set a max width and height, and post a smaller image than the max height, SMF won't scale it (because it's smaller than the max size)

Note that this is NOTHING to do with uploaded images. This is to do with images posted in posts with the img bbcode...

[XHIBIT911]

Ok I gotcha...as long as the images are posted using the bbc tags then it will auto size if its too large.
Its not quite what I was hoping I could pull off but thats fine

[YogiBear]

What you need to watch for is if someone pastes a direct URL (hotlinks) an overlarge pic from another site as this won't be automatically resized. I too have suffered the gigapixel brigade.

[Arantor]

Ok I gotcha...as long as the images are posted using the bbc tags then it will auto size if its too large.
Its not quite what I was hoping I could pull off but thats fine

So why not tell us what you were actually hoping for? I answered the question you asked. If they're copy/pasting entire pages (which means WYSIWYG editor), it's done through bbcode anyway. So this already applies.

[XHIBIT911]

Well I did actually say what I was hoping for.
I'd prefer external linked images since server space is precious.
And if the images are copy and pasted (which you wound up answering) there's no real way to pre size it. Yogi was spot on with the problem that it presents if the image is too large from the post pasting.

A few years ago I was on a radio station site that encouraged pasting of current events and somehow whatever people posted (the images regardless of size) always fit within the parameters of the post itself. So I know its possible. I guess SMF just hasnt tackled it yet.

[YogiBear]

Do you remember what make of software that radio station site was using ? It could just give us a clue as to how they did resize those pics.

[Arantor]

So I know its possible. I guess SMF just hasnt tackled it yet.

No, I guess you just didn't read what I said.

If they copy and paste the images, they're NOT ON THE SERVER.

BUT, you can STILL LIMIT the size of the image from flowing out of the post WITH THE OPTION I SAID.

[XHIBIT911]

Yogi its been a couple of years and you know how media sites are always scrambling to outdo each other by constantly upgrading to the newest formats possible and everything is completly different and I suspect even under new management now so I honestly couldnt say.

And Arantor, bro I did try your method, and the issue is if I copy an article from another site that has images in it and paste the entire article in my smf forum, it will post the images' actual size, this is regardless to the size that the image was even on the other site that it was copied from. They may have scaled it down ...just to fit properly on their site, but if I copy and paste it to smf once its pasted the size will show as original.

What you suggested was to insert each image using bbc code...I'm talking about copying and pasting the entire article as is.

[Arantor]

-sigh-

What you suggested was to insert each image using bbc code...I'm talking about copying and pasting the entire article as is.

Yes, you use the WYSIWYG editor. Which goes through a fun function called html_to_bbc to convert the post back to bbcode.

That says to me either 1) you set the maximums too high or 2) there's a problem with your server going to check the size, or possibly 3) a bug in SMF itself.

But since you haven't given me any details to work with (like examples or anything) or indeed what you've actually configured it to, I can't help you.

[XHIBIT911]

Man....when people that use forums, just regular users not mods or admins or anything.....(just the common Joe and Jane) copy and paste into forums...they arent using WYSIWYG editor. They're simply copying and pasting. My max is at 500 w X 400 h.... so I'm fine width and height wise. The server is functioning quite well and the point Im trying to make is a simple copy and paste...no editors...no bbcodes...no nada, Just copy and pasted content.

I know it can be regulated because I've seen it on another site...but this is just a small flaw thats never been addressed in SMF. The images WILL spill outside of the post parameters if its a simple copy and paste. I'm not talking about using any editors or codes. Just copy and paste.  In fact..if I recall correctly I had a stargate portal system that copy and pasted content DIDNT spill out of. Nor did I have to use any editors or codes

[Arantor]

In which case if they're not using the WYSIWYG editor, the images won't even be linked in the first place.

I doubt most people even know which editor they are using. Do you know which you are using?

I know it can be regulated because I've seen it on another site...but this is just a small flaw thats never been addressed in SMF

So, just because it isn't working for you under a specific situation that you won't give me any details about, it MUST somehow be SMF's fault? I'm still betting that you haven't got it set up right, or you're doing something else but you won't give me any examples to actually look at to try and reproduce this, or god help me, get it fixed.

[XHIBIT911]

Ok youre puttin waaaaaaaaaaaaaaay too much into this. Youre adding words that I didnt even say other than its a small flaw thats never been addressed by SMF.
Hell I just tried as a test to do a simple copy and paste of an article that had images in it. Just like people do all the time in forums.
Everyone (at least the common forum poster ) isnt using editors and even fewer use the BBC code itself.
Ive given you specific details and you keep saying that Im not.
How much more specific can I be ?


Go to a site...find an article with images and copy the entire article...images and all in 1 copy and paste it in this forum and you'll see for yourself.

Dont use any editor, dont use any BBC code, just copy and paste it.
Its the simplest form of copy and pasting that people do. Yogi even named em the gigapixel brigade.
Contrary to what you may believe everyone does not use the editor or the codes. They just post or post copied content by pasting it.


Heres an example:
This is a copy and paste with no editors or codes (the pictures just happen to fit because they were already  scaled on the other site)
http://hobbymafia.com/forum/general-discussion/test-2/

Now heres another copy and paste:
And you'll notice the size of the images stretch the page out and make the portal block off center
http://hobbymafia.com/forum/general-discussion/test-3/

[Arantor]

Ive given you specific details and you keep saying that Im not.
How much more specific can I be ?

How about some examples? Examples of what you copied, where you copied it to, that kind of thing.

Dont use any editor, dont use any BBC code, just copy and paste it.

WYSIWYG is on by default IIRC.

If it's not, the images just won't appear. Unless you have some fun and interesting mods you're not telling me about.

Contrary to what you may believe everyone does not use the editor or the codes. They just post or post copied content by pasting it.

Who's putting words into whose mouth now?


EDIT: Show me in the test board here. I bet it doesn't work the same way here.

[XHIBIT911]

The post above has links as examples.
Sometimes the images might be scaled on the website they were copied from...but when you post them as a copy and paste into SMF forums, the ORIGINAL size is how they wind up showing in the post is my entire point.
Its not that big a thing to me to keep going back and forth over it, so no worries, sorry if you still don't understand me. I've said it as clearly as possible bro

[Arantor]

Heres an example:
This is a copy and paste with no editors or codes (the pictures just happen to fit because they were already  scaled on the other site)
http://hobbymafia.com/forum/general-discussion/test-2/

And if I examine the source, for that image I find:

Code Auswählen Erweitern

<img src="http://www.modelcars.com/scale.gif" alt="Model Scale height=580" width="450" class="bbc_img resized" style="cursor: pointer;">

The bbc_img was added when the img bbcode was parsed out and turned into something else, and the width was set to 450 by the resizing process as evidenced by the 'resized' class. The fact the alt tag is broken is because the html to bbc parser is broken.

Now heres another copy and paste:
And you'll notice the size of the images stretch the page out and make the portal block off center
http://hobbymafia.com/forum/general-discussion/test-3/

First image has a width defined of 600, again showing the resized code, which suggests that at some point when it was posted you had a max of 600 set.

In fact, all the other images in that thread do the exact same thing. Which tells me that what I've been saying is exactly the case: you're using WYSIWYG, don't realise you're doing it, posting raw HTML and it's being converted to bbcode for you.


EDIT: Go into those threads and press edit. If the little arrow icon on the far right is lit up, you're in WYSIWYG mode. Press it and you'll see the bbcode that got made out of what you posted.

[XHIBIT911]

Yes...thats because I JUST NOW resized the image from 500 to 600 w to see how much wiggle room I had when I did a 4th test post. You probably saw it as I did it live only seconds afterwards (if that long). I also removed the portal blocks on the left side to see how much additional wiggle room I could play with for post images, and even reduced the avatar dimensions a hair. I now need to check the aeva media to make sure the youtube embeds are fitting correctly. So maybe the issue was the portal blocks and the image sizes I had at the time.

[Arantor]

So it's actually doing EXACTLY what I said it was >_< So what's the problem: it's resizing them when they're posted, to the maximum size you've set... failing to see what the problem is that you're blaming on SMF...

[XHIBIT911]

well without being all tech weenie about it that was pretty much the question.
Considering everyone doesnt use the code I needed to find out why the sizing was acting funny, so  to end it all I just removed the left portal blocks and increased the size. Simple solution

[Arantor]

-sigh- It doesn't matter whether people use the code or not, it tries to force it to resize to fit inside the limits either way...

[Chen Zhen]

XHIBIT911,

  If I understand you correctly, you simply need to use some javascript to set a max height/width for all image on the page.
Do you use a portal by any chance? I will give you a block code to use although you can also manually add it to files if necessary.

Using a portal create a HTML block and make sure to hide both the title and body of this block...

Block code:

Code Auswählen Erweitern


<script type="text/javascript">
window.onload = function()
{
   var maxHeight = 200;
   maxWidth = 200;
   var img = document.images;

   for (var i = 0; i < img.length; i++) {

      if (img[i].height > maxHeight)
         img[i].height = maxHeight;
         
      if (img[i].width > maxWidth)
         img[i].width = maxWidth;
   }
}
</script>


  Adjust the maxWidth and maxHeight to what is desired in the code shown above. This will not adjust any images that are already smaller than those dimensions and will limit them to those max sizes. This goes for bbc and/or direct posted images. You can limit your block to only be active on your topics/posts if so desired.

[Arantor]

Um, why is this necessary? SMF does it out of the box when configured correctly...

And if you weren't going down that route for some strange reason, CSS max-width will cover it for the vast majority of browsers out there too... even the mobile ones.


EDIT: Your code will also adjust any header images or similar that use actual img tags, it's not constrained to just images in posts/signatures.

[XHIBIT911]

OK works for me...all I'm saying is that earlier when the images width was set at 500, and both left and right portal blocks were active in the forum...I did some test pastes that stretched the forum out due to the images which I then dragged to 444x330.
This was before I did the edits for the image parameters and the avatar sizes as well as remove the left blocks.
So its all good with me ...I'm gonna see if I can reproduce it later on, but for now Im falling behind on finishing what i was working on. Thanks everyone for the help

[Arantor]

It would have been nice if you'd mentioned that you were using a portal and trying to fit it in between, because for all the things you said, you were implying fairly heavily that SMF wasn't doing its job and trying to suggest it was an SMF bug.

[Antechinus]

Y'know you can use custom css to resize images in posts*, regardless of whether they are inside bbc img tags or not, and regardless of when they were posted (ie: css fixes are retroactive). There's no need to play with PHP.

*Or avatars, or any other image.

[XHIBIT911]

I DID NOT imply anything.
In fact my exact words were "SMF hasnt tackled this yet" so if you're offended...I'm sorry but I'm not gonna go back and forth over something so frivilous as forum coding. Its much more to life than to be all anal about it.
And I'm pretty sure I'm not the only person thats encountered the issue of page stretching at some point.
I'm fairly certain I could reproduce the issue but it defeats the purpose at this point.
So Im basically turning the last word over to you.
Sometimes you people can really be nasty and for the most part people just accept it and dont say anything...but some of yall need a reality check.

On that note for the 3rd time thanks for the help

[Arantor]

Yes, page stretching is an issue. Which is why you set the option as provided, then there isn't an issue... SMF tackled it years ago by giving you the option in the first place. Not SMF's fault if you don't use the tools given to you...

[Antechinus]

When you two have quite finished...............

Automatic scaling of avatars, no admin settings required (and better without them):

Code Auswählen Erweitern

/* Auto resizing of avatars. */
.poster_avatar img, #summary_avatar img {
height: auto;
width: auto;
max-height: 150px;
max-width: 125px;
border-radius: 3px;
}


Automatic scaling of images inside posts, no admin settings required (and better without them):

Code Auswählen Erweitern

/* Scale images inside posts. */
.post img, .personalmessage img{
max-width: 100%;
width: auto;
max-height: 640px;
height: auto;
}



Automatic scaling of attached images, no admin settings required (and better without them):

Code Auswählen Erweitern

.attachments>img {
width: auto;
height: auto;
max-width: 100%;
max-height: 640px;
margin-top: 1em;
}


Automatic scaling of images inside a shoutbox, no admin settings required (and better without them):

Code Auswählen Erweitern

.sbinner img {
height: auto;
width: auto;
max-width: 96%;
max-height: 300px;
}


NOTE: These are for a custom theme, and would need to be adapted slightly for element names if being used for 2.0.x. That is not difficult to do.

Advantages of doing it this way are a) it's retroactive and b) does not rely on image links being in bbc tags and c) handles fluid layouts.

[Arantor]

Yup, I did actually mention you could use max-width, but I was sticking with the option built into SMF that won't require per-theme changing

[Antechinus]

Yup, I did actually mention you could use max-width, but I was sticking with the option built into SMF that won't require per-theme changing

Yup, but this way is more comprehensve and more tolerant of layout. It could be done as a small css block that could be pasted onto the end of any theme's css.

Hmmm. That could be a good one for Tips and Tricks, or even for a mod. I might code it up if I get bored.

[XHIBIT911]

Antechinus that would be a hell'uva great mod, especially if it pulled and displayed random images. Great idea !

And Underdog I concur absolutely

[Chen Zhen]

XHIBIT911,

  Well I am glad you got it sorted no matter which route you opt to use. Just want to add that with javascript you can also control images in specific parts of the page using id, class name, tags, etc. One would have to adjust for specific theme's (ie. id's) if these are not uniform across various themes available to the end user.

Just an example:

Code Auswählen Erweitern


<script type="text/javascript">
window.onload = function()
{
   var maxHeight = 200;
   var maxWidth = 200;
   // var whatid = document.getElementById("portal_main");
   var whatid = document.getElementById("forumposts");
   var img = whatid.getElementsByTagName("img");

   for (var i = 0; i < img.length; i++) {

      if (img[i].height > maxHeight)
         img[i].height = maxHeight;
         
      if (img[i].width > maxWidth)
         img[i].width = maxWidth;
   }
}
</script>


.. in that example for a referenced id it will affect topics/posts shown on the page from the default theme. I left another example id commented out for anything within a simpleportal table id (fyi which actually includes the post/topic area). You can look at your own page code to figure out what is necessary in that scenario or else use the css method Antechinus suggested.. both will work.

Edit ->Fixed var maxWidth line in code.. oops

[Antechinus]

Antechinus that would be a hell'uva great mod, especially if it pulled and displayed random images. Great idea !

And Underdog I concur absolutely

Codes for SMF 2.0.x: Auto resizing of images in posts, etc by CSS.

Can be added to the end of index.css and should work (although this is straight off the top of my head and I'm too lazy to test it at the moment).