The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

How to get the "Quote, code, spoiler, hide" buttons working like Forumotion?

View previous topic View next topic Go down

In progress How to get the "Quote, code, spoiler, hide" buttons working like Forumotion?

Post by AlexisMcDevin on December 27th 2014, 3:39 pm

Tutorial topic: Select Content Button

I searched out the tutorial topic to make the select content button. I tried with this however, it did not work as per what I want.



As you see, select content button of "Code" show up in black and upper-cases. The border lines do not look very well.

Quote frame also like below comment.

The Spoiler is so terrible. All in upper-cases.

So can you give me some codes to make "Quote, code, spoiler, hide" button will be exactly like below image?

Myforum is phpbb3

Link to my forum you can find in my profile.



Thank you very much!
Alex.


Last edited by AlexisMcDevin on December 29th 2014, 11:03 pm; edited 1 time in total

AlexisMcDevin
Forumember

Male Posts : 133
Reputation : 5
Language : English

http://ccxiqi.forumvi.com/

Back to top Go down

In progress Re: How to get the "Quote, code, spoiler, hide" buttons working like Forumotion?

Post by SLGray on December 27th 2014, 10:16 pm

The select content button should not appear for quotes and spoilers.


When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.


SLGray
Administrator
Administrator

Male Posts : 36735
Reputation : 2446
Language : English
Location : United States

http://ztwds.forumotion.com/

Back to top Go down

In progress Re: How to get the "Quote, code, spoiler, hide" buttons working like Forumotion?

Post by AlexisMcDevin on December 27th 2014, 10:47 pm

@SLGray wrote:The select content button should not appear for quotes and spoilers.

Yes, I know that. I attached the below image in my first post to talk to you all, that is what I want.
Since, I follow tutorial but it did not work on my forum.
So, can you help me?

AlexisMcDevin
Forumember

Male Posts : 133
Reputation : 5
Language : English

http://ccxiqi.forumvi.com/

Back to top Go down

In progress Re: How to get the "Quote, code, spoiler, hide" buttons working like Forumotion?

Post by _Twisted_Mods_ on December 28th 2014, 3:39 am

here the code for spoiler

Code:
      function selectCode(a){a=$(a).closest("dl").find(".spoiler_content")[0];if(window.getSelection){var c=window.getSelection();if(c.setBaseAndExtent)c.setBaseAndExtent(a,0,a,a.innerText.length-1);else{window.opera&&a.innerHTML.substring(a.innerHTML.length-4)=="<BR>"&&(a.innerHTML+=" ");var b=document.createRange();b.selectNodeContents(a);c.removeAllRanges();c.addRange(b)}}else document.getSelection?(c=document.getSelection(),b=document.createRange(),b.selectNodeContents(a),
            c.removeAllRanges(),c.addRange(b)):document.selection&&(b=document.body.createTextRange(),b.moveToElementText(a),b.select())}
           
          $(function(){
                $("dl.codebox>dd>.spoiler_content").closest("dl").find('dt').append('<span onClick="selectCode(this)" class="selectCode">Select Content</span>');
          });

_Twisted_Mods_
Helper
Helper

Male Posts : 2032
Reputation : 302
Language : English
Location : Ms

http://liquidcode.forumotion.com

Back to top Go down

In progress Re: How to get the "Quote, code, spoiler, hide" buttons working like Forumotion?

Post by AlexisMcDevin on December 28th 2014, 9:53 am

@_Twisted_Mods_ wrote:here the code for spoiler

