BBcode html image link thumbnail

Get help with installation and running phpBB 3.0.x here. Please do not post bug reports, feature requests, or MOD-related questions here.
Anti-Spam Guide
Forum rules
END OF SUPPORT: 1 January 2017 (announcement)
User avatar
antec
Registered User
Posts: 90
Joined: Thu Jun 07, 2007 1:58 pm

BBcode html image link thumbnail

Post by antec »

Can I add a html image link thumb nail to bbcode? I have tried so many ways but cant get it.

How can I add this code below to the custom bbcode and post it.

Code: Select all

[example]{TEXT}{LINK1}{LINK2}[/example]

Code: Select all

<a href="{LINK1}"><img src="{LINK2}" width="640" height="480" alt="{TEXT}" border="0"></a>

or

Code: Select all

[example]{TEXT}{LINK1}{LINK2}[/example]

Code: Select all

<a href="{LINK1}"><img border="0" width="640" alt="{TEXT}" src="{LINK2}" height="480"/></a>
Any help would be much appreciated

Thanks :)
Last edited by antec on Wed Jun 13, 2007 4:21 pm, edited 1 time in total.
User avatar
OmegaQuest
Registered User
Posts: 76
Joined: Mon Sep 01, 2003 9:12 pm
Location: Washington, DC

Re: BBcode html image link thumbnail

Post by OmegaQuest »

Code: Select all

[example]{TEXT}[/example]

Code: Select all

<a href="http://www.mylinkhere.com"><img border="0" width="640" alt="{TEXT}" src="http://www.myimage.com/12.jpg" height="480"></a>
This works fine when I tested it...

(Except that the Image is not located at the link you provided)
User avatar
antec
Registered User
Posts: 90
Joined: Thu Jun 07, 2007 1:58 pm

Re: BBcode html image link thumbnail

Post by antec »

Oops double post (REMOVED)
Last edited by antec on Wed Jun 13, 2007 4:22 pm, edited 1 time in total.
User avatar
antec
Registered User
Posts: 90
Joined: Thu Jun 07, 2007 1:58 pm

Re: BBcode html image link thumbnail

Post by antec »

No thats not right, I need to be able to change the image links to, It should look like the codes below.
But they dont work

Code: Select all

[example]{TEXT}{LINK1}{LINK2}[/example]

Code: Select all

<a href="{LINK1}"><img src="{LINK2}" width="640" height="480" alt="{TEXT}" border="0"></a>

or

Code: Select all

[example]{TEXT}{LINK1}{LINK2}[/example]

Code: Select all

<a href="{LINK1}"><img border="0" width="640" alt="{TEXT}" src="{LINK2}" height="480"/></a>

I dont know what you would post in the forum to display it, Its a pain, I wish I could just enable html.
dark/Rain
Registered User
Posts: 584
Joined: Mon Mar 19, 2007 4:50 pm

Re: BBcode html image link thumbnail

Post by dark/Rain »

Suggestion (still not optimal though):
Use together with a custom BBCode

BBCode:

Code: Select all

[example={TEXT}]{URL}[/example]
HTML Replacement:

Code: Select all

<img src="{URL}" width="640" height="480" alt="{TEXT}" style="border:none;">
Usage:

Code: Select all

[url=link_to_use][example=alt_text]image_url[/example][/url]
You could of course also exchange the {TEXT} and {URL} in the example.
Note that you can only use the pre-defined placeholders, not {LINK} for example (see list at the bottom of the new/edit custom BBCode page).
I don't know if it's possible to create an all-in-one solution...

//Edit:
Got one! :D

BBCode:

Code: Select all

[thumb="{NUMBER1},{NUMBER2},{URL1} {TEXT}"]{URL2}[/thumb]
HTML Replacement:

Code: Select all

<a href="{URL2}"><img src="{URL1}" width="{NUMBER1}" height="{NUMBER2}" alt="{TEXT}" style="border:none;"></a>
Usage:

Code: Select all

[thumb="width,height,image_url alt_text"]link[/thumb]
Note the space between image_url and alt_text!
Also, take care about the ordering of the placeholders, probably not everyone will work (if you want to rearrange them)...

If you want it fixed-width, simply let out the {NUMBER1},{NUMBER2}, and set the with and height to fixed values again.

No guarantee that it will work in the future etc. but in the current development version it works... :mrgreen:
User avatar
antec
Registered User
Posts: 90
Joined: Thu Jun 07, 2007 1:58 pm

