new forum feature coded - ability to inline link attachments!

[mouser]

i have just finished some modifications to the forum software to allow inline insertion of attachments (images,etc.).  This should help a lot in posts where the text refers to images a lot and you used to have all the attached images just shown at the footer of the post.

All of the images you see here are ATTACHMENTS to this post, not hosted on other sites


The new feature supports a bunch of different tags that let you control how images are displayed:

Code

[attach=#] says insert normal attachment #specified there
(ie will be url link if non image, or default img or thumbnail based on server settings).
for example, [attach=1] shows attachment #1 image here:

Code

[attachtimg=#] says insert full image even if server is set to
 show thumbnails by default.  Here is attachment #2 image forced to full size here, [attachimg=2]:

Code

[attachturl=#] says insert url link even if the attachment is an image
(useful if you want to attach images as simple url download links but not show
them as pictures anywhere in post).  For example here is [attachurl=1]: 

RoxiFelix.jpg (61.2 KB)

Code

[attachthumb=#] says to insert a thumbnail of the image, EVEN if thumbnailing
 is off by default on server (like it is here).  For example here is [attachthumb=1]:

Here :




NOTE:

• You will now find a new combo box on the Post page that says "Link Inline Image.." which will insert common codes for showing attached inline images in different styles.
• All attachments which are inlined are automatically excluded from listing down at bottom footer
• All attachments which are not inlined are shown at footer as per normal (see below for attachment 3 which was never inlined above so is shown in footer as normal).

[nudone]

a fantastic improvement.

[Carol Haynes]

Looks great - a really useful mod. Are you going to package it as a mod for SMF forums or keep it to this board?

[mouser]

all mods we make for this forum are intended to be shared with the smf community - it's the least we can do as appreciation to the great work the smf people have done.

in fact i've set up a special page for all of our smf modifications: http://www.donationcoder.com/Software/Other/SmfMods/index.html

i have to update that page but also find an smf pro who can make nice proper "packages" out of my modifications since i'm not too good at that.

[mouser]

ps.
i've also added a new "drop down box" to the post editor (upper left and colors) that will insert [attach]

[AbteriX]

>  to allow inline insertion of attachments (images,etc.). 

-
[a tt ach img = 1 ] http://www.donationcoder.com/cssimages/CX4m.gif

results in
[attachment 1 not found]http://www.donationcoder.com/cssimages/CX4m.gif


Test CODE block

Code

[attachimg=1]http://www.donationcoder.com/cssimages/CX4m.gif

-
-


Iam pretty sure i will like this 
THX

[mouser]

stefan - you must replace the # with the attachment #.

for example:

Code

[attach=1]

i will modify the error to make clear what is wrong.

[AbteriX]

[attachimg=#]H:\1to\neueHTMLhilfe\Ascii.jpg

[mouser]

hehe you'll get it, keep trying.

[Carol Haynes]

Here is a test



Stefan's avatar should appear above this line ...

This is the code I used:

Code

Here is a test

[attachimg=1]

Stefan's avatar should appear above this line ...

Goodie seems to work for me.

[AbteriX]

Hmm, I use [att achimg=1].
I copy this in an CODE block for you, see above.


--
Edit:
this syntax of me was wrong!
See pic below for the right one.

[AbteriX]

--



--
EDIT: added an how to:

I would have attached screenshots but I can't figure out how.

0) how to make scrennshots you know? Use the Print-Key, then paste it into MS-Paint, modify/add circles/crop, then save as e.g. att001.png
1) use the "full" post mode , not the "Quick Reply" one. This means use the "Quote"-button at top of the post or the "Reply"-Button at end of the thread.
2) choose e.g. "Link Inline Image" from post 'menu'
3) choose 'Inline display attachement'
4) you will get [at tach = #]
5) change the # to digit 1 [att ach = 1] (without space!)
6) see under the post window the "Attach" box ...below of "Additional Options..." .
...point it to your att001.png  .... your first attachment will be seen at the place of [att ach = 1] (use it without this spaces!)


See a picture where the Quote/Reply -Buttons are located:



Note from user "tomos":

alternatively,
if you start in Quick Reply, click on Preview - that will bring you into "full" mode

==================================================


See a picture how this work:




==================================================


This picture shows you how to delete an attachment:





==================================================

Tip1:
use PNG as file typ.
Before saving
- add with Paint or Xnview an circle or an arrow to point to that you wanna show
- crop the image to the main part to decrease the file size
- try to decrease the color depth with Xnview, IrfanView or PhotoFiltre to ~ 16 colors, this decrease the file size.

See a picture about some basic Paint features:






MS Paint Tutorials / How-to:
http://www.lkwdpl.org/classes/MSPaint/paint.html
http://www.albinoblacksheep.com/tutorial/mspaint
http://www.lesley.edu/faculty/ahunt/MSPttutr.htm


==================================================


Tip2:
Try DonationCoders own Screenshot tool Screenshot Captor from
http://www.donationcoder.com/Software/Mouser/screenshotcaptor/index.html



