diff --git a/modules/editor/components/emoticon/tpl/popup.css b/modules/editor/components/emoticon/tpl/popup.css
index d091d39fe..734cce3e0 100644
--- a/modules/editor/components/emoticon/tpl/popup.css
+++ b/modules/editor/components/emoticon/tpl/popup.css
@@ -1,6 +1,5 @@
 @charset "utf-8";
-
 @import url(../../../../../modules/admin/tpl/css/admin.css);
-img.emoticon { margin:10px 10px 0 0; cursor:pointer; }
-.emoticonList { position:absolute; right:40px; top:4px;}
-
+@import url(../../../../../common/css/bootstrap.css);
+img.emoticon{ margin:10px 10px 0 0; cursor:pointer}
+#emoticons{padding:0 10px 20px 10px}
diff --git a/modules/editor/components/emoticon/tpl/popup.html b/modules/editor/components/emoticon/tpl/popup.html
index 4c0d9d757..3fe5aa7c7 100644
--- a/modules/editor/components/emoticon/tpl/popup.html
+++ b/modules/editor/components/emoticon/tpl/popup.html
@@ -1,11 +1,15 @@
-<!--%import("popup.js")-->
-<!--%import("popup.css")-->
-<h1 class="h1">{$component_info->title} ver. {$component_info->version}</h1>
-<div class="emoticonList">
-    <select name="list" id="selectEmoticonList">
-    <!--@foreach($emoticon_list as $key => $val)-->
-        <option <!--@if($val=='msn')-->selected="select"<!--@end--> value="{$val}">{$val}</option>
-    <!--@end-->
-    </select>
-</div>
-<div id="emoticons"></div>
+<load target="popup.js" />
+<load target="popup.css" />
+<section class="section">
+	<h1>{$component_info->title} ver. {$component_info->version}</h1>
+	<div class="x_clearfix">
+		<div class="x_pull-right">
+			<select name="list" id="selectEmoticonList">
+				<!--@foreach($emoticon_list as $key => $val)-->
+				<option <!--@if($val=='msn')-->selected="select"<!--@end--> value="{$val}">{$val}</option>
+				<!--@end-->
+			</select>
+		</div>
+	</div>
+	<div id="emoticons" style="height:1px"></div>
+</section>
diff --git a/modules/editor/components/image_gallery/tpl/popup.css b/modules/editor/components/image_gallery/tpl/popup.css
index 405940dfb..07ec5644c 100644
--- a/modules/editor/components/image_gallery/tpl/popup.css
+++ b/modules/editor/components/image_gallery/tpl/popup.css
@@ -1,6 +1,6 @@
 @charset "utf-8";
 @import url(../../../../../modules/admin/tpl/css/admin.css);
