The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB

5 posters

Go down

Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB Empty Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB

Post by كونان2000 March 14th 2022, 11:17 pm

Hello everyone,
the following tutorial will help you to change the quick reply editor: AwesomeBB
And add a button [Preview - Send - Save]


-----------------------------


Before:
Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB Ocia_a23


After:
Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB Frorum10

----------------------------


Find the next part in viewtopic_body template
Code:
{QUICK_REPLY_FORM}

replace it with
Code:
<style>
.fa_avatar img {
    border: solid 2px #000;
    border-radius: 200px;
    width: 88px;
    height: 80px;
    position: relative;
    top: -20px;
}
.txet_avatar{
    position: relative;
    top: -20px;
}
.fa_avatar {
    text-align: center;
    border-top: solid #000 2px;
    background: white;
}
.sceditor-toolbar {
    text-align: center!important;
    background: #1e88e5!important;
}
 .sceditor-container iframe, .sceditor-container textarea {
    background-color: white!important;
    font-family: Open Sans, Arial, sans-serif;
width: 100%!important;
    height: 222px!important;
    min-height: 22px!important;
    padding: 22px!important;
}
fieldset.form-buttons {
    text-align: center;
}
.quick-reply {
    display: none;
    clear: both;
}
input.btn.btn-flat {
    font-weight: 900;
box-shadow: 0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 20%), 0 1px 5px 0 rgb(0 0 0 / 12%);
    color: #FFF;
    background: #1e88e5;
}
button.btn.btn-default.btn-icon:hover, input.btn.btn-flat:hover {
    background: #263238;
}

    </style>  
<br /><br />
  <div class="fa_avatar">
  <div class="txet_avatar">
      <!-- BEGIN switch_user_logged_in -->
 <div id="usserlinks" class="clearfix">
 
 <p>{LOGGED_AS}.</p>
 </div>
 <!-- END switch_user_logged_in -->
 <!-- BEGIN switch_user_logged_out -->
 <div id="userlinks" class="not-connected clearfix">
 <span class="guest">{L_NOT_CONNECTED}</span> <span></span>
 </div>
 <!-- END switch_user_logged_out -->
   </div>
      </div>    
<!-- BEGIN switch_user_logged_in -->
<a name="quickreply"></a>
{QUICK_REPLY_FORM}

<!-- END switch_user_logged_in -->

<hr />

<div class="topic-actions">
 <div class="buttons">
 <!-- BEGIN switch_user_authpost -->
 <a href="{U_POST_NEW_TOPIC}" rel="nofollow"><img src="{POST_IMG}" class="{POST_IMG_CLASS}" alt="{L_POST_NEW_TOPIC}" /></a>  &nbsp;
 <!-- END switch_user_authpost -->

 <!-- BEGIN switch_user_authreply -->
 <a href="{U_POST_REPLY_TOPIC}"><img src="{REPLY_IMG}" class="i_reply" alt="{L_POST_REPLY_TOPIC}" /></a>
 <!-- END switch_user_authreply -->
 </div>


Installing the JavaScript
To install the system you only need to go to Modules > JavaScript codes management and create a new script with the following settings.

Title : as you like
Placement : In the topics
Code:
$(function() {
  if (_userdata.session_logged_in == 1)
  var reply = $('.i_reply')[0];
 
  if (reply) reply = reply.parentNode;
  else return;
 
 
    toolbar = 'bold,italic,underline,strike|left,center,right,justify|bulletlist,orderedlist,horizontalrule|quote,code,faspoiler,fahide,table|servimg,image,,link,youtube,dailymotion|headers,size,color,font,removeformat|more|subscript,superscript|fascroll,faupdown,farand|mention,emoticon,twemojifa,date,time,pastetext,source';
 
 
 
  $.get(reply.href, function(d) {
    var quick_reply = document.createElement('FORM'), area = $('#text_editor_textarea', d)[0], data = $('fieldset.form-buttons', d)[0], anchor = document.anchors.quickreply,  n;
    quick_reply.id = 'quick_reply';
    quick_reply.action = '/post';
    quick_reply.method = 'post';
    quick_reply.name = 'post';
    quick_reply.enctype = 'multipart/form-data';
    quick_reply.innerHTML = '<div id="textarea_content" style="width: 50%; clear: both; margin-left: auto; margin-right: auto; text-align: center;">
           
        </div>';
 
    area && quick_reply.firstChild.appendChild(area);
    data && quick_reply.firstChild.appendChild(data);
 
    anchor.parentNode.insertBefore(quick_reply,  anchor);
 
    scripts = [
    'https://illiweb.com/rs3/16/frm/SCEditor/src/instance-sceditor.js'
    ];
 
    for (i = 0, j = scripts.length; i < j; i++) {
      n = document.createElement('SCRIPT');
      n.src = scripts[i];
      quick_reply.appendChild(n);
    }
 
  });
'This tutorial was written by Angie Tutor for guests to version phpBB3,
  and  Improved and  modified for AwesomeBB version by كونان2000'
});
 
 

$(function(){$(function(){
  $('.fa_avatar').prepend('<div class="fa_avatar">'+_userdata.avatar+'</div>')})});
   
 
 