Code:
      function selectCode(a){a=$(a).closest("dl").find(".spoiler_content")[0];if(window.getSelection){var c=window.getSelection();if(c.setBaseAndExtent)c.setBaseAndExtent(a,0,a,a.innerText.length-1);else{window.opera&&a.innerHTML.substring(a.innerHTML.length-4)=="<BR>"&&(a.innerHTML+=" ");var b=document.createRange();b.selectNodeContents(a);c.removeAllRanges();c.addRange(b)}}else document.getSelection?(c=document.getSelection(),b=document.createRange(),b.selectNodeContents(a),
            c.removeAllRanges(),c.addRange(b)):document.selection&&(b=document.body.createTextRange(),b.moveToElementText(a),b.select())}
           
          $(function(){
                $("dl.codebox>dd>.spoiler_content").closest("dl").find('dt').append('<span onClick="selectCode(this)" class="selectCode">Select Content</span>');
          });

Below is the image after applied your code. It seems to be nothing change.

AlexisMcDevin
Forumember

Male Posts : 133
Reputation : 5
Language : English

http://ccxiqi.forumvi.com/

Back to top Go down

In progress Re: How to get the "Quote, code, spoiler, hide" buttons working like Forumotion?

Post by AlexisMcDevin on December 29th 2014, 6:55 pm

Hi @Ange Tuteur!

I need your help!

AlexisMcDevin
Forumember

Male Posts : 133
Reputation : 5
Language : English

http://ccxiqi.forumvi.com/

Back to top Go down

In progress Re: How to get the "Quote, code, spoiler, hide" buttons working like Forumotion?

Post by Ange Tuteur on December 29th 2014, 9:02 pm

Change your script to :
Code:
function selectCode(a){a=$(a).closest("dl, blockquote").find(".cont_code,code, .hidden, div")[0];if(window.getSelection){var c=window.getSelection();if(c.setBaseAndExtent)c.setBaseAndExtent(a,0,a,a.innerText.length-1);else{window.opera&&a.innerHTML.substring(a.innerHTML.length-4)=="<BR>"&&(a.innerHTML+=" ");var b=document.createRange();b.selectNodeContents(a);c.removeAllRanges();c.addRange(b)}}else document.getSelection?(c=document.getSelection(),b=document.createRange(),b.selectNodeContents(a),
c.removeAllRanges(),c.addRange(b)):document.selection&&(b=document.body.createTextRange(),b.moveToElementText(a),b.select())}
       
$(function(){
  var html = '<span onClick="selectCode(this)" class="selectCode">Select Content</span>';
  $("dl.codebox > dd, dl.codebox > dd").closest("dl").find('dt').append(html);
  $('blockquote').prepend(html);
});

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

In progress Re: How to get the "Quote, code, spoiler, hide" buttons working like Forumotion?

Post by AlexisMcDevin on December 29th 2014, 10:56 pm

Hi @Ange Tuteur,

I am using these codes below:
- CSS:
Code:
.selectCode { float:right; text-transform: uppercase; cursor:pointer; }
div.cont_code { clear: right; }

- Javascript Codes:
Code:
function selectCode(a){a=$(a).closest("dl, blockquote").find(".cont_code,code, .hidden, div")[0];if(window.getSelection){var c=window.getSelection();if(c.setBaseAndExtent)c.setBaseAndExtent(a,0,a,a.innerText.length-1);else{window.opera&&a.innerHTML.substring(a.innerHTML.length-4)=="<BR>"&&(a.innerHTML+=" ");var b=document.createRange();b.selectNodeContents(a);c.removeAllRanges();c.addRange(b)}}else document.getSelection?(c=document.getSelection(),b=document.createRange(),b.selectNodeContents(a),
c.removeAllRanges(),c.addRange(b)):document.selection&&(b=document.body.createTextRange(),b.moveToElementText(a),b.select())}
 
$(function(){
 var html = '<span onClick="selectCode(this)" class="selectCode">Select Content</span>';
 $("dl.codebox > dd, dl.codebox > dd").closest("dl").find('dt').append(html);
 $('blockquote').prepend(html);
});

And here is the testing result:



Can you review and let me know what wrong? How to fix these?

AlexisMcDevin
Forumember

Male Posts : 133
Reputation : 5
Language : English

http://ccxiqi.forumvi.com/

Back to top Go down

View previous topic View next topic Back to top


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