-
+@import url(../../../../../common/css/bootstrap.css);
 li { float:left; list-style:none; margin-right:5px; }
 
 img.bg_preview_color {
diff --git a/modules/editor/components/image_gallery/tpl/popup.html b/modules/editor/components/image_gallery/tpl/popup.html
index 1d1ad084e..c56e2e243 100644
--- a/modules/editor/components/image_gallery/tpl/popup.html
+++ b/modules/editor/components/image_gallery/tpl/popup.html
@@ -76,3 +76,84 @@
         <span class="btn"><a href="./?module=editor&amp;act=dispEditorComponentInfo&amp;component_name={$component_info->component_name}" target="_blank" onclick="window.open('this.href','ComponentInfo','width=10,height=10');return false;">{$lang->about_component}</a></span>
     </div>
 </form>
+<section cond="0" class="section">
+	<h1>{$component_info->title} ver. {$component_info->version}</h1>
+<form action="./" method="get" onSubmit="return false" id="fo" class="x_form-horizontal">
+	<input type="hidden" name="editor_sequence" value="{$editor_sequence}" />
+	<table class="x_table x_table-striped x_table-hover">
+		<div class="x_control-group">
+			<label for="" class="x_control-label">{$lang->width}</label>
+			<div class="x_controls">
+				<input type="text" size="3" id="width" value="400" />px
+			</div>
+		</div>
+		<div class="x_control-group">
+			<label for="" class="x_control-label">{$lang->gallery_style}</label>
+			<div class="x_controls">
+				<select id="gallery_style">
+					<option value="slide">{$lang->gallery_slide_style}</option>
+					<option value="list">{$lang->gallery_list_style}</option>
+				</select>
+			</div>
+		</div>
+		<div class="x_control-group">
+			<label for="" class="x_control-label">{$lang->gallery_slide_align}</label>
+			<div class="x_controls">
+			<select id="gallery_align">
+				<option value="center">{$lang->gallery_slide_center}</option>
+				<option value="left">{$lang->gallery_slide_left}</option>
+				<option value="right">{$lang->gallery_slide_right}</option>
+			</select>
+			</div>
+		</div>
+		<div class="x_control-group">
+			<label for="" class="x_control-label">{$lang->gallery_border_thickness}</label>
+			<div class="x_controls">
+				<input type="text" size="1" id="border_thickness" value="0" />px
+			</div>
+		</div>
+		<div class="x_control-group">
+			<label for="" class="x_control-label">{$lang->gallery_border_color}</label>
+			<div class="x_controls">
+				<div class="editor_color_box">
+					<script>
+					printColor("border", "{$tpl_path}/images/blank.gif");
+					</script>
+				</div>
+				<ul class="buttonLeft">
+					<li><img src="./images/border_solid.gif" alt="blank" class="border_preview_color" id="border_preview_color" /></li>
+					<li>#<input type="text" id="border_color_input" size="7" maxlength="6"  value="000000" onkeyup="manual_select_color('border',this)"/></li>
+				</ul>
+			</div>
+		</div>
+		<div class="x_control-group">
+			<label for="" class="x_control-label">{$lang->gallery_bg_color}</label>
+			<div class="x_controls">
+				<div class="editor_color_box">
+					<script>
+						printColor("bg", "{$tpl_path}/images/blank.gif");
+					</script>
+				</div>
+				<ul class="buttonLeft">
+					<li><img src="./images/blank.gif" alt="blank" class="bg_preview_color" id="bg_preview_color" /></li>
+					<li>#<input type="text" id="bg_color_input" size="7" maxlength="6"  value="FFFFFF" onkeyup="manual_select_color('bg',this)"/></li>
+				</ul>
+			</div>
+		</div>
+		<div class="x_control-group">
+			<label for="" class="x_control-label">{$lang->image_list}</label>
+			<div class="x_controls">
+				<select id="image_list" size="6" multiple="true" class="image_list">
+				</select>
+				<p>{$lang->about_image_list}</p>
+			</div>
+		</div>
+		<div class="x_clearfix btnArea">
+			<div class="x_pull-right">
+				<button type="button" class="x_btn x_btn-primary" onclick="insertSlideShow()">{$lang->cmd_insert}</button>
+				<a class="x_btn" href="./?module=editor&amp;act=dispEditorComponentInfo&amp;component_name={$component_info->component_name}" target="_blank" onclick="window.open('this.href','ComponentInfo','width=10,height=10');return false;">{$lang->about_component}</button>
+			</div>
+		</div>
+	</form>
+</section>
+
diff --git a/modules/editor/components/image_gallery/tpl/popup.min.css b/modules/editor/components/image_gallery/tpl/popup.min.css
index 7da195434..5b0f523ef 100644
--- a/modules/editor/components/image_gallery/tpl/popup.min.css
+++ b/modules/editor/components/image_gallery/tpl/popup.min.css
@@ -3,4 +3,4 @@
  * @brief Slideshow type image gallery plugin
  * @author NHN (developers@xpressengine.com)
  **/
-@charset "utf-8";@import "../../../../../modules/admin/tpl/css/admin.css";li{float:left;list-style:none;margin-right:5px}img.bg_preview_color{width:30px;height:16px;border:1px solid #000000;background-color:#FFFFFF}img.border_preview_color{width:30px;height:16px;border:1px solid #EEEEEE;background-color:#000000}img.color_icon{width:14px;height:14px;border:1px solid #FFFFFF}img.color_icon_over{width:14px;height:14px;border:1px solid #000000;cursor:pointer}.editor_color_box{clear:both;height:65px;width:400px;border:1px solid #DDDDDD;padding:2px}.image_list{width:100%;border:1px solid #EEEEEE;height:200px !important}
\ No newline at end of file
+@charset "utf-8";@import "../../../../../modules/admin/tpl/css/admin.css";@import url(../../../../../common/css/bootstrap.css);li{float:left;list-style:none;margin-right:5px}img.bg_preview_color{width:30px;height:16px;border:1px solid #000000;background-color:#FFFFFF}img.border_preview_color{width:30px;height:16px;border:1px solid #EEEEEE;background-color:#000000}img.color_icon{width:14px;height:14px;border:1px solid #FFFFFF}img.color_icon_over{width:14px;height:14px;border:1px solid #000000;cursor:pointer}.editor_color_box{clear:both;height:65px;width:400px;border:1px solid #DDDDDD;padding:2px}.image_list{width:100%;border:1px solid #EEEEEE;height:200px !important}
diff --git a/modules/editor/components/image_link/tpl/popup.css b/modules/editor/components/image_link/tpl/popup.css
index 35a990cc9..42130c17e 100644
--- a/modules/editor/components/image_link/tpl/popup.css
+++ b/modules/editor/components/image_link/tpl/popup.css
@@ -1,5 +1,6 @@
 @charset "utf-8";
 @import url(../../../../../modules/admin/tpl/css/admin.css);
+@import url(../../../../../common/css/bootstrap.css);
 
 .image_align {
     margin:0px 0px 5px 0px;
diff --git a/modules/editor/components/image_link/tpl/popup.html b/modules/editor/components/image_link/tpl/popup.html
index f4f7601b5..d95a2336c 100644
--- a/modules/editor/components/image_link/tpl/popup.html
+++ b/modules/editor/components/image_link/tpl/popup.html
@@ -1,86 +1,83 @@
 <!--%import("popup.js")-->
 <!--%import("popup.css")-->
 <!--%import("../lang")-->
-<h1 class="h1">{$component_info->title} ver. {$component_info->version}</h1>
-<form action="./" method="get" onSubmit="return false" id="fo">
-
-	<table class="x_table x_table-striped x_table-hover">
-	<col width="100" />
-	<col />
-	<tr>
-		<th scope="row">{$lang->image_url}</th>
-		<td><input type="text" id="image_url" value="{url_decode($manual_url)}" /></td>
-	</tr>
-	<tr>
-		<th scope="row">{$lang->image_scale}</th>
-		<td>
-			<ul>
-				<li><input type="text" id="width" value="0" size="4" />px </li>
-				<li><input type="text" id="height" value="0" size="4" />px </li>
-				<li><button type="button" id="get_scale">{$lang->cmd_get_scale}</button></li>
-			</ul>
-		</td>
-	</tr>
-	<tr>
-		<th scope="row">URL</th>
-		<td><input type="text" id="link_url" value=""/></td>
-	</tr>
-	<tr>
-		<th scope="row">{$lang->urllink_open_window}</th>
-		<td><input type="checkbox" id="open_window" value="Y" /> {$lang->about_url_link_open_window}</td>
-	</tr>
-	<tr>
-		<th scope="row">{$lang->image_alt}</th>
-		<td><input type="text" id="image_alt" value=""/></td>
-	</tr>
-	<tr>
-		<th scope="row">{$lang->image_align}</th>
-		<td>
-			<div class="image_align">
-				<input type="radio" name="align" value="" id="align_normal" checked="checked"/>
+<section class="section">
+	<h1>{$component_info->title} ver. {$component_info->version}</h1>
+	<form action="./" method="get" onSubmit="return false" id="fo" class="x_form-horizontal">
+		<div class="x_control-group">
+			<label for="image_url" class="x_control-label">{$lang->image_url}</label>
+			<div class="x_controls">
+				<input type="text" id="image_url" value="{url_decode($manual_url)}" />
+			</div>
+		</div>
+		<div class="x_control-group">
+			<label class="x_control-label">{$lang->image_scale}</label>
+			<div class="x_controls">
+				<input type="text" id="width" value="0" size="4" style="width:80px" /> px
+				<input type="text" id="height" value="0" size="4" style="width:80px" /> px
+				<button type="button" id="get_scale" class="x_btn">{$lang->cmd_get_scale}</button>
+			</div>
+		</div>
+		<div class="x_control-group">
+			<label for="link_url" class="x_control-label">URL</label>
+			<div class="x_controls">
+				<input type="text" id="link_url" value=""/>
+			</div>
+		</div>
+		<div class="x_control-group">
+			<label for="open_window" class="x_control-label">{$lang->urllink_open_window}</label>
+			<div class="x_controls">
+				<input type="checkbox" id="open_window" value="Y" /> {$lang->about_url_link_open_window}
+			</div>
+		</div>
+		<div class="x_control-group">
+			<label for="image_alt" class="x_control-label">{$lang->image_alt}</label>
+			<div class="x_controls">
+				<input type="text" id="image_alt" value=""/>
+			</div>
+		</div>
+		<div class="x_control-group">
+			<label class="x_control-label">{$lang->image_align}</label>
+			<div class="x_controls">
 				<label for="align_normal">
+					<input type="radio" name="align" value="" id="align_normal" checked="checked"/>
 					<img src="./images/align_normal.gif" alt="{$lang->image_align_normal}" />
 					{$lang->image_align_normal}
 				</label>
-			</div>
-
-			<div class="image_align">
-				<input type="radio" name="align" value="left" id="align_left" />
 				<label for="align_left">
+					<input type="radio" name="align" value="left" id="align_left" />
 					<img src="./images/align_left.gif" alt="{$lang->image_align_left}" />
 					{$lang->image_align_left}
 				</label>
-			</div>
-
-			<div class="image_align">
-				<input type="radio" name="align" value="middle" id="align_middle" />
 				<label for="align_middle">
+					<input type="radio" name="align" value="middle" id="align_middle" />
 					<img src="./images/align_middle.gif" alt="{$lang->image_align_middle}" />
 					{$lang->image_align_middle}
 				</label>
-			</div>
-
-			<div class="image_align">
-				<input type="radio" name="align" value="right" id="align_right" />
 				<label for="align_right">
+					<input type="radio" name="align" value="right" id="align_right" />
 					<img src="./images/align_right.gif" alt="{$lang->image_align_right}" />
 					{$lang->image_align_right}
 				</label>
 			</div>
-		</td>
-	</tr>
-	<tr>
-		<th scope="row">{$lang->image_border}</th>
-		<td><input type="text" id="image_border" value="0" size="2" />px</td>
-	</tr>
-	<tr>
-		<th scope="row">{$lang->image_margin}</th>
-		<td><input type="text" id="image_margin" value="0" size="2" />px</td>
-	</tr>
-	</table>
-    <div class="btnArea">
-        <span class="btn"><button type="button" id="btn_insert">{$lang->cmd_insert}</button></span>
-        <span class="btn"><a href="./?module=editor&amp;act=dispEditorComponentInfo&amp;component_name={$component_info->component_name}" target="_blank" onclick="window.open('this.href','ComponentInfo','width=10,height=10');return false;">{$lang->about_component}</a></span>
-    </div>
-
-</form>
+		</div>
+		<div class="x_control-group">
+			<label for="image_border" class="x_control-label">{$lang->image_border}</label>
+			<div class="x_controls">
+				<input type="text" id="image_border" value="0" size="2" />px
+			</div>
+		</div>
+		<div class="x_control-group">
+			<label for="image_margin" class="x_control-label">{$lang->image_margin}</label>
+			<div class="x_controls">
+				<input type="text" id="image_margin" value="0" size="2" />px
+			</div>
+		</div>
+		<div class="x_clearfix btnArea">
+			<div class="x_pull-right">
+				<button type="button" id="btn_insert" class="x_btn x_btn-primary">{$lang->cmd_insert}</button>
+				<a class="x_btn" href="{getUrl('','module','editor','act','dispEditorComponentInfo','component_name',$component_info->component_name)}" target="_blank" onclick="window.open(this.href,'ComponentInfo','width=10,height=10');return false;">{$lang->about_component}</a>
+			</div>
+		</div>
+	</form>
+</section>
diff --git a/modules/editor/components/multimedia_link/tpl/popup.css b/modules/editor/components/multimedia_link/tpl/popup.css
index e4e3745ef..5384d2f06 100644
--- a/modules/editor/components/multimedia_link/tpl/popup.css
+++ b/modules/editor/components/multimedia_link/tpl/popup.css
@@ -1,2 +1,4 @@
 @charset "utf-8";
 @import url(../../../../../modules/admin/tpl/css/admin.css);
+@import url(../../../../../common/css/bootstrap.css);
+
diff --git a/modules/editor/components/multimedia_link/tpl/popup.html b/modules/editor/components/multimedia_link/tpl/popup.html
index 1fe7446b3..225e230ed 100644
--- a/modules/editor/components/multimedia_link/tpl/popup.html
+++ b/modules/editor/components/multimedia_link/tpl/popup.html
@@ -6,45 +6,55 @@
 	<load target="popup.min.css" />
 	<load target="popup.min.js" />
 <!--@end-->
-<h1 class="h1">{$component_info->title} ver. {$component_info->version}</h1>
-<form action="./" method="get" onsubmit="return false" id="fo">
-	<table class="x_table x_table-striped x_table-hover">
-	<col width="150" />
-	<col />
-	<tr>
-		<th scope="row"><div>{$lang->multimedia_url}</div></th>
-		<td><input type="text" id="multimedia_url" value="{$manual_url}" /></td>
-	</tr>
-	<tr>
-		<th scope="row"><div>{$lang->multimedia_caption}</div></th>
-		<td><input type="text" id="multimedia_caption" value="" /></td>
-	</tr>
-	<tr>
-		<th scope="row"><div>{$lang->multimedia_width}</div></th>
-		<td><input type="text"  size="3" id="multimedia_width" value="400" />px</td>
-	</tr>
-	<tr>
-		<th scope="row"><div>{$lang->multimedia_height}</div></th>
-		<td><input type="text"  size="3" id="multimedia_height" value="400" />px</td>
-	</tr>
-	<tr>
-		<th scope="row"><div>{$lang->multimedia_auto_start}</div></th>
-		<td><input type="checkbox" id="multimedia_auto_start" value="Y" /></td>
-	</tr>
-	<tr>
-		<th scope="row"><div>{$lang->multimedia_wmode}</div></th>
-		<td>
-			<select id="multimedia_wmode">
-				<option value="window">{$lang->multimedia_wmode_window}</option>
-				<option value="opaque">{$lang->multimedia_wmode_opaque}</option>
-				<option value="transparent" selected="selected">{$lang->multimedia_wmode_transparent}</option>
-			</select>
-			<p>{$lang->about_ccl_allow_modification}</p>
-		</td>
-	</table>
-    <div class="btnArea">
-        <span class="btn"><button type="button">{$lang->cmd_insert}</button></span>
-        <span class="btn"><a href="./?module=editor&amp;act=dispEditorComponentInfo&amp;component_name={$component_info->component_name}" target="_blank">{$lang->about_component}</a></span>
-    </div>
-
-</form>
+<section class="section">
+	<h1>{$component_info->title} ver. {$component_info->version}</h1>
+	<form action="./" method="get" onsubmit="return false" id="fo" class="x_form-horizontal">
+		<div class="x_control-group">
+			<label for="" class="x_control-label">{$lang->multimedia_url}</label>
+			<div class="x_controls">
+				<input type="text" id="multimedia_url" value="{$manual_url}" />
+			</div>
+		</div>
+		<div class="x_control-group">
+			<label for="" class="x_control-label">{$lang->multimedia_caption}</label>
+			<div class="x_controls">
+				<input type="text" id="multimedia_caption" value="" />
+			</div>
+		</div>
+		<div class="x_control-group">
+			<label for="" class="x_control-label">{$lang->multimedia_width}</label>
+			<div class="x_controls">
+				<input type="text"  size="3" id="multimedia_width" value="400" /> px
+			</div>
+		</div>
+		<div class="x_control-group">
+			<label for="" class="x_control-label">{$lang->multimedia_height}</label>
+			<div class="x_controls">
+				<input type="text"  size="3" id="multimedia_height" value="400" /> px
+			</div>
+		</div>
+		<div class="x_control-group">
+			<label for="" class="x_control-label">{$lang->multimedia_auto_start}</label>
+			<div class="x_controls">
+				<input type="checkbox" id="multimedia_auto_start" value="Y" />
+			</div>
+		</div>
+		<div class="x_control-group">
+			<label for="" class="x_control-label">{$lang->multimedia_wmode}</label>
+			<div class="x_controls">
+				<select id="multimedia_wmode">
+					<option value="window">{$lang->multimedia_wmode_window}</option>
+					<option value="opaque">{$lang->multimedia_wmode_opaque}</option>
+					<option value="transparent" selected="selected">{$lang->multimedia_wmode_transparent}</option>
+				</select>
+				<p>{$lang->about_ccl_allow_modification}</p>
+			</div>
+		</div>
+		<div class="x_clearfix btnArea">
+			<div class="x_pull-right">
+				<button type="button" id="btn_insert" class="x_btn x_btn-primary">{$lang->cmd_insert}</button>
+				<a class="x_btn" href="{getUrl('','module','editor','act','dispEditorComponentInfo','component_name',$component_info->component_name)}" target="_blank" onclick="window.open(this.href,'ComponentInfo','width=10,height=10');return false;">{$lang->about_component}</a>
+			</div>
+		</div>
+	</form>
+</section>