Insert into post button

[Genestoy]

I posted this in the "Theme" forum but got no response so really hoping somebody can help me here as I have spent a lot of time looking for this--

I need to remove the attachment drag and drop from the posting editor, I assume it will require a template edit in the editorAttachments template? Have not had much luck finding what to edit. I need to remove not only the drag and drop placement "hand" but the "+" button to add it to the post as well. I need all attachments to be placed at the bottom of the members post automatically. Can anybody please help me with this?

Thanks in advance

[clearvision]

If you don't want to explore the plugin route...

You can certainly use css to get rid of (display:none) the "+" and keep the cursor changing to a hand.  But you will have to add a jquery .on("click", "targetclass",....) handler to a parent div of the attachment area to stop the insertion of the image into the post.  Since the actual attachment area is loaded/inserted thru either ajax, or script (I just know it's HTML is not there until you upload an a file) you have to put the .on handler on an existing parent element.  This could be added to the topic template.  I've not actually done any of this for what you are looking for but have for a similar type of change I wanted.

Edit:  In thinking about it, not sure the .on click handler would get activated before IPS's handler, so that would need to be tested.

[Genestoy]

Is there a plugin, not aware of one? I really need this done as the age of my members is 70-80 and you can not believe how they post images all over the post where they don't belong. In my old forum I just commented out the "Insert into post" and of course there was no drag-n-drop.

Thanks

[clearvision]

I doubt there is a plugin, you'd have to write one. 

Most of the editor area stuff is done in javascript/jquery files so no easy template changes.

[clearvision]

So I took a minute and verified you can stop image insertion with jquery.

Add this to the end of the "topic" template:

<script>
  $( ".cTopicPostArea" ).on( "mousedown", ".ipsImageAttach_thumb", function(event) {
     $(this).removeAttr("data-action");
  });
</script>

 

Then you add to custom.css

.ipsAttach_selection {display:none;}

This is for 4.1

Images get inserted only when you submit reply. 

Only tested on FireFox with a mouse and not on touch device or other browsers.

[Genestoy]

That got rid of the + button in the image so a step in the right direction but clicking on the image does insert it?

[clearvision]

Not sure.  I just checked on latest IE and it blocks drag/drop or click there too. 

Just added the script to the end of forum/topics/topic template.

But like I said did not do a lot of testing as it was just a hack to see if it could be done.  If you are sure that script is in the page source (check from browser inspector for index.php in the 1500 line range) and you are on 4.1.x not sure what to tell you.

Also what you end up with is the images just sort of displayed at the end of the post one after another.  No real formatting or transition between the post text and the images.  Not sure that is what you were going for.

 

[Genestoy]

Yes that is where I put the script - forums/topics/topic

</div>

{{if !$topic->container()->disable_sharelinks}}
	<hr class='ipsHr'>
	{template="sharelinks" app="core" group="global" params="$topic"}
{{endif}}
      
<script>
  $( ".cTopicPostArea" ).on( "mousedown", ".ipsImageAttach_thumb", function(event) {
     $(this).removeAttr("data-action");
  });
</script>      

 

[Genestoy]

I agree with you that is not going to work as it puts the images all vertical in the post and I need them to be horizontal

[clearvision]

So the test I did was actually on a reply to a topic.  The code and template would be slightly different when you first create the topic. 

I'm not going to look into though because as you say the images are just sort of thrown in at bottom of post.  You could of course apply CSS to them to shrink them to small thumbnails and get them to line up, but still sort of kludgy.

[Genestoy]

I appreciate you trying to help, need to get the upgrade going as soon as possible so will have to work on this later.

[clearvision]

@Genestoy

I'll just add this in case you decide to pursue css formatting the images (they have a class and could be set to be small thumbnails, made inline, etc.).

This is for disabling on Topic Creation (versus replying).  Add to end of createTopicForm.  It has one class different.

<script>
  $( ".ipsComposeArea_editor" ).on( "mousedown", ".ipsImageAttach_thumb", function(event) {
     $(this).removeAttr("data-action");
  });
</script>

 

[Genestoy]

On 6/9/2017 at 2:41 PM, clearvision said:

@Genestoy

I'll just add this in case you decide to pursue css formatting the images (they have a class and could be set to be small thumbnails, made inline, etc.).

This is for disabling on Topic Creation (versus replying).  Add to end of createTopicForm.  It has one class different.

<script>
  $( ".ipsComposeArea_editor" ).on( "mousedown", ".ipsImageAttach_thumb", function(event) {
     $(this).removeAttr("data-action");
  });
</script>

 

That absolutely worked perfect for the new post, now how about one for the "Reply" and all will be perfect!

THANKS so much for helping me with this!

Sorry, the one you gave me before WAS the one for the reply all is too good to be true!!

THANKS again!

[Genestoy]

Well, I forgot one thing, I really need it to place the images horizontal and would be much appreciated if you could also help me with that?