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.

Topic Prefix

View previous topic View next topic Go down

In progress Topic Prefix

Post by prenianle on August 31st 2014, 8:42 am

Hello Forumotion Team!

How can i put these topic prefix instead of using Topic icons? I've notice this (on my screenshot) and it looks nice and organize to viewers.

Thank you!


prenianle
Forumember

Female Posts : 83
Reputation : 2
Language : English

http://pinoyportal.forumsline.com

Back to top Go down

In progress Re: Topic Prefix

Post by Ange Tuteur on August 31st 2014, 8:52 am

Hello prenianle,

See if this tutorial is what you're looking for :
http://help.forumotion.com/t133869-style-topic-title-keywords#901194

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2684
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

In progress Re: Topic Prefix

Post by Luffy on August 31st 2014, 8:57 am

Hello,

Go to:
Admin Panel >> Modules >> Javascript Management -> Create a new Javascript
Fill in the information:
Title: Perfixed
Placement: In all the pages
Code:
Code:
jQuery(document).ready(function(){jQuery(".tcl.tdtopics, .module a, .tcr a, .posthead a, .pun-crumbs p, .pun h2, .pun h3, .pun input, .pun select, .pun th").each(function(){jQuery(this).html(jQuery(this).html().replace(/perfix1/g,"<span id='perfix1'>Perfix1</span> "))})});

jQuery(document).ready(function(){jQuery(".tcl.tdtopics, .module a, .tcr a, .posthead a, .pun-crumbs p, .pun h2, .pun h3, .pun input, .pun select, .pun th").each(function(){jQuery(this).html(jQuery(this).html().replace(/perfix2/g,"<span id='Perfix2'>Perfix2</span> "))})});

function tagprefixo(){jQuery("input[name=subject]").val(jQuery("select[name=tags4]").val()+jQuery("input[name=subject]").val())}jQuery(document).ready(function(){jQuery('input[name="subject"]').after('<dd/><select name=tags4 onchange=tagprefixo()><option value="">No Option</option><option value="perfix1">Perfix1</option><option value="perfix2">Perfix2</option></select> ')});

jQuery(document).ready(function(){var b=jQuery("input[value=reply]").val();"reply"==b?jQuery("select[name=tags4]").css("display","none"):"quote"==b&&jQuery("select[name=tags4]").css("display","none")});
Change the perfix1 and perfix2 with the ones you want!
And Save it.

Then go to:
Admin Panel >> Display >> Pictures & Colors >> Colors -> CSS Stylesheet
and add the below code:
Code:
#perfix1{background:blue;border-radius:3px;color:#fff;font-size:9px!important;font-weight:bold;margin:1px;padding:2px 3px;text-shadow:0 0 5px #808080;}
#perfix2{background:red;border-radius:3px;color:#fff;font-size:9px!important;font-weight:bold;margin:1px;padding:2px 3px;text-shadow:0 0 5px #808080;}
Change the perfix1 and perfix2 with the names you gave in the javascript.
And Save it.

To add more perfixes just duplicate the codes and add the style you want in the CSS using the # and the name you gave your perfix.


MrMind

Luffy
Manager
Manager

Male Posts : 4035
Reputation : 407
Language : Greek, English
Location : Greece

http://www.thinktankforum.net

Back to top Go down

In progress Re: Topic Prefix

Post by prenianle on August 31st 2014, 9:09 am

Thank you for the link Ange and the tutorial MrMind. I will add description of my problem and later i will perform that.

This is what i mean. As we can see in my screenshot, when i click that orange icon, it will show to me the list of the prefix that i want to add in my topic.


(Im sorry if i post screenshot of this because this is from other site. Credits to them.)

prenianle
Forumember

Female Posts : 83
Reputation : 2
Language : English

http://pinoyportal.forumsline.com

Back to top Go down

In progress Re: Topic Prefix

Post by Luffy on August 31st 2014, 9:11 am

Is that forum a FM forum ?






Luffy
Manager
Manager

Male Posts : 4035
Reputation : 407
Language : Greek, English
Location : Greece

http://www.thinktankforum.net

Back to top Go down

In progress Re: Topic Prefix

Post by prenianle on August 31st 2014, 9:15 am

Sir im sorry. I get that to the other forum and not an FM forum and i should ask that do we have that feature in our forum.
If we have, please help me

Anyways i will try your suggestions MrMind and Ange

prenianle
Forumember

Female Posts : 83
Reputation : 2
Language : English

http://pinoyportal.forumsline.com

Back to top Go down

In progress Re: Topic Prefix

Post by AngelaHolmes on August 31st 2014, 9:24 am

@prenianle wrote:Sir im sorry. I get that to the other forum and not an FM forum and i should ask that do we have that feature in our forum.
If we have, please help me

Anyways i will try your suggestions MrMind and Ange

Hello,

I get that to the other forum and not an FM forum and i should ask that do we have that feature in our forum.

'In our forum' is that a FM forum or not if it isn't please post the host name.

AngelaHolmes
Forumember

Male Posts : 203
Reputation : 8
Language : English
Location : England

