MyBB Community Forums
[General] How to embed full size images - Printable Version

+- MyBB Community Forums (https://community.mybb.com)
+-- Forum: 1.8 Support (https://community.mybb.com/forum-175.html)
+--- Forum: General Support (https://community.mybb.com/forum-176.html)
+--- Thread: [General] How to embed full size images (/thread-196875.html)

Pages: 1 2


How to embed full size images - The Armchair Soldier - 2016-08-02

Hi all,

I recently created a MyBB community, but currently, whenever a user posts an image (using [IMG] tags) the image is greatly reduced in size. 

Here's a demonstration of what happens currently (keeping in mind the original image is around 1920 x 1080):
http://i.imgur.com/LTtz5VR.jpg

What I need (sorry for the crude MS Paint job):
http://imgur.com/zl0Nmz8.jpg

I need images to show at their original size, but then be scaled down if they exceed the max width of the post body.

I am currently using the theme "Osmium". The global.css says:

.scaleimages img {
	max-width: 100%;
}

My board version is 1.8.7

This issue occurs with all, including the default MyBB one, except for one theme called Rush.

Any help would be much appreciated, 

The Armchair Soldier


RE: How to embed full size images - Detiz - 2016-08-02

Well if you want to scale to full size then it should be min-size:

.scaleimages img {
    min-width: 100%;
}



RE: How to embed full size images - The Armchair Soldier - 2016-08-02

Worked! Many thanks.

Scratch that; now posted images look like this for some reason:

[Image: OsE08g8.jpg]

The width is now stretched to fit the post body no matter what


RE: How to embed full size images - Ashley1 - 2016-08-02

Can't think of any reason why this won't work for you. You only need to make sure that you have class scaleimages in your code, or make sure that it has not been removed. Can you post a link to your site ?


RE: How to embed full size images - The Armchair Soldier - 2016-08-02

Sure. Here's a link to my site: http://pc-roleplay.com/index.php

To clarify, I am supposed to edit the global.css of Osmium? Or should I be editing the one belonging to the default MyBB theme?


RE: How to embed full size images - Ashley1 - 2016-08-02

Can you link to the thread where the image is ?

You should check the postbit and postbit_classic templates for:

<div class="post_body scaleimages" id="pid_{$post['pid']}">


RE: How to embed full size images - The Armchair Soldier - 2016-08-02

Here's a thread with some images:
http://pc-roleplay.com/showthread.php?tid=26&pid=41#pid41

I have removed the "min-width" from the css so the images are appearing how they were when I posted this thread.

I found this in postbit:

 <div class="post_body scaleimages" id="pid_{$post['pid']}">
 {$post['message']}
</div>

And I found this in postbit_classic:

<div class="post_author scaleimages">
 {$post['useravatar']}
<div class="author_information">
<strong><span class="largetext">{$post['profilelink']}</span></strong> {$post['onlinestatus']}<br />
<span class="smalltext">
{$post['usertitle']}<br />
{$post['userstars']}
{$post['groupimage']}
</span>
</div>
<div class="author_statistics">
{$post['user_details']}
</div>
</div>

And:

 <div class="post_body scaleimages" id="pid_{$post['pid']}">
 {$post['message']}
</div>



RE: How to embed full size images - Ashley1 - 2016-08-02

maybe the problem is when you upload the images:

Do the following when you insert an image and see how it looks:

1) Go to postimage.org

2) Choose the image from your PC - be sure to leave the default settings as is, which is to not resize the image.

3) Copy the link that appears in the direct link textbox.

4) Paste the above link into the URL textbox when you upload an image - leave height and width empty.


RE: How to embed full size images - The Armchair Soldier - 2016-08-02

(2016-08-02, 02:54 PM)Ashley1 Wrote: 4) Paste the above link into the URL textbox when you upload an image - leave height and width empty.
Sorry, what do you mean by this?


RE: How to embed full size images - katos - 2016-08-02

Your HTML tag is being assigned a size tag:
<img src="http://atgyos5wag90b2j1y2tldc5jb200.g00.photobucket.com/g00/TU9SRVBIRVVTMyRodHRwOi8vaTgyOS5waG90b2J1Y2tldC5jb20vYWxidW1zL3p6MjE4L2xpYW1jbGFya3NvbjEvUm9ja3dlbGwlMjBkdmRzX3pwc3YwanY1b3h3LnBuZw%3D%3D/$/$/$/$" width="300" height="250" border="0" alt="[Image: $]">

I would recommend searching your templates for somewhere where image_size is defined or such.
When uploading your image like so:
http://puu.sh/qnfIC/68c276c336.png

you can try setting the height / width to what the image should be