Type of Site:

I want a select script code to show above the "Title of the topic" when members open a new topic they choose what type of sites they have just for one section Request Center. -> http://forumdirectory.forumotion.net/f16-request-center

Is your site a website, blog, or forum? with 3 option

Website
Blog
Forum

Anyone knows...

Hi @Mati,

Just to clarify ; You want a selection drop down before the topic title input field, and when you select an option it'll add it to the beginning of the topic title, correct ?

That's correct.

Try the following.

Go to Modules > JavaScript codes management > Create a new script

Placement : In all the pages

Code:

$(function() {
  var config = {
    name : '<strong>Select your website type :</strong> ',
    option : {
      'Is your site a website, blog, or forum?' : 'DEFAULT',
      'Website' : 'Website',
      'Blog' : 'Blog',
      'Forum' : 'Forum'
    }
  },
  bloc, select, i;

  if (document.post && document.post.f && document.post.f.value == 16) {
    select = document.createElement('SELECT');
    bloc = document.createElement('DL');

    for (i in config.option) select.innerHTML += '<option value="' + config.option[i] + '">' + i + '</option>';
   
    select.onchange = function() {
      var sujet = document.post.subject;
     
      if (this.value == 'DEFAULT') sujet.value = sujet.value.replace(/^\[.*?\]\s/, '');
      else {
        if (/^\[.*?\]\s/.test(sujet.value)) sujet.value = sujet.value.replace(/^\[.*?\]\s/, '');
        sujet.value = '[' + this.value + '] ' + sujet.value;
      }
    };


    bloc.innerHTML = '<dt><label>' + config.name + '</label></dt><dd></dd>';
    bloc.getElementsByTagName('DD')[0].appendChild(select);

    document.post.subject.parentNode.parentNode.parentNode.insertBefore(bloc, document.post.subject.parentNode.parentNode);
  }
});

At the top you can change the label, and option names : values.

If any questions let me know.

Works perfect how I wanna it xD but is it possible to add classes for each of them

Code:

<div class="text_forum">Forum</div>
<div class="text_blog">Blog</div>
<div class="text_web">Website</div>

So I can style it with CSS.

Replace the script with this :

Code:

$(function() {
  var config = {
    name : '<strong>Select your website type :</strong> ',
    option : {
      'Is your site a website, blog, or forum?' : ['DEFAULT', 'text_default'],
      'Website' : ['Website', 'text_web'],
      'Blog' : ['Blog', 'text_blog'],
      'Forum' : ['Forum', 'text_forum']
    }
  },
  bloc, select, i;

  if (document.post && document.post.f && document.post.f.value == 16) {
    select = document.createElement('SELECT');
    bloc = document.createElement('DL');

    for (i in config.option) select.innerHTML += '<option value="' + config.option[i][0] + '" '+ (config.option[i][1] ? 'class="' + config.option[i][1] + '"' : '') +'>' + i + '</option>';
   
    select.onchange = function() {
      var sujet = document.post.subject;
     
      if (this.value == 'DEFAULT') sujet.value = sujet.value.replace(/^\[.*?\]\s/, '');
      else {
        if (/^\[.*?\]\s/.test(sujet.value)) sujet.value = sujet.value.replace(/^\[.*?\]\s/, '');
        sujet.value = '[' + this.value + '] ' + sujet.value;
      }
    };


    bloc.innerHTML = '<dt><label>' + config.name + '</label></dt><dd></dd>';
    bloc.getElementsByTagName('DD')[0].appendChild(select);

    document.post.subject.parentNode.parentNode.parentNode.insertBefore(bloc, document.post.subject.parentNode.parentNode);
  }
});

I changed the value into an array :
['VALUE', 'CLASSNAME']

class name is optional of course.

Ain't working I have made a topic as you can see http://forumdirectory.forumotion.net/f16-request-center there is no class?

Oh, you mean style the texts in the title ? You'd need to set a JavaScript in the sub-forums. Use this :

Code:

$(function() {
  var keywords = {
    '[Forum]' : 'tag-forum',
    '[Blog]' : 'tag-blog',
    '[Website]' : 'tag-website'
  },
  title = $('a.topictitle'), i = 0, j = title.length, k, str, reg;

  for (; i < j; i++) {
    str = title[i].innerHTML;
    for (k in keywords) {
      reg = new RegExp('^' + k.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"), 'i');
      if (reg.test(str)) {
        title[i].innerHTML = str.replace(reg, '<span class="' + keywords[k] + '">' + k.replace(/\[|\]/g, '') + '</span>');
        break;
      }
    }
  }
});

At the top is an object which contains the tag name + the class you want applied to it. Then you just need to use CSS to style the texts.

Is this solved @Mati or still on going?

-Brandon