http://Help.Forumotion.com

Back to top Go down

In progress Re: Topic Prefix

Post by Ange Tuteur on August 31st 2014, 9:25 am

There are prefixes, however, they do not have styles. They're merely text tags such as : [Solved]

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2684
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

In progress Re: Topic Prefix

Post by AngelaHolmes on August 31st 2014, 9:28 am

But also you can change the design;

As I seen you posted in this topic where this image is posted.

AngelaHolmes
Forumember

Male Posts : 203
Reputation : 8
Language : English
Location : England

http://Help.Forumotion.com

Back to top Go down

In progress Re: Topic Prefix

Post by Ramdaman on August 31st 2014, 3:24 pm

MrMind wrote:Hello,

Go to:
Admin Panel >> Modules >> Javascript Management -> Create a new Javascript
Fill in the information:
Title: Perfixed
Placement: In all the pages
Code:
Code:
jQuery(document).ready(function(){jQuery(".tcl.tdtopics, .module a, .tcr a, .posthead a, .pun-crumbs p, .pun h2, .pun h3, .pun input, .pun select, .pun th").each(function(){jQuery(this).html(jQuery(this).html().replace(/perfix1/g,"<span id='perfix1'>Perfix1</span> "))})});

jQuery(document).ready(function(){jQuery(".tcl.tdtopics, .module a, .tcr a, .posthead a, .pun-crumbs p, .pun h2, .pun h3, .pun input, .pun select, .pun th").each(function(){jQuery(this).html(jQuery(this).html().replace(/perfix2/g,"<span id='Perfix2'>Perfix2</span> "))})});

function tagprefixo(){jQuery("input[name=subject]").val(jQuery("select[name=tags4]").val()+jQuery("input[name=subject]").val())}jQuery(document).ready(function(){jQuery('input[name="subject"]').after('<dd/><select name=tags4 onchange=tagprefixo()><option value="">No Option</option><option value="perfix1">Perfix1</option><option value="perfix2">Perfix2</option></select> ')});

jQuery(document).ready(function(){var b=jQuery("input[value=reply]").val();"reply"==b?jQuery("select[name=tags4]").css("display","none"):"quote"==b&&jQuery("select[name=tags4]").css("display","none")});
Change the perfix1 and perfix2 with the ones you want!
And Save it.

Then go to:
Admin Panel >> Display >> Pictures & Colors >> Colors -> CSS Stylesheet
and add the below code:
Code:
#perfix1{background:blue;border-radius:3px;color:#fff;font-size:9px!important;font-weight:bold;margin:1px;padding:2px 3px;text-shadow:0 0 5px #808080;}
#perfix2{background:red;border-radius:3px;color:#fff;font-size:9px!important;font-weight:bold;margin:1px;padding:2px 3px;text-shadow:0 0 5px #808080;}
Change the perfix1 and perfix2 with the names you gave in the javascript.
And Save it.

To add more perfixes just duplicate the codes and add the style you want in the CSS using the # and the name you gave your perfix.


MrMind

Is there a way you can style these? Like make an [APPROVED] to be bold and lime colored?

I did the following in my CSS.

Code:
#[APPROVED]{background:red;border-radius:3px;color:#fff;font-size:9px!important;font-weight:bold;margin:1px;padding:2px 3px;text-shadow:0 0 5px #32CD32;}

EDIT:

This occurred.

http://i.imgur.com/YMnnlRv.jpg


This is my JS coding.


Code:
jQuery(document).ready(function(){jQuery(".tcl.tdtopics, .module a, .tcr a, .posthead a, .pun-crumbs p, .pun h2, .pun h3, .pun input, .pun select, .pun th").each(function(){jQuery(this).html(jQuery(this).html().replace(/[SOLVED]/g,"<span id='[SOLVED]'>[SOLVED]</span> "))})});


jQuery(document).ready(function(){jQuery(".tcl.tdtopics, .module a, .tcr a, .posthead a, .pun-crumbs p, .pun h2, .pun h3, .pun input, .pun select, .pun th").each(function(){jQuery(this).html(jQuery(this).html().replace(/[APPROVED]/g,"<span id='[APPROVED]'>[APPROVED]</span> "))})});


function tagprefixo(){jQuery("input[name=subject]").val(jQuery("select[name=tags4]").val()+jQuery("input[name=subject]").val())}jQuery(document).ready(function(){jQuery('input[name="subject"]').after('<dd/><select name=tags4 onchange=tagprefixo()><option value="">No Option</option><option value="[SOLVED]">[SOLVED]</option><option value="[APPROVED]">[APPROVED]</option></select> ')});


jQuery(document).ready(function(){var b=jQuery("input[value=reply]").val();"reply"==b?jQuery("select[name=tags4]").css("display","none"):"quote"==b&&jQuery("select[name=tags4]").css("display","none")});

Ramdaman
Active Poster

Male Posts : 1614
Reputation : 96
Language : English, Albanian, Macedonian, Russian | HTML, CSS
Location : New York City

http://ndihme.forumotion.com/forum

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