$(function(){
 
    if (_userdata.session_logged_in || document.getElementById('quick_reply')) return;
 
  $("div#usserlinks,
 div#usserlinks").css({"font-size": "0"});
  'by كونان2000'                       
});


Note
To show the save button
go to the Administration Panel >> General >> Messages and emails
Configuration
Enable message draft feature : yes
Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB Ocia_a33



We hope you like this   Trick.
----------------------------------


Last edited by كونان2000 on March 24th 2022, 7:58 pm; edited 11 times in total
كونان2000
كونان2000
Forumember

Other / Decline to state Posts : 36
Reputation : 21
Language : arabic

View user profile https://i.servimg.com/u/f30/20/35/61/89/din12.jpg

skouliki, YoshiGM, SarkZKalie, TonnyKamper, jucarese and TheCrow like this post

Back to top Go down

Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB Empty Re: Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB

Post by كونان2000 March 19th 2022, 12:02 am

Tutorial has been updated,
Previously, the educational program was in only one language, which is English


Now it works in all languages
Dawa
كونان2000
كونان2000
Forumember

Other / Decline to state Posts : 36
Reputation : 21
Language : arabic

View user profile https://i.servimg.com/u/f30/20/35/61/89/din12.jpg

skouliki, SarkZKalie and TonnyKamper like this post

Back to top Go down

Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB Empty Re: Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB

Post by SarkZKalie March 19th 2022, 8:32 am

Brilliant !

Thank you for sharing \m/


Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB Sarkzk10
SarkZKalie
SarkZKalie
Support Moderator
Support Moderator

Male Posts : 1332
Reputation : 214
Language : English

View user profile https://rotavn.forumotion.com/

كونان2000 likes this post

Back to top Go down

Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB Empty Re: Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB

Post by jucarese March 19th 2022, 9:21 am

@كونان2000I was looking for change the preview text to put in Spanish and I can not find where to change it.
jucarese
jucarese
Hyperactive

Male Posts : 2100
Reputation : 91
Language : spanish
Location : SSF Admin

View user profile http://asistencia.foroactivo.com/u23082

كونان2000 likes this post

Back to top Go down

Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB Empty Re: Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB

Post by كونان2000 March 20th 2022, 12:28 am

@SarkZKalie Thank you ⁩ (◠‿◠)
---

hi @jucarese
The language of the button changes automatically according to preferences.
Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB Frorum10

(●'◡'●)
كونان2000
كونان2000
Forumember

Other / Decline to state Posts : 36
Reputation : 21
Language : arabic

View user profile https://i.servimg.com/u/f30/20/35/61/89/din12.jpg

TonnyKamper and jucarese like this post

Back to top Go down

Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB Empty Re: Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB

Post by jucarese March 20th 2022, 11:28 am

jucarese
jucarese
Hyperactive

Male Posts : 2100
Reputation : 91
Language : spanish
Location : SSF Admin

View user profile http://asistencia.foroactivo.com/u23082

Back to top Go down

Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB Empty Re: Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB

Post by skouliki March 20th 2022, 11:34 am

jucarese wrote:@كونان2000
Hello I do not see the button save
https://awesomebb.foroactivo.com/t1-tu-primer-tema
 
I tested also
I use the code to my test forum ( default templates ) no java
And i have the same issue no save button
skouliki
skouliki
Manager
Manager

Female Posts : 12336
Reputation : 1519
Language : English,Greek
Location : Greece

View user profile http://iconskouliki.forumgreek.com

Back to top Go down

Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB Empty Re: Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB

Post by كونان2000 March 20th 2022, 1:09 pm

Hello
@skouliki @jucarese
-----

Administration Panel >> General >> Messages and emails
Configuration
Enable message draft feature : yes
Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB Ocia_a33
Dawa
كونان2000
كونان2000
Forumember

Other / Decline to state Posts : 36
Reputation : 21
Language : arabic

View user profile https://i.servimg.com/u/f30/20/35/61/89/din12.jpg

skouliki and jucarese like this post

Back to top Go down

Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB Empty Re: Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB

Post by skouliki March 20th 2022, 5:46 pm

i can confirm that now it is ok
skouliki
skouliki
Manager
Manager

Female Posts : 12336
Reputation : 1519
Language : English,Greek
Location : Greece

View user profile http://iconskouliki.forumgreek.com

SarkZKalie, jucarese and كونان2000 like this post

Back to top Go down

Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB Empty Re: Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB

Post by TheCrow March 21st 2022, 6:15 am

كونان2000 wrote:Hello
@skouliki @jucarese
-----

Administration Panel >> General >> Messages and emails
Configuration
Enable message draft feature : yes
Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB Ocia_a33
Dawa
@كونان2000 these information should be on the first post of the tutorial so everyone would know that this is necessary to see the button. I would suggest adding it to the first post here.

Regards,
TC.
TheCrow
TheCrow
Manager
Manager

Male Posts : 6780
Reputation : 785
Language : Greek, English

View user profile https://forumote.forumotion.com

TonnyKamper, jucarese and كونان2000 like this post

Back to top Go down

Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB Empty Re: Add a [Preview - Send - Save] button to the quick reply editor: AwesomeBB

Post by كونان2000 March 21st 2022, 6:48 pm

TheCrow wrote:@كونان2000 these information should be on the first post of the tutorial so everyone would know that this is necessary to see the button. I would suggest adding it to the first post here.

Regards,
TC.
First post edited   
Thank you (●'◡'●)
كونان2000
كونان2000
Forumember

Other / Decline to state Posts : 36
Reputation : 21
Language : arabic

View user profile https://i.servimg.com/u/f30/20/35/61/89/din12.jpg

TonnyKamper and TheCrow like this post

Back to top Go down

Back to top

- Similar topics

 
Permissions in this forum:
You cannot reply to topics in this forum