Tip3:
you can also attach an file without the use of [att achimg=#], then the image
is attached as thump at the very end of the post, like this white-one-with-text below.


-
HTH someone?
Please donate to DonationCoder.com.

[AbteriX]

  ---> this will display your first attached picture, wich you have attach with "Additional Options..." below.
[attachment 2 not found] ---> your second attached picture from "Additional Options..." below.
...

[AbteriX]

I Got it ?!

But i found an error with
"tried to inline include (attachimg) attachment #1"

'cus this is my second attach-image-command
in this post wich is  failed to include,
i.e. it must be #2 instead of #1 ? Isn't it?

[mouser]

Code

yes your second image would be included like: [attach=2]

[AbteriX]

Code

yes your second image would be included like: [attach=2]

Please see my post from:
« Reply #12 on: Today at 14:11:24 »

- my first image (#1) was  attached, no problem here.


- but your error speaks still about #1 => " tried to inline include (attachimg) attachment #1 "
But #1 was attached.

This error message must reffer to #2
'cus i had no second image attached in "Additional Options... ",
i had only wrote the command [att achimg2]


Am i wrong?

[mouser]

stefan can you make a post somewhere that demonstrates the problem so i can understand better.

[mouser]

never mind stefan, i see what you were saying and fixed it.
the error now refers to the proper attachment # you specified (see your post above now, the error is correct).

[AbteriX]

.
-
=

=
-
.


Fine, good work 

[AbteriX]

Suggestion:


"You need to specify the attachment number, for example [att achimg=1]."


should be smg like:

"
You need to exchange the '#' with the related attachment number from the "Additional Options..." below,
for example use [att achimg=1] for to see the first attachment inline the post, '=2' for the second...
"


?

[mouser]

good idea; i will make it so.

[clif_notes]

Nice feature. 

[hohar]

I was just referred to your mod from SMF.  i'm really interested in getting this inline attachment thing working.  i seemed to have to have it working somewhat, but i feel i did something wrong during the modification of the php file you suggest.

first of all, does this mod work with SMF 1.1 RC3?

in your install, you say to look for a certain code in the display.template.php file.  i'm assuming this is in the themes/default folder and there should be a copy in the folder for the specific theme you are using.  is this right?

also, you state where you should start inserting the code you have written.  i'm confused by your instructions.  you say to look for the code starting with "// What about splitting it off the rest of the topic?"

then you list 2 more blocks of code.  then you say your code should replace the code inbetween those 2 blocks of code.....but didn't you list 3 blocks?  i'm not really up to snuff on php, so i don't really know.

i'm just trying to figure out exactly where to start inserting your code and what of the original code i should delete.

i tried inserting your code after the block of code following "// Show a checkbox for quick moderation?" and before "// Show "« Last Edit: Time by Person »" if this post was edited.".  with this code in place in a display.template.php file copied to the theme folder i was using in my forum, the inline attachments seemed to work.  however, i didn't see any drop down menus like in the screen capture above when i was posting the topic.  also, once posted, the image was inline and the formating was off below it.  specifically, the "report to moderator" and "show ip address" fields were locate way out of the area defined for the topic.

do you have any idea as to what i'm doing wrong? 

thanks,

ryan

[mouser]

Hi hohar and welcome.  I can try to help.

First of all note that the modification is for RC2 and hasn't been upgraded to RC3 yet, but it will be identical or nearly identical and should not be a problem at all.

Second, we use the mod every day here over and over, so it is very stable and works well.

Third, i've made a few improvements that I haven't posted yet - if you give me a week I can try to upload a new version, perhaps ready for RC3.  But that shouldn't stop you from tying to get current version installed since it will be easy to change.

Fourth, with regard to:

with this code in place in a display.template.php file copied to the theme folder i was using in my forum, the inline attachments seemed to work.  however, i didn't see any drop down menus like in the screen capture above when i was posting the topic.

the drop down menu items are very optional - we use them here in a couple of places just to help remind people what they can do.  i can post the code for some of them if you like.  basically the ONLY thing they do is add to the post stuff like

Code

[attachthumb=1]

in case the user has forgotten what keyword to use for thumbnails, etc.  basically it's just a reminder helper so the user doesnt have to remember what to type.  That's all it doest.

As for this:

also, once posted, the image was inline and the formating was off below it.  specifically, the "report to moderator" and "show ip address" fields were locate way out of the area defined for the topic.

That's a little trickier since we use a slightly non-standard template, however it really shouldnt look ANY different at all - after all the whole point is for inline images to be in the text and not effect the post otherwise.

Maybe you could post a screenshot or email me (mouser@donationcoder.com) so i can help a bit more.

[Stern]

the drop down menu items are very optional - we use them here in a couple of places just to help remind people what they can do.  i can post the code for some of them if you like.  basically the ONLY thing they do is add to the post stuff like

Code

[attachthumb=1]

in case the user has forgotten what keyword to use for thumbnails, etc.  basically it's just a reminder helper so the user doesnt have to remember what to type. 

mouser, sorry my bad english.

Can I get this code - drop/down menu for my site?