diff --git a/js/theme.js b/js/theme.js
index 690c774186..b81c94cf3c 100644
--- a/js/theme.js
+++ b/js/theme.js
@@ -40,6 +40,7 @@ $(document).ready(function(){
 	}
 
 	// give select fields an boostrap classes
+	// @todo: this needs to be changed in friendica core
 	$(".field.select, .field.custom").addClass("form-group");
 	$(".field.select > select, .field.custom > select").addClass("form-control");
 
diff --git a/templates/field_custom.tpl b/templates/field_custom.tpl
new file mode 100644
index 0000000000..20f529278d
--- /dev/null
+++ b/templates/field_custom.tpl
@@ -0,0 +1,6 @@
+
+<div class="form-group field custom">
+	<label for="{{$field.0}}">{{$field.1}}</label>
+	{{$field.2}}
+	<span class="help-block" id="{{$field.0}}_tip">{{$field.3}}</span>
+</div>
diff --git a/templates/field_select.tpl b/templates/field_select.tpl
new file mode 100644
index 0000000000..9c03151214
--- /dev/null
+++ b/templates/field_select.tpl
@@ -0,0 +1,8 @@
+
+<div class="form-group field select">
+		<label for="id_{{$field.0}}">{{$field.1}}</label>
+		<select name="{{$field.0}}" id="id_{{$field.0}}" class="form-control" aria-describedby="{{$field.0}}_tip">
+			{{foreach $field.4 as $opt=>$val}}<option value="{{$opt|escape:'html'}}" {{if $opt==$field.2}}selected="selected"{{/if}}>{{$val}}</option>{{/foreach}}
+		</select>
+		<span class="help-block" id="{{$field.0}}_tip">{{$field.3}}</span>
+</div>
\ No newline at end of file
diff --git a/templates/field_select_raw.tpl b/templates/field_select_raw.tpl
new file mode 100644
index 0000000000..d4f4768603
--- /dev/null
+++ b/templates/field_select_raw.tpl
@@ -0,0 +1,8 @@
+
+<div class="form-group field select">
+	<label for="id_{{$field.0}}">{{$field.1}}</label>
+	<select class="form-control" name="{{$field.0}}" id="id_{{$field.0}}" aria-describedby="{{$field.0}}_tip">
+		{{$field.4}}
+	</select>
+	<span class="help-block" id="{{$field.0}}_tip">{{$field.3}}</span>
+</div>
\ No newline at end of file
diff --git a/templates/field_themeselect.tpl b/templates/field_themeselect.tpl
new file mode 100644
index 0000000000..04f4e82b1c
--- /dev/null
+++ b/templates/field_themeselect.tpl
@@ -0,0 +1,10 @@
+
+{{if $field.5=="preview"}}<script>$(document).ready(function(){ previewTheme($("#id_{{$field.0}}")[0]); });</script>{{/if}}
+<div class="form-group field select">
+	<label for="id_{{$field.0}}">{{$field.1}}</label>
+	<select class="form-control" name="{{$field.0}}" id="id_{{$field.0}}" {{if $field.5=="preview"}}onchange="previewTheme(this);"{{/if}} aria-describedby="{{$field.0}}_tip" >
+		{{foreach $field.4 as $opt=>$val}}<option value="{{$opt}}" {{if $opt==$field.2}}selected="selected"{{/if}}>{{$val}}</option>{{/foreach}}
+	</select>
+	<span class="help-block" id="{{$field.0}}_tip">{{$field.3}}</span>
+	{{if $field.5=="preview"}}<div id="theme-preview"></div>{{/if}}
+</div>
\ No newline at end of file