Re: BBcode html image link thumbnail

Post by antec »

Thanks for the help dark/Rain its much appreciated.

But it wont work for me, Everything works accept the link.

I tried using this input code while posting.

Code: Select all

[thumb="500,500,http://www.phpbb.com/community/images/smilies/icon_e_confused.gif my text"]http://www.phpbb.com[/thumb]
No Luck :(

Am I missing something?

This is what it looks like when I post it.
untitled.JPG
untitled.JPG (22.5 KiB) Viewed 28157 times
dark/Rain
Registered User
Posts: 584
Joined: Mon Mar 19, 2007 4:50 pm

Re: BBcode html image link thumbnail

Post by dark/Rain »

:roll:
Tried it with RC1 -> doesn't work (same as your screenshot)
Development version -> works
Probably some bug got fixed relating to this/the behaviour got changed...
User avatar
antec
Registered User
Posts: 90
Joined: Thu Jun 07, 2007 1:58 pm

Re: BBcode html image link thumbnail

Post by antec »

:cry:

Thanks for giving it a shot dark/rain

There has to be a way to post it!!!

Can a mod or phpbb pro please help me/us find a solution for this?

The code is no where to be found on this forum :cry:
User avatar
antec
Registered User
Posts: 90
Joined: Thu Jun 07, 2007 1:58 pm

Re: BBcode html image link thumbnail

Post by antec »

is it possible to add hover text to this code?

Code: Select all

[url=http://www.phpbb.com][img]http://www.phpbb.com/community/images/smilies/icon_e_ugeek.gif[/img][/url]
I will just resize the images, but i dont like how when you hover the image it says "image"

I want it to say Click Here
User avatar
Highway of Life
Former Team Member
Posts: 6048
Joined: Wed Feb 02, 2005 5:41 pm
Location: Seattle, WA
Name: David Lewis
Contact:

Re: BBcode html image link thumbnail

Post by Highway of Life »

antec, first of all, don’t PM or IM users for private support.
Private support helps only one person. Public support helps everyone.

I don’t quite understand what you are after... but you can do this:

Code: Select all

[image={URL}]{TEXT}[/image]
HTML:

Code: Select all

<img src="{URL}" alt="{TEXT} />
Usage:

Code: Select all

[url=http://www.phpbb.com][image=http://www.phpbb.com/community/images/smilies/icon_e_ugeek.gif]Click Here[/image][/url]
If you want a specific size, in the HTML replacement, you can add width="200" height="200" attributes...
or...

Code: Select all

[image={URL},{TEXT1},{TEXT2}]{TEXT3}[/image]
HTML:

Code: Select all

<img src="{URL}" width="{TEXT1}" height="{TEXT2}" alt="{TEXT3}" /> 
Usage:

Code: Select all

[url=http://www.phpbb.com][image=http://www.phpbb.com/community/images/smilies/icon_e_ugeek.gif,500,500]Click Here[/image][/url]
Again, I don’t fully understand what you are trying to do. :?
The phpBB Weekly Podcast - Discussing the developments of phpBB4 and beyond.

New to phpBB3? Want to learn about programing?
Visit phpBB Academy at StarTrekGuide to learn how.
User avatar
antec
Registered User
Posts: 90
Joined: Thu Jun 07, 2007 1:58 pm

Re: BBcode html image link thumbnail

Post by antec »

That works perfect Highway of Life

Thanks You 8-)
User avatar
antec
Registered User
Posts: 90
Joined: Thu Jun 07, 2007 1:58 pm

Re: BBcode html image link thumbnail

Post by antec »

The code works great but I cannot post two pictures.

I can only post 1 picture

If I use this code

Code: Select all

[url=http://www.phpbb.com][image=http://www.phpbb.com/community/images/smilies/icon_e_ugeek.gif,500,500]Click Here[/image][/url]
[url=http://www.phpbb.com][image=http://www.phpbb.com/community/images/smilies/icon_e_ugeek.gif,500,500]Click Here[/image][/url]
The second image wont show up.

Is there something I should between the codes?
User avatar
Highway of Life
Former Team Member
Posts: 6048
Joined: Wed Feb 02, 2005 5:41 pm
Location: Seattle, WA
Name: David Lewis
Contact:

Re: BBcode html image link thumbnail

Post by Highway of Life »

No, your code looks fine... and it shouldn’t matter how many of the same image you post.

Try using a different image for the second one and see if it shows up... :? -- what browser are you using? -- you could also try testing in different browsers.
The phpBB Weekly Podcast - Discussing the developments of phpBB4 and beyond.

New to phpBB3? Want to learn about programing?
Visit phpBB Academy at StarTrekGuide to learn how.
User avatar
antec
Registered User
Posts: 90
Joined: Thu Jun 07, 2007 1:58 pm

Re: BBcode html image link thumbnail

Post by antec »

I tested in firefox and ie7 and I tried two different pics also and links.

Still no luck
dark/Rain
Registered User
Posts: 584
Joined: Mon Mar 19, 2007 4:50 pm

Re: BBcode html image link thumbnail

Post by dark/Rain »

Played around with my suggestion in RC1 again and found the reason why it doesn't work:
It's very likely because of this bug: http://www.phpbb.com/bugs/phpbb3/ticket ... t_id=11893 (which got fixed probably).
The bug is that automatic URL parsing was done before parsing the BBCodes or something similar.
You can try this with the "Do not automatically parse URLs" option. If you tick it, the thumbnail code works.

//Edit: ...testing the double-picture problem...
When the size placeholders are removed, it works (size set fixed in HTML replacement).
If you use size placeholders (one or two), but still use fixed size(s) in HTML replacement, actually only one picture is shown.
When you use placeholders in both BBCode and replacement, the fist picture is shown and the rest of BBCode is cluttered and somehow included in the link (see HTML source below).
(Added quotes to the BBCode, but that seems not to change anything...)

Using this code (placeholders in BBCode and HTML replacement):

Code: Select all

[url=http://www.phpbb.com/][image="http://192.168.2.7/~<<username>>/forum_rc1/styles/prosilver/imageset/site_logo.gif,200,200"]Click Here[/image][/url]
[url=http://www.phpbb.com/][image="http://192.168.2.7/~<<username>>/forum/images/icons/smile/redface.gif,200,200"]Click Here[/image][/url]
(two different images)

Generated source code:

Code: Select all

<div class="content"><a href="http&#58;//www&#46;phpbb&#46;com/" class="postlink"><img src="http://192.168.2.7/~<<username>>/forum_rc1/styles/prosilver/imageset/site_logo.gif" width="200" height="200"]Click Here[/image]</a><br /><a href="http&#58;//www&#46;phpbb&#46;com/" class="postlink">[image="http://192.168.2.7/~<<username>>/forum/images/icons/smile/redface.gif,200,200" alt="Click Here" /></a></div>
Occurs both in RC1 and yesterday's CVS snapshot.
Will try to find something in the files...
Maybe the regex is too greedy? (Just a guess...)

//Edit: wrong generated source code

//Edit: Small progress report (that took a while :|):

The cause of the whole mess seems to be a missing uid in the first-pass parsed message:
Message viewed in phpMyAdmin:

Code: Select all

[url=http&#58;//www&#46;phpbb&#46;com/:9ad6a][image="http://192.168.2.7/~<<username>>/forum_rc1/styles/prosilver/imageset/site_logo.gif,200,200"]Click Here[/image][/url:9ad6a]
[url=http&#58;//www&#46;phpbb&#46;com/:9ad6a][image="http://192.168.2.7/~<<username>>/forum/images/icons/smile/redface.gif,200,200":9ad6a]Click Here[/image:9ad6a][/url:9ad6a]
Adding the :9ad6a (or whatever it is, depends) to the first image tag(s) via phpMyAdmin fixes it! It is then displayed correctly.
Now why's the id missing...

The same problem occurs by the way, when you leave away the url BBCodes and insert a tag between the two [image= ] tags...

//Edit: further progress (?)
include/message_parser.php, ll. 69 wrote: if (preg_match($regexp, $this->message))
{
$this->message = preg_replace($regexp, $replacement, $this->message);
$bitfield->set($bbcode_data['bbcode_id']);
}


//Edit: seems to fix it but is not the cause of the problem, see next post:
Change the "if" to "while" and it works.
Not based on any founded argument, but on the fact that the regex seems to be applied only once but should be applied until it doesn't match any longer (?)...

Another by the way: The whole stuff seems to work when you use {NUMBERX} instead of {TEXTX} (not in RC1) - logical somehow since the dividing "," is included in {TEXT} (maybe it should work nevertheless, but at least that's nicer)...

Probably I'll file a bug report later...
Last edited by dark/Rain on Sat Jun 16, 2007 3:40 pm, edited 2 times in total.
Locked

Return to “[3.0.x] Support Forum”