Resize Image BBCode

Get help developing custom BBCodes or request one.
Post Reply
DirectorPr
Registered User
Posts: 2
Joined: Sat Oct 17, 2020 11:56 pm

Resize Image BBCode

Post by DirectorPr »

Hey guys, I was looking for help with creating a bbcode or editing the default [img] bbcode to include resizing images, and then if not resizes to default to the auto value. How I currently have it written is a mix of what I've found in other places, but as follows.

BBCode Usage

Code: Select all

[image={NUMBER1},{NUMBER2}]{URL}[/image]
HTML Replacement

Code: Select all

<img src="{URL}" style="width: {NUMBER1}px;height: {NUMBER2}px;" />
If there isn't a way to edit the default [img] code that's not anything serious I can just disable it board wide and funnel people through a new custom tag, but is there a way to make this custom bbcode use the image's default resolution if not the custom width and height set?
User avatar
thecoalman
Community Team Member
Community Team Member
Posts: 4253
Joined: Wed Dec 22, 2004 3:52 am
Location: Pennsylvania, U.S.A.
Contact:

Re: Resize Image BBCode

Post by thecoalman »

You can disable the [img] tag using permissions. Can use [img] BBCode tag, that's found in the forum permissions. If you have used roles to assign forum permissions you can just edit the role and it will apply to all forums that role is used.

A browser will default to native resolution if no height and width is set which I believe is what is used for [img] tag.

Applying it to the BBcode would probably require JS.In fact you could probably skip the custom BBcode and apply JS directly to existing [img].
“Results! Why, man, I have gotten a lot of results! I have found several thousand things that won’t work.”

Attributed - Thomas Edison
DirectorPr
Registered User
Posts: 2
Joined: Sat Oct 17, 2020 11:56 pm

Re: Resize Image BBCode

Post by DirectorPr »

Yeah I figured if I can get a custom bbcode to work I could just disable the default one. Any good tutorials that you could suggest to help learn applying JS to current bbcodes? Even if I don't use it for the base [img] tag I'm sure it'll come handy in the future.
User avatar
JoshyPHP
Code Contributor
Posts: 1177
Joined: Mon Jul 11, 2011 12:28 am

Re: Resize Image BBCode

Post by JoshyPHP »

I don't recommend disabling default BBCodes. If you do, you may find yourself unable to use image-related extensions that expect an IMG BBCode, not an image one.

Extensions can replace—or preferably extend—default BBCodes. You can keep the default IMG thing, add the height and width attributes so users can specify the dimensions, and modify the BBCode's template to add those attributes to the <img> element. If you want to let users specify the dimensions as a comma-separated pair rather than individually named values, you have to reparse the default attribute's value.

Writing code is faster than explaining it so here's the same thing in code form: https://github.com/s9e/phpbb-ext-imgsize

I don't intend to maintain those files so feel free to fork/reuse at your convenience.
I wrote the thing that does BBCodes in 3.2+.
Floyd
Registered User
Posts: 99
Joined: Tue Sep 03, 2013 10:16 am

Re: Resize Image BBCode

Post by Floyd »

Here's what I wrote. It dynamically resizes an image based on a percentage of the forum column width.

BBCode usage: [imgresize={NUMBER}]{URL}[/imgresize]

HTML replacement: <img src="{URL}" style="width: {NUMBER}%; height: {NUMBER}%;" />

Help line: Resize Image: [imgresize=%window]http://image_url[/imgresize]
Entropy is maintenance free.
User avatar
Edson Quadros
Registered User
Posts: 24
Joined: Wed Sep 09, 2020 3:44 pm
Location: Brasil
Name: Edson Quadros

Re: Resize Image BBCode

Post by Edson Quadros »

JoshyPHP wrote:
Mon Oct 26, 2020 3:18 pm

Writing code is faster than explaining it so here's the same thing in code form: https://github.com/s9e/phpbb-ext-imgsize
Great, that's what I was looking for.
Wonderful, thank you very much
Sorry my English
Bruce Banner
Registered User
Posts: 834
Joined: Thu Sep 25, 2014 10:36 am

Re: Resize Image BBCode

Post by Bruce Banner »

JoshyPHP wrote:
Mon Oct 26, 2020 3:18 pm
Writing code is faster than explaining it so here's the same thing in code form: https://github.com/s9e/phpbb-ext-imgsize
Hi. Could you please explain how to use this extension?
Bruce Banner
Registered User
Posts: 834
Joined: Thu Sep 25, 2014 10:36 am

Re: Resize Image BBCode

Post by Bruce Banner »

Bruce Banner wrote:
Sat Nov 21, 2020 4:32 pm
JoshyPHP wrote:
Mon Oct 26, 2020 3:18 pm
Writing code is faster than explaining it so here's the same thing in code form: https://github.com/s9e/phpbb-ext-imgsize
Hi. Could you please explain how to use this extension?
Sorry, never mind. Have figured it out.

Code: Select all

[img width=X]image url[/img]
or

Code: Select all

[img height=Y]image url[/img]
I know it's also possible to write

Code: Select all

[img width=X, height=Y]image url[/img]
or

Code: Select all

[img height=Y, width=X]image url[/img]
but I don't really see the point of that as only the second of the two dimensions is actually applied.
Bruce Banner
Registered User
Posts: 834
Joined: Thu Sep 25, 2014 10:36 am

Re: Resize Image BBCode

Post by Bruce Banner »

I see now. I thought I had to put a comma in but I don't. It should be

Code: Select all

[img width=X height=Y]image url[/img]
or

Code: Select all

[img height=Y width=X]image url[/img]
Last edited by HiFiKabin on Sat Nov 28, 2020 10:54 am, edited 1 time in total.
Reason: unneeded quote removed
Post Reply

Return to “Custom BBCode Development and Requests”